Commit 9d18c1935ab2570d90e448cf55a9f080e53ee6f2

Authored by fengwotao
1 parent bfc9eccc

fix(src/packages): 图表下的地图 地图下钻后返回不了,省会下钻到市则显示为空了

@@ -3,7 +3,7 @@ import { OverrideMapBaseConfig } from './index' @@ -3,7 +3,7 @@ import { OverrideMapBaseConfig } from './index'
3 import { chartInitConfig } from '@/settings/designSetting' 3 import { chartInitConfig } from '@/settings/designSetting'
4 import { CreateComponentType } from '@/packages/index.d' 4 import { CreateComponentType } from '@/packages/index.d'
5 import cloneDeep from 'lodash/cloneDeep' 5 import cloneDeep from 'lodash/cloneDeep'
6 -// import dataJson from './data.json' 6 +import dataJson from './data.json'
7 7
8 //省市区枚举 8 //省市区枚举
9 export const enum areaEnum { 9 export const enum areaEnum {
@@ -21,7 +21,7 @@ export const option = { @@ -21,7 +21,7 @@ export const option = {
21 iconDistanceRight: 20, 21 iconDistanceRight: 20,
22 iconDistanceTop: 20, 22 iconDistanceTop: 20,
23 drillingIn: false, 23 drillingIn: false,
24 - // dataset: dataJson, 24 + dataset: dataJson,
25 mapRegion: { 25 mapRegion: {
26 adcode: 'china', 26 adcode: 'china',
27 showHainanIsLands: true, 27 showHainanIsLands: true,
@@ -2,22 +2,27 @@ @@ -2,22 +2,27 @@
2 "point": [ 2 "point": [
3 { 3 {
4 "name": "北京", 4 "name": "北京",
  5 + "adcode": 110000,
5 "value": [116.405285, 39.904989, 200] 6 "value": [116.405285, 39.904989, 200]
6 }, 7 },
7 { 8 {
8 "name": "郑州", 9 "name": "郑州",
  10 + "adcode": 410000,
9 "value": [113.665412, 34.757975, 888] 11 "value": [113.665412, 34.757975, 888]
10 }, 12 },
11 { 13 {
12 "name": "青海", 14 "name": "青海",
  15 + "adcode": 630000,
13 "value": [101.778916, 36.623178, 666] 16 "value": [101.778916, 36.623178, 666]
14 }, 17 },
15 { 18 {
16 "name": "宁夏回族自治区", 19 "name": "宁夏回族自治区",
  20 + "adcode": 640000,
17 "value": [106.278179, 38.46637, 66] 21 "value": [106.278179, 38.46637, 66]
18 }, 22 },
19 { 23 {
20 "name": "哈尔滨市", 24 "name": "哈尔滨市",
  25 + "adcode": 230000,
21 "value": [126.642464, 45.756967, 101] 26 "value": [126.642464, 45.756967, 101]
22 } 27 }
23 ], 28 ],
@@ -28,6 +28,7 @@ import { isPreview } from '@/utils' @@ -28,6 +28,7 @@ import { isPreview } from '@/utils'
28 import mapJsonWithoutHainanIsLands from './mapWithoutHainanIsLands.json' 28 import mapJsonWithoutHainanIsLands from './mapWithoutHainanIsLands.json'
29 import { DatasetComponent, GridComponent, TooltipComponent, GeoComponent, VisualMapComponent } from 'echarts/components' 29 import { DatasetComponent, GridComponent, TooltipComponent, GeoComponent, VisualMapComponent } from 'echarts/components'
30 import { getGeoJsonMap } from '@/api/external/common' 30 import { getGeoJsonMap } from '@/api/external/common'
  31 +import dataJson from './data.json'
31 32
32 const props = defineProps({ 33 const props = defineProps({
33 themeSetting: { 34 themeSetting: {
@@ -106,15 +107,21 @@ props.chartConfig.option = { @@ -106,15 +107,21 @@ props.chartConfig.option = {
106 //地图点击返回 adcode=100000,名字必须是china 107 //地图点击返回 adcode=100000,名字必须是china
107 const watchAdcode = async () => { 108 const watchAdcode = async () => {
108 if (props.chartConfig.option.drillingIn) { 109 if (props.chartConfig.option.drillingIn) {
  110 + let saveAdcode: any = saveLevelStr.parentInfo.adcode
109 saveLevelStr.level = saveLevelStr.parentInfo.level 111 saveLevelStr.level = saveLevelStr.parentInfo.level
110 - await getGeojson(saveLevelStr.parentInfo.adcode)  
111 - props.chartConfig.option.geo.map =  
112 - saveLevelStr.parentInfo.adcode === 100000 ? 'china' : saveLevelStr.parentInfo.adcode 112 + if (saveAdcode === 0) {
  113 + //
  114 + saveAdcode = 'china'
  115 + saveLevelStr.level = 'COUNTRY'
  116 + }
  117 + await getGeojson(saveAdcode)
  118 + const adcode = saveAdcode === 100000 ? 'china' : saveAdcode
  119 + props.chartConfig.option.geo.map = adcode
113 props.chartConfig.option.series.forEach((item: any) => { 120 props.chartConfig.option.series.forEach((item: any) => {
114 - if (item.type === 'map')  
115 - item.map = saveLevelStr.parentInfo.adcode === 100000 ? 'china' : saveLevelStr.parentInfo.adcode 121 + if (item.type === 'map') item.map = adcode
116 }) 122 })
117 vEchartsSetOption() 123 vEchartsSetOption()
  124 + handleDataPoint(adcode)
118 } 125 }
119 } 126 }
120 127
@@ -145,7 +152,8 @@ const getGeojson = async (regionId: any) => { @@ -145,7 +152,8 @@ const getGeojson = async (regionId: any) => {
145 const geoJsonFile = JSON.parse(geoJson) 152 const geoJsonFile = JSON.parse(geoJson)
146 if (!geoJsonFile) return 153 if (!geoJsonFile) return
147 saveGeojson.value = geoJsonFile 154 saveGeojson.value = geoJsonFile
148 - registerMap(level === areaEnum.COUNTRY ? name : code, { geoJSON: geoJsonFile as any, specialAreas: {} }) 155 + const nameChina = name === '中国' ? 'china' : name
  156 + registerMap(level === areaEnum.COUNTRY ? nameChina : code, { geoJSON: geoJsonFile as any, specialAreas: {} })
149 loading.value = false 157 loading.value = false
150 } catch (error) { 158 } catch (error) {
151 loading.value = false 159 loading.value = false
@@ -200,17 +208,17 @@ const hainanLandsHandle = async (newData: boolean) => { @@ -200,17 +208,17 @@ const hainanLandsHandle = async (newData: boolean) => {
200 } 208 }
201 } 209 }
202 210
203 -//监听 dataset 数据发生变化  
204 -// watch(  
205 -// () => props.chartConfig.option.dataset,  
206 -// newData => {  
207 -// dataSetHandle(newData)  
208 -// },  
209 -// {  
210 -// immediate: true,  
211 -// deep: false  
212 -// }  
213 -// ) 211 +// 监听 dataset 数据发生变化
  212 +watch(
  213 + () => props.chartConfig.option.dataset,
  214 + newData => {
  215 + dataSetHandle(newData)
  216 + },
  217 + {
  218 + immediate: true,
  219 + deep: false
  220 + }
  221 +)
214 222
215 //监听是否显示南海群岛 223 //监听是否显示南海群岛
216 watch( 224 watch(
@@ -228,6 +236,18 @@ watch( @@ -228,6 +236,18 @@ watch(
228 } 236 }
229 ) 237 )
230 238
  239 +//处理数据标点
  240 +const handleDataPoint = (newData: any) => {
  241 + if (newData === 'china') {
  242 + dataSetHandle(dataJson)
  243 + } else {
  244 + const filterPoint = dataJson.point.filter((item: any) => item.adcode === newData)
  245 + dataSetHandle({
  246 + point: filterPoint
  247 + })
  248 + }
  249 +}
  250 +
231 //监听地图展示区域发生变化 251 //监听地图展示区域发生变化
232 watch( 252 watch(
233 () => props.chartConfig.option.mapRegion.adcode, 253 () => props.chartConfig.option.mapRegion.adcode,
@@ -239,6 +259,7 @@ watch( @@ -239,6 +259,7 @@ watch(
239 if (item.type === 'map') item.map = newData 259 if (item.type === 'map') item.map = newData
240 }) 260 })
241 vEchartsSetOption() 261 vEchartsSetOption()
  262 + handleDataPoint(newData)
242 } catch (error) { 263 } catch (error) {
243 console.log(error) 264 console.log(error)
244 } 265 }
@@ -272,6 +293,7 @@ const handleVChartClick = async (params: any) => { @@ -272,6 +293,7 @@ const handleVChartClick = async (params: any) => {
272 saveLevelStr.level = level 293 saveLevelStr.level = level
273 saveLevelStr.parentInfo.adcode = item.properties.parent.adcode //保存上一级的地区编码 294 saveLevelStr.parentInfo.adcode = item.properties.parent.adcode //保存上一级的地区编码
274 saveLevelStr.parentInfo.level = (regionMapParentArea as any)[level] //保存上一级的行政级别 295 saveLevelStr.parentInfo.level = (regionMapParentArea as any)[level] //保存上一级的行政级别
  296 + handleDataPoint(adcode)
275 } 297 }
276 }) 298 })
277 } 299 }