-->
<div class="tjkw-map-wrap">
<div ref="mapWrap" class="tianjinkaiwu-base-map">
v-if="drillDown.isDrillDown()"
type="primary"
size="small"
class="tjkw-btnBack"
icon="el-icon-arrow-left"
@click="drillUp"
>返回
<img src="@/assets/img/wangge.png" style="display:none" alt="" srcset="" ref="bgImg">
import { serieStyle, DrillDown, MapStore }from '@/components/gChart/helpers'
import commonMixinfrom 'widget/views/mixins'
import {
mapType,
getCustomerDistributionProjectCount,
getCustomerDistributionProjectInfo,
convertLinesData,
convertScattersData
}from './utils'
function filterName (name ='') {
return name.replace('省', '').replace('市', '').replace('自治区')
}
export default {
name:'TianjinkaiwuBaseMap',
mixins: [commonMixin],
props: {
type:{
type:String,
},
// 飞线颜色
lineColor: {
type:String,
default:'#a6c84c'
},
// 项目点颜色
effectScatterColor: {
type:String,
default:'#a6c84c'
},
// 迁徙线数据
// [[起点名, 终点名], [起点名, 终点名]...]
linesData: {
type:Array,
default: () => []
},
// 分布点数据
// [[地名, value], [地名, value]...]
effectScatterData: {
type:Array,
default: () => []
},
// 地图类型
mapType: {
type:String,
required:true,
validator (val) {
return !!mapType[val]
}
},
startPointName: {
required:true,
type:String,
default:'天津'
},
// 企业详情的列名和列值
columns: {
type:Array,
default: () => []
}
},
data () {
return {
mapStore:null,
mapName:'china',
chartInstance:null,
drillDown:null,
linesCoordData: [],
scattersCoordData: [],
linesNameData: [],
scattersNameData: [],
originData: [],
projectInfo: [],
enumColor:['#47A0FF','#28E3F2','#32DEA2','#7BDE7C']
}
},
methods: {
getCustomerDistributionProjectCount () {
const params = {
tenantId:this.tenantId,
type:this.mapType
}
return getCustomerDistributionProjectCount(params).then(res => {
const {data = []} = res || {}
this.originData = data
this.linesNameData =convertLinesData(data, this.startPointName)
this.scattersNameData =convertScattersData(data)
})
},
getCustomerDistributionProjectInfo (cityName) {
const params = {
tenantId:this.tenantId,
type:this.mapType,
city: cityName
}
return getCustomerDistributionProjectInfo(params).then(res => {
const {data = []} = res || {}
this.projectInfo = data
})
},
// 名称可能带省或市的，这里适配处理
getCoordByName (map, name ='') {
const coord = map[name] ||
map[name.replace('省', '')] ||
map[name.replace('市', '')] ||
map[name.replace('区', '')] ||
map[name.replace('自治区', '')] ||
map[name.replace('自治州', '')]
if (coord) {
return coord
}
},
getCoordFromOriginDataByName (data, name) {
return data.find(item => {
const {province} = item
return filterName(province) ===filterName(name)
})
},
// 将迁徙线的名称数组转化为坐标数组
convertLinesNameDataToCoordData (val = []) {
this.linesCoordData = val.reduce((arr, item) => {
const [startPointName, endPointName, value] = item
const coordMap =this.mapStore.coordMap
const startCoord =this.getCoordByName(coordMap, startPointName)
const endCoord =this.getCoordByName(coordMap, endPointName)
if (startCoord && endCoord) {
arr.push([
{coord: startCoord.cp},
{coord: endCoord.cp,value}
])
}
return arr
}, [])
},
// 将分布点的名称数组转化为坐标数组
convertScattersNameDataToCoordData (val = []) {
this.scattersCoordData = val.reduce((arr, item) => {
const [provinceName, value] = item
const coordMap =this.mapStore.coordMap
const coordItem =this.getCoordByName(coordMap, provinceName)
if (coordItem) {
arr.push({
name: provinceName,
value: [...coordItem.cp, value]
})
}
return arr
}, [])
},
// 将分布点的名称数组转化为坐标数组
convertScattersNameDataToCoordDataOfProvince (val = [], provinceName) {
const coordMap =this.mapStore.coordMap[provinceName]
console.log(coordMap, '地级市')
if (coordMap) {
this.scattersCoordData = val.reduce((arr, item) => {
const [name, value] = item
const {citys} = coordMap
const coordItem =this.getCoordByName(citys, name)
if (coordItem) {
arr.push({
name: name,
value: [...coordItem.cp, value]
})
}
return arr
}, [])
}
},
reloadMap () {
this.chartInstance &&this.chartInstance.clear()
this.chartInstance =this.$echarts.init(this.$refs.mapWrap)
this.registerChartEvent()
this.updateMap()
},
// 更新地图
updateMap () {
const option =this.setChartOption()
if (this.chartInstance) {
this.chartInstance.clear()
this.chartInstance.setOption(option, true)
this.chartInstance.resize()
}
},
// 转换地级市坐标点
convertCityListByName (name) {
let provincesInfo =this.getCoordFromOriginDataByName(this.originData, name)
console.log(provincesInfo, 'info')
if (provincesInfo) {
const {cityList} = provincesInfo
this.scattersNameData =convertScattersData(cityList)
console.log(this.scattersNameData, 'scattersNameData')
this.convertScattersNameDataToCoordDataOfProvince(this.scattersNameData, name)
console.log(this.scattersCoordData, 'scattersCoordData')
}else {
provincesInfo = {
cityList:[
],
projectCount:0 ,
province:""
}
const {cityList} = provincesInfo
this.scattersNameData =convertScattersData(cityList)
console.log(this.scattersNameData, 'scattersNameData')
this.convertScattersNameDataToCoordDataOfProvince(this.scattersNameData, name)
console.log(this.scattersCoordData, 'scattersCoordData')
}
},
// 提供外部手动触发下钻
triggerDrillDown(name) {
// 保证省份可以正常匹配 | 北京市 -> 北京
name =this.mapStore.nameMapAdaptor(name)
this.mapStore.registProvincialMap(name).then(() => {
this.drillDownFn(name)
})
},
// 下钻方法
drillDownFn (name) {
this.drillDown.add(name)
this.convertCityListByName(name)
this.updateMap()
this.$emit('drill-down', name)
},
// 下钻后的返回
drillUp() {
const currentMap =this.drillDown.back()
this.mapStore.setCurrentMap(currentMap)
this.mapStore.setCurrentZoom(1)
this.scattersNameData =convertScattersData(this.originData)
this.convertScattersNameDataToCoordData(this.scattersNameData)
this.updateMap()
this.$emit('drill-up', currentMap)
},
// 点 线 流 颜色
handleNumPublicMethod(params){
if(this.drillDown.isDrillDown()){
if (params.value){
const numDrillDown = params.value
if (numDrillDown>0&&numDrillDown<=10){
return '#47A0FF'
}else if (numDrillDown>10&&numDrillDown<=20){
return '#28E3F2'
}else if (numDrillDown>20){
return '#32DEA2'
}
}
}else {
if (this.type ==1){
let num = params.value
if (num >=0 && num <=15) {
return this.enumColor[0]
}else if (num >15 && num <=30) {
return this.enumColor[1]
}else if (num >30 && num <=45) {
return this.enumColor[2]
}else if (num >45) {
return this.enumColor[3]
}
}else if (this.type ==2){
let numType = params.value
// let numType
// params.value?numType = Number(params.value[2]):numType=0
if (numType >=0 && numType <=25) {
return this.enumColor[0]
}else if (numType >25 && numType <=50) {
return this.enumColor[1]
}else if (numType >50 && numType <=75) {
return this.enumColor[2]
}else if (numType >75 && numType <=100) {
return this.enumColor[3]
}
}
}
},
/**
* data数据类型为:
* [
* [{
coord: [x, y] //起点横纵坐标
}, {
coord: [x, y] //终点横纵坐标
}],
[{
coord: [x, y] //起点横纵坐标
}, {
coord: [x, y] //终点横纵坐标
}]
...
* ]
*/
setLinesSeries (data) {
const planePath ='path://M.6,1318.313v-89.254l-319.9-221.799l0.073-208.063c0.521-84.662-26.629-121.796-63.961-121.491c-37.332-0.305-64.482,36.829-63.961,121.491l0.073,208.063l-319.9,221.799v89.254l330.343-157.288l12.238,241.308l-134.449,92.931l0.531,42.034l175.125-42.917l175.125,42.917l0.531-42.034l-134.449-92.931l12.238-241.308L1705';
const moveLines = {
name:'moveLines',
type:'lines',
zlevel:1,
effect: {
show:true,
period:6,
trailLength:0.7,
color:'#fff',
symbolSize:3
},
lineStyle: {
normal: {
color: (params)=>{
console.log(params,'342');
return this.handleNumPublicMethod(params)
},
width:0,
curveness:0.4
}
},
data
}
const staticLines = {
name:'',
type:'lines',
zlevel:2,
effect: {
show:true,
period:6,
trailLength:0,
symbol: planePath,
symbolSize:15
},
lineStyle: {
normal: {
color: (params)=>{
return this.handleNumPublicMethod(params)
},
width:1,
opacity:0.4,
curveness:0.4
}
},
data
}
return [moveLines, staticLines]
},
/**
* data数据类型为:
* [
* {name, value: [x, y, value]}, // 横纵坐标和value（客户数量，用来区分标点直径大小）
* {name, value: [x, y, value]},
* ...
* ]
*/
setEffectScatterSeries (data) {
const effectScatterOptions = {
name:'effectScatter',
type:'effectScatter',
coordinateSystem:'geo',
zlevel:2,
rippleEffect: {
brushType:'stroke'
},
label: {
normal: {
show:true,
position:'bottom',
formatter:'{b}',
color:'rgba(255, 255, 255)'
}
},
symbolSize: (val, params) => {
const {name} = params
if (name ===this.startPointName)return 20
return 15
},
itemStyle: {
normal: {
color: (params)=>{
if(this.drillDown.isDrillDown()){
if (params.value){
const numDrillDown = params.value[2]
if (numDrillDown>0&&numDrillDown<=10){
return '#47A0FF'
}else if (numDrillDown>10&&numDrillDown<=20){
return '#28E3F2'
}else if (numDrillDown>20){
return '#32DEA2'
}
}
}else {
if (params.value){
if (this.type ==1){
let num = params.value[2]
if (num >=0 && num <=15) {
return this.enumColor[0]
}else if (num >15 && num <=30) {
return this.enumColor[1]
}else if (num >30 && num <=45) {
return this.enumColor[2]
}else if (num >45) {
return this.enumColor[3]
}
}else if (this.type ==2){
let numType = params.value[2]
if (numType >=0 && numType <=25) {
return this.enumColor[0]
}else if (numType >25 && numType <=50) {
return this.enumColor[1]
}else if (numType >50 && numType <=75) {
return this.enumColor[2]
}else if (numType >75 && numType <=100) {
return this.enumColor[3]
}
}
}
}
},
}
},
symbolOffset: [0, '-120%'],
data
}
return [effectScatterOptions]
},
getCityOfProvinceDomString (name) {
const province =this.originData.find(item =>filterName(item.province) ===filterName(name))
if (province) {
const {cityList} = province
let domString =''
cityList.forEach(item => {
domString +=`
<span>${item.city}
<span>${item.projectCount}
</div>`
})
return domString
}
},
getProvinceTooltip (params) {
return `
<span>${params.name}
<span>${params.value[2]}
${this.getCityOfProvinceDomString(params.name)}
`
},
renderProjectTable () {
let domString ='<tr class="table-header"><th><div>序号</div></th>'
this.columns.forEach(h => {
domString +=`<th><div class="${h.class}">${h.title}</div></th>`
})
domString +='</tr>'
this.projectInfo.forEach((item, idx) => {
domString +=`<tr class="table-data"><td>${idx +1}</td>`
this.columns.forEach(col => {
domString +=`<td><div title="${item[col.prop]}" class="${col.class}">${item[col.prop]===null?'-':item[col.prop]}${col.prop ==='contractAmount' ?'万元' :''}</div></td>`
})
})
return domString
},
// 获取企业信息的表格数据展示html字符串
getProjectInfoDom (params) {
let domString =`
<span>${params.name}
${this.renderProjectTable()}
`
return domString
},
setChartOption () {
this.mapName =this.mapStore &&this.mapStore.getCurrentMap()
let series = []
let linesSeries
linesSeries =this.setLinesSeries(this.linesCoordData)
console.log(this.mapType, this.linesCoordData)
// 线的数据在下钻后，迁徙线不消失，这里清空data，使其消失
if (this.drillDown.isDrillDown()) {
linesSeries[0] && (linesSeries[0].data = [])
linesSeries[1] && (linesSeries[1].data = [])
}
series = series.concat(linesSeries)
const scattersSeries =this.setEffectScatterSeries(this.scattersCoordData)
series = series.concat(scattersSeries)
var option = {
title: {
left:'left',
textStyle: {
color:'#fff'
}
},
tooltip: {
enterable:true,
triggerOn:this.drillDown.isDrillDown() ?'click' :'mousemove',
confine:true,
backgroundColor:'transparent',
formatter: (params, ticket, callback) => {
console.log(params, 'params')
const {componentSubType} = params
if (componentSubType ==='lines') {
return
}
if (this.drillDown.isDrillDown()) {
this.getCustomerDistributionProjectInfo(params.name)
.then(() => {
callback(ticket, this.getProjectInfoDom(params))
})
return 'Loading...'
}else {
return this.getProvinceTooltip(params)
}
}
},
geo: {
map:this.mapName,
zoom:1.2,
label: {
normal: {
show:true,
color:'rgba(255, 255, 255, 0.2)',
// 不起作用？
// formatter (params) {
// return ''
// }
},
emphasis: {
show:false, // 不起作用
color:'rgba(255, 255, 255, 0.2)'
}
},
roam:'scale',
itemStyle: {
normal: {
// areaColor: 'transparent',
// areaColor: '#0B1C3B',
// color: {
// image: this.$refs.bgImg,
// repeat: 'repeat',
// global: false
// },
color: {
type:'linear',
x:0,
y:0,
x2:0,
y2:1,
colorStops: [{
// offset: 0, color: 'red' // 0% 处的颜色
offset:0, color:'#224585' // 0% 处的颜色
// offset: 0, color: '#4AC3FF' // 100% 处的颜色
}, {
// offset: 1, color: '#4AC3FF' // 100% 处的颜色
// offset: 1, color: '#0B1C3A' // 100% 处的颜色
// offset: 1, color: '#0E3B88' // 100% 处的颜色
offset:1, color:'#0B1C3C' // 100% 处的颜色
}],
global:false // 缺省为false
},
borderColor:'#1381B8',
borderWidth:2
},
emphasis: {
areaColor:'#15749B'
}
}
},
series
};
return option
},
registerChartEvent() {
this.chartInstance.on('click', param => {
console.log('click', param)
const { name, componentType, componentSubType } = param
switch (componentType) {
case 'geo':
if (name ==='China' || name ==='') {
this.mapStore.registChinaMap().then(() => {
this.drillDown.add('china')
})
}else {
this.mapStore.registProvincialMap(name).then(() => {
this.drillDownFn(name)
})
}
break;
default:
break;
}
})
},
// 初始化地图状态管理和下钻控制
initMapStore () {
this.mapStore = MapStore.init({
currentMap:this.mapName
})
this.drillDown = DrillDown.init(this.mapName)
},
resizeChart() {
this.chartInstance.resize()
},
// 初始化地图
initMap () {
if (this.mapStore) {
// 这里项目点和基础地图都是异步的，并且需要同时完成才能处理数据，初始化地图
Promise.all([
this.mapStore.registChinaMap().then(() => {
this.chartInstance =this.$echarts.init(this.$refs.mapWrap)
this.registerChartEvent()
window.addEventListener('resize', this.resizeChart)
}),
this.getCustomerDistributionProjectCount()
]).then(() => {
// 先转化完数据，再初始化地图
console.log('lines name data', this.linesNameData)
this.convertLinesNameDataToCoordData(this.linesNameData)
this.convertScattersNameDataToCoordData(this.scattersNameData)
this.chartInstance.setOption(this.setChartOption())
})
}
}
},
created () {
this.initMapStore()
},
beforeDestroy() {
window.removeEventListener('resize', this.resizeChart)
if (this.chartInstance) {
this.chartInstance.clear()
}
},
mounted () {
this.initMap()
}
}
<style lang="less">
@box-width:200px;
.tjkw-map-wrap {
width:100%;
height:100%;
position:relative;
}
.tianjinkaiwu-base-map {
width:100%;
height:100%;
}
.tjkw-btnBack {
position:absolute;
top:20px;
left:20px;
z-index:100;
}
.tjkw-tooltip-header {
display:flex;
justify-content:space-between;
height:40px;
align-items:center;
font-size:18px;
border:1px solid rgba(74, 195, 255, 0.4);
color:white;
background:rgba(40, 227, 242, 0.4);
text-align:center;
margin-bottom:6px;
padding:0 15px;
&.province-header {
width:@box-width;
}
}
.province-city-list {
width:@box-width;
overflow-y:auto;
padding:0 15px;
background:#1475A5;
border:1px solid rgba(74, 195, 255, 0.4);
.city-list-item {
display:flex;
justify-content:space-between;
padding:5px 0;
}
}
.project-info-box {
width:300px;
height:250px;
overflow:auto;
background:rgba(74, 195, 255, 0.4);
padding:15px 5px;
}
.project-table {
border-collapse:collapse;
text-align:left;
.project-name {
width:60px;
}
.table-header {
background:rgba(93, 200, 255, 0.4);
th {
padding:15px 5px;
}
}
.table-data {
padding:10px 10px;
td {
padding:15px 10px;
}
}
}
.project-table tr td:nth-child(2) .project-name,.project-table tr td:nth-child(4) .project-name{
width:110px;
}
.project-info-wrap{
position:relative;
}
::-webkit-scrollbar{
width:5px;
}
::-webkit-scrollbar-track{
width:5px;
background:#1475A5;
opacity:0.4;
}
::-webkit-scrollbar-thumb{
border:1px solid #ccc;
background:#ccc;
}
.tooltip-project-content {
padding:20px 15px;
height:300px;
overflow:auto;
background:#1475A5;
border:1px solid rgba(74, 195, 255, 0.4);
position:relative;
}
.wrap1{
position:absolute;
left:0px;
top:3px;
width:134.72px;
height:1px;
opacity:0.4;
background:#4AC3FF;
}
.wrap2{
position:absolute;
left:0px;
top:6px;
width:101.04px;
height:1px;
opacity:0.4;
background:#4AC3FF;
}
.wrap3{
position:absolute;
left:0px;
top:9px;
width:67.36px;
height:1px;
opacity:0.4;
background:#4AC3FF;
}
.wrap4{
position:absolute;
left:2.47px;
top:53px;
width:1px;
height:64px;
opacity:0.4;
background:#4AC3FF;
}
.wrap5{
position:absolute;
left:0px;
bottom:0px;
width:2px;
height:22px;
background:rgba(74, 195, 255, 0.6);
}
.wrap6{
position:absolute;
left:0px;
bottom:0px;
width:22px;
height:2px;
background:rgba(74, 195, 255, 0.6);
}
.wrap7{
position:absolute;
right:30px;
bottom:3px;
width:108px;
height:1px;
opacity:0.4;
background:#4AC3FF;
}
.wrap8{
position:absolute;
right:10px;
bottom:7px;
width:64px;
height:1px;
opacity:0.4;
background:#4AC3FF;
}
.wrap9{
position:absolute;
right:0px;
bottom:28px;
width:2px;
height:22px;
background:rgba(74, 195, 255, 0.6);
}
.wrap10{
position:absolute;
right:0px;
top:0px;
width:16px;
height:2px;
background:rgba(74, 195, 255, 0.6);
}
.txt-ellipsis {
overflow:hidden;
white-space:nowrap;
text-overflow:ellipsis;
}
.city-info-table-box {
position:absolute;
bottom:20px;
left:20px;
}
/*
* @Author: 王凯朋wangkp@glodon.com
* @Date: 2022-09-20 23:43:37
* @LastEditors: 王凯朋wangkp@glodon.com
* @LastEditTime: 2022-09-22 16:43:22
* @FilePath: \microservice-project-static\enterprise\src\pages\widget\views\custom\tianjinkaiwu\utils.js
* @Description: 工具函数* @
* @Copyright (c) 2022 by 王凯朋wangkp@glodon.com, All Rights Reserved.
*/
import apifrom 'widget/api/tianjinkaiwu/index'
import { $get}from 'utils/request'
export const geoCoordMap = {
'新疆玛纳斯基地': [86.22, 44.30],
'九江': [116.00, 29.70],
'新乡': [116.402217, 35.311657],
' ': [79.92, 37.12],
' ': [86.85, 47.70],
'若羌县': [88.17, 39.02],
'上海': [121.4648, 31.2891],
'东莞': [113.8953, 22.901],
'东营': [118.7073, 37.5513],
'中山': [113.4229, 22.478],
'临汾': [111.4783, 36.1615],
'临沂': [118.3118, 35.2936],
'丹东': [124.541, 40.4242],
'丽水': [119.5642, 28.1854],
'乌鲁木齐': [87.9236, 43.5883],
'佛山': [112.8955, 23.1097],
'保定': [115.0488, 39.0948],
'兰州': [103.5901, 36.3043],
'包头': [110.3467, 41.4899],
'北京': [116.4551, 40.2539],
'北海': [109.314, 21.6211],
'南京': [118.8062, 31.9208],
'南宁': [108.479, 23.1152],
'南昌': [116.0046, 28.6633],
'南通': [121.1023, 32.1625],
'厦门': [118.1689, 24.6478],
'台州': [121.1353, 28.6688],
'合肥': [117.29, 32.0581],
'呼和浩特': [111.4124, 40.4901],
'咸阳': [108.4131, 34.8706],
'哈尔滨': [127.9688, 45.368],
'唐山': [118.4766, 39.6826],
'嘉兴': [120.9155, 30.6354],
'大同': [113.7854, 39.8035],
'大连': [122.2229, 39.4409],
'天津': [117.4219, 39.4189],
'太原': [112.3352, 37.9413],
'威海': [121.9482, 37.1393],
'宁波': [121.5967, 29.6466],
'宝鸡': [107.1826, 34.3433],
'宿迁': [118.5535, 33.7775],
'常州': [119.4543, 31.5582],
'广州': [113.5107, 23.2196],
'廊坊': [116.521, 39.0509],
'延安': [109.1052, 36.4252],
'张家口': [115.1477, 40.8527],
'徐州': [117.5208, 34.3268],
'德州': [116.6858, 37.2107],
'惠州': [114.6204, 23.1647],
'成都': [103.9526, 30.7617],
'扬州': [119.4653, 32.8162],
'承德': [117.5757, 41.4075],
'拉萨': [91.1865, 30.1465],
'无锡': [120.3442, 31.5527],
'日照': [119.2786, 35.5023],
'昆明': [102.9199, 25.4663],
'杭州': [119.5313, 29.8773],
'枣庄': [117.323, 34.8926],
'柳州': [109.3799, 24.9774],
'株洲': [113.5327, 27.0319],
'武汉': [114.3896, 30.6628],
'汕头': [117.1692, 23.3405],
'江门': [112.6318, 22.1484],
'沈阳': [123.1238, 42.1216],
'沧州': [116.8286, 38.2104],
'河源': [114.917, 23.9722],
'泉州': [118.3228, 25.1147],
'泰安': [117.0264, 36.0516],
'泰州': [120.0586, 32.5525],
'济南': [117.1582, 36.8701],
'济宁': [116.8286, 35.3375],
'海口': [110.3893, 19.8516],
'淄博': [118.0371, 36.6064],
'淮安': [118.927, 33.4039],
'深圳': [114.5435, 22.5439],
'清远': [112.9175, 24.3292],
'温州': [120.498, 27.8119],
'渭南': [109.7864, 35.0299],
'湖州': [119.8608, 30.7782],
'湘潭': [112.5439, 27.7075],
'滨州': [117.8174, 37.4963],
'潍坊': [119.0918, 36.524],
'烟台': [120.7397, 37.5128],
'玉溪': [101.9312, 23.8898],
'珠海': [113.7305, 22.1155],
'盐城': [120.2234, 33.5577],
'盘锦': [121.9482, 41.0449],
'石家庄': [114.4995, 38.1006],
'福州': [119.4543, 25.9222],
'秦皇岛': [119.2126, 40.0232],
'绍兴': [120.564, 29.7565],
'聊城': [115.9167, 36.4032],
'肇庆': [112.1265, 23.5822],
'舟山': [122.2559, 30.2234],
'苏州': [120.6519, 31.3989],
'莱芜': [117.6526, 36.2714],
'菏泽': [115.6201, 35.2057],
'营口': [122.4316, 40.4297],
'葫芦岛': [120.1575, 40.578],
'衡水': [115.8838, 37.7161],
'衢州': [118.6853, 28.8666],
'西宁': [101.4038, 36.8207],
'西安': [109.1162, 34.2004],
'贵阳': [106.6992, 26.7682],
'连云港': [119.1248, 34.552],
'邢台': [114.8071, 37.2821],
'邯郸': [114.4775, 36.535],
'郑州': [113.4668, 34.6234],
'鄂尔多斯': [108.9734, 39.2487],
'重庆': [107.7539, 30.1904],
'金华': [120.0037, 29.1028],
'铜川': [109.0393, 35.1947],
'银川': [106.3586, 38.1775],
'镇江': [119.4763, 31.9702],
'长春': [125.8154, 44.2584],
'长沙': [113.0823, 28.2568],
'长治': [112.8625, 36.4746],
'阳泉': [113.4778, 38.0951],
'青岛': [120.4651, 36.3373],
'韶关': [113.7964, 24.7028]
}
export const convertData =function (data = []) {
var res = [];
for (var i =0; i < data.length; i++) {
var dataItem = data[i];
var fromCoord =geoCoordMap[dataItem[0].name];
var toCoord =geoCoordMap[dataItem[1].name];
if (fromCoord && toCoord) {
res.push([{
coord: fromCoord
}, {
coord: toCoord
}]);
}
}
return res;
}
export const convertEffectScatterData =function (data = []) {
return data.map(function (dataItem) {
return {
name: dataItem[1].name,
value:geoCoordMap[dataItem[1].name].concat([dataItem[1].value])
};
})
}
// 将接口数据，转换为迁徙线需要的数据
export const convertLinesData =function (data = [], startPointName) {
return data.map(item => {
const {province,projectCount} = item
return [startPointName, province,projectCount]
})
}
// 将接口数据，转换为标点需要的数据
export const convertScattersData =function (data = []) {
return data.map(item => {
const {province, projectCount, city} = item
// 子集名称是city，这里为了用一个函数处理，就这样兼容处理下了
return [province || city, projectCount]
})
}
// 地图类型，在请求不同地图接口数据时用到了
export const mapType = {
internal:'internal',
external:'external',
upstream:'upstream'
}
/**
* @desc 客户、资源分布项目数接口
* @param {object} params
* @param {string: mapType} params.type // 地图类型 上面的mapType
* @param {string} params.tenantId // 租户id
*/
export function getCustomerDistributionProjectCount (params) {
// return Promise.resolve({
// code: 0,
// data: [
// {
// "province": "陕西省",
// "projectCount": 60,
// "cityList": [
// {
// "city": "西安市",
// "projectCount": 10
// },
// {
// "city": "渭南市",
// "projectCount": 12
// }
// ]
// },
// {
// "province": "北京",
// "projectCount": 120,
// "cityList": [
// {
// "city": "昌平区",
// "projectCount": 10
// },
// {
// "city": "朝阳区",
// "projectCount": 100
// }
// ]
// },
// {
// "province": "河南省",
// "projectCount": 200,
// "cityList": [
// {
// "city": "安阳市",
// "projectCount": 100
// },
// {
// "city": "漯河市",
// "projectCount": 50
// }
// ]
// },
// {
// "province": "上海",
// "projectCount": 290,
// "cityList": [
// {
// "city": "宝山区",
// "projectCount": 199
// },
// {
// "city": "徐汇区",
// "projectCount": 91
// }
// ]
// }
// ]
// })
return $get(api.getCustomerDistributionProjectCount, params)
}
/**
* @desc 下钻项目列表接口
* @param {object} params
* @param {string: mapType} params.type // 地图类型 上面的mapType
* @param {string} params.tenantId // 租户id
* @param {string} params.city // 城市名/区名
*/
export function getCustomerDistributionProjectInfo (params) {
// return Promise.resolve({
// code: 0,
// data: [
// {
// "enterprise_name": "企业名称", //企业名称
// "enterprise_address": "企业地址", //企业地址
// "enterprise_type": "企业性质/类型", //企业性质/类型
// "corp_name": "公司名称", //公司名称
// "project_name": "项目名称", //项目名称
// "project_address": "项目地址", //项目地址
// "contract_count": 3242, //合同数量
// "contract_amount": 23424 //合同金额合计
// },
// {
// "enterprise_name": "企业名称", //企业名称
// "enterprise_address": "企业地址", //企业地址
// "enterprise_type": "企业性质/类型", //企业性质/类型
// "corp_name": "公司名称", //公司名称
// "project_name": "项目名称", //项目名称
// "project_address": "项目地址", //项目地址
// "contract_count": 3242, //合同数量
// "contract_amount": 23424 //合同金额合计
// },
// {
// "enterprise_name": "企业名称", //企业名称
// "enterprise_address": "企业地址", //企业地址
// "enterprise_type": "企业性质/类型", //企业性质/类型
// "corp_name": "公司名称", //公司名称
// "project_name": "项目名称", //项目名称
// "project_address": "项目地址", //项目地址
// "contract_count": 3242, //合同数量
// "contract_amount": 23424 //合同金额合计
// }
// ]
// })
return $get(api.getCustomerDistributionProjectInfo, params)
}
