no message

2023-10-18 16:30:26 +08:00
parent 2fdae738f0
commit 730c511206
3037 changed files with 987677 additions and 0 deletions
@@ -0,0 +1,242 @@
+
+function echarts_map() {
+var myChart = echarts.init(document.getElementById('map_1'));
+var guangdong = "js/44.json";
+$.get(guangdong, function(tjJson) {
+    echarts.registerMap('guangdong', tjJson);
+    myChart.setOption({
+        series: [{
+            type: 'map',
+            map: 'guangdong'
+        }]
+    });
+
+    var geoCoordMap = {
+			'珠海市': [113.353986,21.924979]
+            ,'广州市':[113.480637,23.125178]
+            ,'湛江市':[110.264977,21.274898]
+            ,'茂名市':[110.919229,21.659751]
+            ,'阳江市':[111.825107,21.859222]
+            ,'云浮市':[112.044439,22.629801]
+            ,'肇庆市':[112.472529,23.051546]
+            ,'江门市':[112.894942,22.090431]
+            ,'中山市':[113.382391,22.321113]
+            ,'佛山市':[113.022717,22.828762]
+            ,'清远市':[113.051227,23.685022]
+            ,'韶关市':[113.601224,24.820603]
+            ,'河源市':[114.897802,23.746266]
+            ,'梅州市':[116.117582,24.099112]
+            ,'潮州市':[116.692301,23.661701]
+            ,'揭阳市':[116.255733,23.143778]
+            ,'汕头市':[116.708463,22.87102]
+            ,'汕尾市':[115.364238,22.774485]
+            ,'深圳市':[114.085947,22.347]
+            ,'东莞市':[113.746262,22.746237]
+            ,'惠州市':[114.412599,23.079404]
+    };
+    var goData = [{
+            name: '河源市',
+            value: 32
+        },{
+            name: '湛江市',
+            value: 24
+        },{
+            name: '韶关市',
+            value: 20
+        },{
+            name: '汕尾市',
+            value: 18
+        },{
+            name: '揭阳市',
+            value: 18
+        }
+    ];
+    var goTotal=0;//计算总人数
+    goData.forEach(function(item,i){
+        goTotal+=item.value;
+    })
+
+    var planePath = 'arrow';
+
+    var convertData = function(name, data) {
+        var res = [];
+        for (var i = 0; i < data.length; i++) {
+            var fromCoord = geoCoordMap[name];
+            var toCoord = geoCoordMap[data[i].name];
+            if (fromCoord && toCoord) {
+                res.push({
+                    //对换即可调整方向
+                    coords: [fromCoord, toCoord]
+                });
+            }
+        }
+        return res;
+    };
+    var series = [];
+    [
+        ['广州市', goData],
+       // ['徐州', backData],
+
+    ].forEach(function(item, i) {
+        series.push({
+            name: item[0],
+            type: 'lines',
+            zlevel: 2,
+            //线特效配置
+            effect: {
+                show: true,
+                period: 6,
+                trailLength: 0.1,
+                symbol: planePath, //标记类型
+                symbolSize: 10
+            },
+            lineStyle: {
+                normal: {
+                    width: 1,
+                    opacity: 0.4,
+                    curveness: 0.2, //弧线角度
+                    color: 'rgba(255,255,255,.1)'
+                }
+            },
+            data: convertData(item[0], item[1])
+        }, {  //终点
+            name: item[0],
+            type: 'scatter',
+            coordinateSystem: 'geo',
+            zlevel: 2,
+            label: {
+                normal: {
+                    show: false,
+                     color: 'rgba(255,255,255,.5)',
+                    position: 'right',
+                    formatter: '{b}'
+                }
+            },
+            symbol: 'circle',
+            //圆点大小
+            symbolSize: function(val) {
+                return val[2]*50 / goTotal;
+            },
+            itemStyle: {
+                normal: {
+                    show: true
+                }
+            },
+            data: item[1].map(function(dataItem) {
+                console.log(dataItem)
+                return {
+                    name: dataItem.name,
+                    value: geoCoordMap[dataItem.name].concat([dataItem.value])
+                };
+            })
+
+        }, {//起点
+            name: 'item[0]',
+            type: 'scatter',
+            coordinateSystem: 'geo',
+            zlevel: 2,
+            label: {
+                normal: {
+                    show: true,
+                    position: 'right',
+                    formatter: '{b}'
+                }
+            },
+            symbolSize: function(val) {
+                return 15;
+            },
+            symbol: 'circle',
+
+            itemStyle: {
+                normal: {
+                    show: true
+                }
+            },
+            data: [{
+                name: item[0],
+                value: geoCoordMap[item[0]].concat([100])
+            }]
+
+        })
+
+    });
+
+
+    option = {
+      //  backgroundColor: '#FDF7F2',
+        title: {
+       text: '业务覆盖',
+       subtext: '2016-2018年数据',
+        left: 'center',
+		bottom:'15%',
+        textStyle: {
+            color: '#fff'
+            }
+        },
+       
+        tooltip: {
+            trigger: 'item',
+            formatter: "{b}"
+        },
+        //线颜色及飞行轨道颜色
+        visualMap: {
+            show: false,
+            min: 0,
+            max: 100,
+            color: ['#fff']
+        },
+        //地图相关设置
+        geo: {
+            map: 'guangdong',
+            //视角缩放比例
+            zoom: 1,
+            //显示文本样式
+            label: {
+                normal: {
+                    show: true,
+                    textStyle: {
+                        color: 'rgba(255,255,255,.3)'
+                    }
+                },
+                emphasis: {
+                    textStyle: {
+                        color: '#fff'
+                    }
+                }
+            },
+            //鼠标缩放和平移
+            roam: false,
+            itemStyle: {
+            normal: {
+                areaColor: '#4256ff',
+                borderColor: '#404a59'
+            },
+            emphasis: {
+                areaColor: '#2539f5'
+            }
+        }
+        },
+        series: series
+    };
+	 
+         myChart.setOption(option);
+        window.addEventListener("resize",function(){
+            myChart.resize();
+        });
+})
+
+      
+        // 使用刚指定的配置项和数据显示图表。
+      
+    }
+		
+
+
+
+
+ $(window).load(function(){
+echarts_map()
+ })  
+// })
+      
+