Spaces:
Running
Running
Upload map2.html
Browse files
map2.html
ADDED
@@ -0,0 +1,111 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
<html>
|
2 |
+
<head><style type="text/css">body {margin: 0;}#main {height: 100%;}</style></head>
|
3 |
+
<body><div id="main"></div>
|
4 |
+
<script src="https://cdn.jsdelivr.net/npm/echarts@5.0.2/dist/echarts.js"></script>
|
5 |
+
<script src=".//echarts-all.js"></script>
|
6 |
+
<script>var myChart = echarts.init(document.getElementById("main"));
|
7 |
+
option = {
|
8 |
+
title : {
|
9 |
+
text: '订单量',
|
10 |
+
subtext: '纯属虚构',
|
11 |
+
x:'center'
|
12 |
+
},
|
13 |
+
tooltip : {
|
14 |
+
trigger: 'item'
|
15 |
+
},
|
16 |
+
legend: {
|
17 |
+
orient: 'vertical',
|
18 |
+
x:'left',
|
19 |
+
data:['订单量']
|
20 |
+
},
|
21 |
+
dataRange: {
|
22 |
+
x: 'left',
|
23 |
+
y: 'bottom',
|
24 |
+
splitList: [
|
25 |
+
{start: 1500},
|
26 |
+
{start: 900, end: 1500},
|
27 |
+
{start: 310, end: 1000},
|
28 |
+
{start: 200, end: 300},
|
29 |
+
{start: 10, end: 200, label: '10 到 200(自定义label)'},
|
30 |
+
{start: 5, end: 5, label: '5(自定义特殊颜色)', color: 'black'},
|
31 |
+
{end: 10}
|
32 |
+
],
|
33 |
+
color: ['#E0022B', '#E09107', '#A3E00B']
|
34 |
+
},
|
35 |
+
toolbox: {
|
36 |
+
show: true,
|
37 |
+
orient : 'vertical',
|
38 |
+
x: 'right',
|
39 |
+
y: 'center',
|
40 |
+
feature : {
|
41 |
+
mark : {show: true},
|
42 |
+
dataView : {show: true, readOnly: false},
|
43 |
+
restore : {show: true},
|
44 |
+
saveAsImage : {show: true}
|
45 |
+
}
|
46 |
+
},
|
47 |
+
roamController: {
|
48 |
+
show: true,
|
49 |
+
x: 'right',
|
50 |
+
mapTypeControl: {
|
51 |
+
'china': true
|
52 |
+
}
|
53 |
+
},
|
54 |
+
series : [
|
55 |
+
{
|
56 |
+
name: '订单量',
|
57 |
+
type: 'map',
|
58 |
+
mapType: 'china',
|
59 |
+
roam: false,
|
60 |
+
itemStyle:{
|
61 |
+
normal:{
|
62 |
+
label:{
|
63 |
+
show:true,
|
64 |
+
textStyle: {
|
65 |
+
color: "rgb(249, 249, 249)"
|
66 |
+
}
|
67 |
+
}
|
68 |
+
},
|
69 |
+
emphasis:{label:{show:true}}
|
70 |
+
},
|
71 |
+
data:[
|
72 |
+
{name: '北京',value: Math.round(Math.random()*2000)},
|
73 |
+
{name: '天津',value: Math.round(Math.random()*2000)},
|
74 |
+
{name: '上海',value: Math.round(Math.random()*2000)},
|
75 |
+
{name: '重庆',value: Math.round(Math.random()*2000)},
|
76 |
+
{name: '河北',value: 0},
|
77 |
+
{name: '河南',value: Math.round(Math.random()*2000)},
|
78 |
+
{name: '云南',value: 5},
|
79 |
+
{name: '辽宁',value: 305},
|
80 |
+
{name: '黑龙江',value: Math.round(Math.random()*2000)},
|
81 |
+
{name: '湖南',value: 200},
|
82 |
+
{name: '安徽',value: Math.round(Math.random()*2000)},
|
83 |
+
{name: '山东',value: Math.round(Math.random()*2000)},
|
84 |
+
{name: '新疆',value: Math.round(Math.random()*2000)},
|
85 |
+
{name: '江苏',value: Math.round(Math.random()*2000)},
|
86 |
+
{name: '浙江',value: Math.round(Math.random()*2000)},
|
87 |
+
{name: '江西',value: Math.round(Math.random()*2000)},
|
88 |
+
{name: '湖北',value: Math.round(Math.random()*2000)},
|
89 |
+
{name: '广西',value: Math.round(Math.random()*2000)},
|
90 |
+
{name: '甘肃',value: Math.round(Math.random()*2000)},
|
91 |
+
{name: '山西',value: Math.round(Math.random()*2000)},
|
92 |
+
{name: '内蒙古',value: Math.round(Math.random()*2000)},
|
93 |
+
{name: '陕西',value: Math.round(Math.random()*2000)},
|
94 |
+
{name: '吉林',value: Math.round(Math.random()*2000)},
|
95 |
+
{name: '福建',value: Math.round(Math.random()*2000)},
|
96 |
+
{name: '贵州',value: Math.round(Math.random()*2000)},
|
97 |
+
{name: '广东',value: Math.round(Math.random()*2000)},
|
98 |
+
{name: '青海',value: Math.round(Math.random()*2000)},
|
99 |
+
{name: '西藏',value: Math.round(Math.random()*2000)},
|
100 |
+
{name: '四川',value: Math.round(Math.random()*2000)},
|
101 |
+
{name: '宁夏',value: Math.round(Math.random()*2000)},
|
102 |
+
{name: '海南',value: Math.round(Math.random()*2000)},
|
103 |
+
{name: '台湾',value: Math.round(Math.random()*2000)},
|
104 |
+
{name: '香港',value: Math.round(Math.random()*2000)},
|
105 |
+
{name: '澳门',value: Math.round(Math.random()*2000)}
|
106 |
+
]
|
107 |
+
}
|
108 |
+
]
|
109 |
+
};
|
110 |
+
myChart.setOption(option);</script></body>
|
111 |
+
</html>
|