Mying666 commented on issue #20232:
URL: https://github.com/apache/echarts/issues/20232#issuecomment-2270792421

   myChart.showLoading();
   const points = [
     {
       name: '北京',
       value: ['116.395645038', '39.9299857781', 10]
     },
     {
       name: '焦作',
       value: ['113.211835885', '35.234607555', 2]
     },
     {
       name: '广州',
       value: ['113.266887', '23.133306', 6]
     }
   ];
   $.get(ROOT_PATH + '/data/asset/geo/world.json', function (geoJson) {
     myChart.hideLoading();
     echarts.registerMap('china', geoJson);
     myChart.setOption(
       (option = {
         tooltip: {
           show: true
         },
         color: ['#00EEFF'],
         backgroundColor: 'transparent',
         geo: {
           // 地图配置
           map: 'china',
           tooltip: {
             show: false
             // textStyle: {
             //   color: 'transparent'
             // },
             // backgroundColor: 'transparent',
             // borderColor: 'transparent',
             // shadowColor: {
             //   show: false
             // }
           },
           label: {
             // 图形上的文本标签
             normal: {
               // 通常状态下的样式
               show: true,
               textStyle: {
                 color: '#fff',
                 fontSize: 8
               }
             },
             emphasis: {
               // 鼠标放上去高亮的样式
               textStyle: {
                 color: '#fff'
               }
             }
           },
           roam: false, // 是否允许缩放
           itemStyle: {
             normal: {
               // 通常状态下的样式
               color: '#5089EC', // 地图背景色
               borderColor: 'rgba(57, 88, 165, 1)',
               borderWidth: 1,
               // areaColor: 'rgba(20, 30, 70, 1)',
               fontSize: 8,
               areaColor: {
                 // 地图区域的颜色
                 type: 'radial', // 径向渐变
                 x: 0.5, // 圆心
                 y: 0.5, // 圆心
                 r: 0.8, // 半径
                 colorStops: [
                   {
                     // 0% 处的颜色
                     offset: 0,
                     color: 'rgba(20, 30, 70, 1)'
                   },
                   {
                     // 100% 处的颜色
                     offset: 0.9,
                     color: 'rgba(20, 30, 70, 0.9)'
                   }
                 ]
               }
             },
             // 鼠标放上去高亮的样式
             emphasis: {
               color: 'rgba(37, 43, 61, .5)', //悬浮背景
               areaColor: '#2386AD',
               borderWidth: 1
             }
           },
           zoom: 1.1
         },
         series: [
           {
             // 散点系列数据
             name: '成单数量',
             type: 'scatter', // 带有涟漪特效动画的散点(气泡)图
             tooltip: {
               show: true,
               trigger: 'item',
               textStyle: {
                 color: '#333'
               },
               backgroundColor: '#fff',
               borderColor: '#00EEFF',
               shadowColor: '#eee'
             },
             coordinateSystem: 'geo', // 该系列使用的坐标系:地理坐标系
             colorBy: 'series',
             encode: {
               value: 2
             },
             label: {
               position: 'left',
               formatter: (params) => params.value[2],
               show: true
             },
             emphasis: {
               label: {
                 formatter: (params) => params.value[2],
                 show: true
               }
             },
             zlevel: 1, // 所有图形的 zlevel 值。
             data: points.map((item) => {
               return {
                 ...item,
                 symbolSize: item.value[2] > 3 ? item.value[2] * 2 : 5,
                 itemStyle: { color: '#00EEFF' }
               };
             })
           }
         ]
       })
     );
   });
   


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: [email protected]

For queries about this service, please contact Infrastructure at:
[email protected]


---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]

Reply via email to