1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
| <!DOCTYPE html>
| <html lang="en">
| <head>
| <meta charset="utf-8">
| <meta http-equiv="X-UA-Compatible" content="IE=edge">
| <meta name="viewport" content="width=device-width, initial-scale=1.0">
| <meta name="description" content="ECharts">
| <meta name="author" content="kener.linfeng@gmail.com">
| <title>ECharts · Example</title>
|
| <link rel="shortcut icon" href="../asset/ico/favicon.png">
|
| <link href="../asset/css/font-awesome.min.css" rel="stylesheet">
| <link href="../asset/css/bootstrap.css" rel="stylesheet">
| <link href="../asset/css/carousel.css" rel="stylesheet">
| <link href="../asset/css/echartsHome.css" rel="stylesheet">
| <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
| <!--[if lt IE 9]>
| <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
| <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
| <![endif]-->
|
| <script src="./www/js/echarts.js"></script>
| <script src="../asset/js/codemirror.js"></script>
| <script src="../asset/js/javascript.js"></script>
|
| <link href="../asset/css/codemirror.css" rel="stylesheet">
| <link href="../asset/css/monokai.css" rel="stylesheet">
|
| <style type="text/css">
| .CodeMirror {
| height: 550px;
| }
| </style>
| </head>
|
| <body>
| <!-- Fixed navbar -->
| <div class="navbar navbar-default navbar-fixed-top" role="navigation" id="head"></div>
|
|
| <div class="container-fluid">
| <div class="row-fluid example">
| <div id="sidebar-code" class="col-md-4">
| <div class="well sidebar-nav">
| <div class="nav-header"><a href="#" onclick="autoResize()" class="glyphicon glyphicon-resize-full" id ="icon-resize" ></a>option</div>
| <textarea id="code" name="code">
| option = {
| tooltip : {
| trigger: 'item',
| formatter: '{b}'
| },
| series : [
| {
| name: '世界地图',
| type: 'map',
| mapType: 'world',
| roam: true,
| selectedMode : 'single',
| itemStyle:{
| normal:{label:{show:false}},
| emphasis:{label:{show:true}}
| },
| data:[],
| // 自定义名称
| nameMap : {
| 'Afghanistan':'阿富汗',
| 'Angola':'安哥拉',
| 'Albania':'阿尔巴尼亚',
| 'United Arab Emirates':'阿联酋',
| 'Argentina':'阿根廷',
| 'Armenia':'亚美尼亚',
| 'French Southern and Antarctic Lands':'法属南半球和南极领地',
| 'Australia':'澳大利亚',
| 'Austria':'奥地利',
| 'Azerbaijan':'阿塞拜疆',
| 'Burundi':'布隆迪',
| 'Belgium':'比利时',
| 'Benin':'贝宁',
| 'Burkina Faso':'布基纳法索',
| 'Bangladesh':'孟加拉国',
| 'Bulgaria':'保加利亚',
| 'The Bahamas':'巴哈马',
| 'Bosnia and Herzegovina':'波斯尼亚和黑塞哥维那',
| 'Belarus':'白俄罗斯',
| 'Belize':'伯利兹',
| 'Bermuda':'百慕大',
| 'Bolivia':'玻利维亚',
| 'Brazil':'巴西',
| 'Brunei':'文莱',
| 'Bhutan':'不丹',
| 'Botswana':'博茨瓦纳',
| 'Central African Republic':'中非共和国',
| 'Canada':'加拿大',
| 'Switzerland':'瑞士',
| 'Chile':'智利',
| 'China':'中国',
| 'Ivory Coast':'象牙海岸',
| 'Cameroon':'喀麦隆',
| 'Democratic Republic of the Congo':'刚果民主共和国',
| 'Republic of the Congo':'刚果共和国',
| 'Colombia':'哥伦比亚',
| 'Costa Rica':'哥斯达黎加',
| 'Cuba':'古巴',
| 'Northern Cyprus':'北塞浦路斯',
| 'Cyprus':'塞浦路斯',
| 'Czech Republic':'捷克共和国',
| 'Germany':'德国',
| 'Djibouti':'吉布提',
| 'Denmark':'丹麦',
| 'Dominican Republic':'多明尼加共和国',
| 'Algeria':'阿尔及利亚',
| 'Ecuador':'厄瓜多尔',
| 'Egypt':'埃及',
| 'Eritrea':'厄立特里亚',
| 'Spain':'西班牙',
| 'Estonia':'爱沙尼亚',
| 'Ethiopia':'埃塞俄比亚',
| 'Finland':'芬兰',
| 'Fiji':'斐',
| 'Falkland Islands':'福克兰群岛',
| 'France':'法国',
| 'Gabon':'加蓬',
| 'United Kingdom':'英国',
| 'Georgia':'格鲁吉亚',
| 'Ghana':'加纳',
| 'Guinea':'几内亚',
| 'Gambia':'冈比亚',
| 'Guinea Bissau':'几内亚比绍',
| 'Equatorial Guinea':'赤道几内亚',
| 'Greece':'希腊',
| 'Greenland':'格陵兰',
| 'Guatemala':'危地马拉',
| 'French Guiana':'法属圭亚那',
| 'Guyana':'圭亚那',
| 'Honduras':'洪都拉斯',
| 'Croatia':'克罗地亚',
| 'Haiti':'海地',
| 'Hungary':'匈牙利',
| 'Indonesia':'印尼',
| 'India':'印度',
| 'Ireland':'爱尔兰',
| 'Iran':'伊朗',
| 'Iraq':'伊拉克',
| 'Iceland':'冰岛',
| 'Israel':'以色列',
| 'Italy':'意大利',
| 'Jamaica':'牙买加',
| 'Jordan':'约旦',
| 'Japan':'日本',
| 'Kazakhstan':'哈萨克斯坦',
| 'Kenya':'肯尼亚',
| 'Kyrgyzstan':'吉尔吉斯斯坦',
| 'Cambodia':'柬埔寨',
| 'South Korea':'韩国',
| 'Kosovo':'科索沃',
| 'Kuwait':'科威特',
| 'Laos':'老挝',
| 'Lebanon':'黎巴嫩',
| 'Liberia':'利比里亚',
| 'Libya':'利比亚',
| 'Sri Lanka':'斯里兰卡',
| 'Lesotho':'莱索托',
| 'Lithuania':'立陶宛',
| 'Luxembourg':'卢森堡',
| 'Latvia':'拉脱维亚',
| 'Morocco':'摩洛哥',
| 'Moldova':'摩尔多瓦',
| 'Madagascar':'马达加斯加',
| 'Mexico':'墨西哥',
| 'Macedonia':'马其顿',
| 'Mali':'马里',
| 'Myanmar':'缅甸',
| 'Montenegro':'黑山',
| 'Mongolia':'蒙古',
| 'Mozambique':'莫桑比克',
| 'Mauritania':'毛里塔尼亚',
| 'Malawi':'马拉维',
| 'Malaysia':'马来西亚',
| 'Namibia':'纳米比亚',
| 'New Caledonia':'新喀里多尼亚',
| 'Niger':'尼日尔',
| 'Nigeria':'尼日利亚',
| 'Nicaragua':'尼加拉瓜',
| 'Netherlands':'荷兰',
| 'Norway':'挪威',
| 'Nepal':'尼泊尔',
| 'New Zealand':'新西兰',
| 'Oman':'阿曼',
| 'Pakistan':'巴基斯坦',
| 'Panama':'巴拿马',
| 'Peru':'秘鲁',
| 'Philippines':'菲律宾',
| 'Papua New Guinea':'巴布亚新几内亚',
| 'Poland':'波兰',
| 'Puerto Rico':'波多黎各',
| 'North Korea':'北朝鲜',
| 'Portugal':'葡萄牙',
| 'Paraguay':'巴拉圭',
| 'Qatar':'卡塔尔',
| 'Romania':'罗马尼亚',
| 'Russia':'俄罗斯',
| 'Rwanda':'卢旺达',
| 'Western Sahara':'西撒哈拉',
| 'Saudi Arabia':'沙特阿拉伯',
| 'Sudan':'苏丹',
| 'South Sudan':'南苏丹',
| 'Senegal':'塞内加尔',
| 'Solomon Islands':'所罗门群岛',
| 'Sierra Leone':'塞拉利昂',
| 'El Salvador':'萨尔瓦多',
| 'Somaliland':'索马里兰',
| 'Somalia':'索马里',
| 'Republic of Serbia':'塞尔维亚共和国',
| 'Suriname':'苏里南',
| 'Slovakia':'斯洛伐克',
| 'Slovenia':'斯洛文尼亚',
| 'Sweden':'瑞典',
| 'Swaziland':'斯威士兰',
| 'Syria':'叙利亚',
| 'Chad':'乍得',
| 'Togo':'多哥',
| 'Thailand':'泰国',
| 'Tajikistan':'塔吉克斯坦',
| 'Turkmenistan':'土库曼斯坦',
| 'East Timor':'东帝汶',
| 'Trinidad and Tobago':'特里尼达和多巴哥',
| 'Tunisia':'突尼斯',
| 'Turkey':'土耳其',
| 'United Republic of Tanzania':'坦桑尼亚联合共和国',
| 'Uganda':'乌干达',
| 'Ukraine':'乌克兰',
| 'Uruguay':'乌拉圭',
| 'United States of America':'美国',
| 'Uzbekistan':'乌兹别克斯坦',
| 'Venezuela':'委内瑞拉',
| 'Vietnam':'越南',
| 'Vanuatu':'瓦努阿图',
| 'West Bank':'西岸',
| 'Yemen':'也门',
| 'South Africa':'南非',
| 'Zambia':'赞比亚',
| 'Zimbabwe':'津巴布韦'
| }
| }
| ]
| };
| var ecConfig = require('echarts/config');
| myChart.on(ecConfig.EVENT.MAP_SELECTED, function (param){
| var selected = param.selected;
| var str = '当前选择: ';
| for (var p in selected) {
| if (selected[p]) {
| str += p + ' ';
| }
| }
| document.getElementById('wrong-message').innerHTML = str;
| })
| </textarea>
| </div><!--/.well -->
| </div><!--/span-->
| <div id="graphic" class="col-md-8">
| <div id="main" class="main" style="height: 530px;"></div>
| <div>
| <button type="button" class="btn btn-sm btn-success" onclick="refresh(true)">刷 新</button>
| <span class="text-primary">切换主题</span>
| <select id="theme-select"></select>
|
| <span id='wrong-message' style="color:red"></span>
| </div>
| </div><!--/span-->
| </div><!--/row-->
|
| </div><!--/.fluid-container-->
|
| <footer id="footer"></footer>
| <!-- Le javascript
| ================================================== -->
| <!-- Placed at the end of the document so the pages load faster -->
| <script src="../asset/js/jquery.min.js"></script>
| <script type="text/javascript" src="../asset/js/echartsHome.js"></script>
| <script src="../asset/js/bootstrap.min.js"></script>
| <script src="../asset/js/echartsExample.js"></script>
| </body>
| </html>
|
|