【教程】高德地图使用ECharts实现数据可视化

关于百度地图结合ECharts实现数据可视化的资料已经很多了，毕竟是官方提供支持的，这里就不再赘述。今天我们来讲一下让高德地图与ECharts结合来实现数据可视化图表的展示。

一、ECharts 高德扩展库的选择

https://github.com/plainheart/echarts-extension-amap

目前最新版本是 1.12.0

二、查阅说明

中文说明：https://github.com/plainheart/echarts-extension-amap/blob/master/README.zh-CN.md

英文说明：https://github.com/plainheart/echarts-extension-amap#readme

说明里为我们提供了一个简单的散点图（scatter与effectScatter）示例，可以此为参考。

三、使用方式

如果你的项目用的是webpack之类的构建工具，可以直接使用npm或者cnpm（淘宝镜像，下载速度快）

安装命令：

npm install echarts-extension-amap –save

安装完之后 直接使用 import 或者 require 引入即可

例如：

require("echarts");
require("echarts-extension-amap");

或者

import echarts from "echart"; // 注意：ECharts 5.0 之后需要改为 import * as echarts from "echarts";
import "echarts-extension-amap";

如果只是普通项目，未用构建工具，也可以直接用CDN引入

<!-- 引入最新版的echarts CDN -->
<script type="text/javascript" src="https://fastly.jsdelivr.net/npm/echarts/dist/echarts.min.js"></script>
<!-- 引入最新版的echarts-extension-amap 高德地图扩展库 CDN -->
<script type="text/javascript" src="https://fastly.jsdelivr.net/npm/echarts-extension-amap/dist/echarts-extension-amap.min.js"></script>

 

四、来个实例

复制代码
  1 <!DOCTYPE html>
  2 <html lang="zh-CN">
  3 <head>
  4     <meta charset="utf-8">
  5     <meta name="renderer" content="webkit">
  6     <meta http-equiv="cleartype" content="on">
  7     <meta http-equiv="x-dns-prefetch-control" content="on">
  8     <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  9     <!-- 下边这些dns-prefetch 是为了实现DNS预解析的 -->
 10     <link rel="dns-prefetch" href="https://webapi.amap.com">
 11     <link rel="dns-prefetch" href="https://restapi.amap.com">
 12     <link rel="dns-prefetch" href="https://vdata.amap.com">
 13     <link rel="dns-prefetch" href="https://vdata01.amap.com">
 14     <link rel="dns-prefetch" href="https://vdata02.amap.com">
 15     <link rel="dns-prefetch" href="https://vdata03.amap.com">
 16     <link rel="dns-prefetch" href="https://vdata04.amap.com">
 17     <link rel="dns-prefetch" href="https://sdf.amap.com">
 18     <link rel="dns-prefetch" href="https://wprd01.is.autonavi.com">
 19     <link rel="dns-prefetch" href="https://wprd02.is.autonavi.com">
 20     <link rel="dns-prefetch" href="https://wprd03.is.autonavi.com">
 21     <link rel="dns-prefetch" href="https://wprd04.is.autonavi.com">
 22     <link rel="dns-prefetch" href="https://webst01.is.autonavi.com">
 23     <link rel="dns-prefetch" href="https://webst02.is.autonavi.com">
 24     <link rel="dns-prefetch" href="https://webst03.is.autonavi.com">
 25     <link rel="dns-prefetch" href="https://webst04.is.autonavi.com">
 26     <title>高德地图结合ECharts测试</title>
 27     <!-- 替换自己的key并设置要引入的插件，如果你用的版本是2.0, 可以把v=1.4.15改为v=2.0 -->
 28     <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=自己的key&plugin=AMap.Scale,AMap.ToolBar,AMap.CustomLayer"></script>
 29     <!-- 引入最新版的 echarts CDN -->
 30     <script type="text/javascript" src="https://fastly.jsdelivr.net/npm/echarts/dist/echarts.min.js"></script>
 31     <!-- 引入最新版的 echarts-extension-amap 高德地图扩展库 CDN -->
 32     <script type="text/javascript" src="https://fastly.jsdelivr.net/npm/echarts-extension-amap/dist/echarts-extension-amap.min.js"></script>
 33     <style type="text/css">
 34         * {
 35             margin: 0;
 36             padding: 0;
 37         }
 38         html, body, #echarts-amap {
 39             width: 100%;
 40             height: 100%;
 41             overflow: hidden;
 42         }
 43     </style>
 44 </head>
 45 <body>
 46     <div id="echarts-amap"></div>
 47     <!-- 数据来源于百度地图 仅作示例 与高德坐标稍有偏差 -->
 48     <script type="text/javascript">
 49         var data = [
 50             {name: '海门', value: 9},
 51             {name: '鄂尔多斯', value: 12},
 52             {name: '招远', value: 12},
 53             {name: '舟山', value: 12},
 54             {name: '齐齐哈尔', value: 14},
 55             {name: '盐城', value: 15},
 56             {name: '赤峰', value: 16},
 57             {name: '青岛', value: 18},
 58             {name: '乳山', value: 18},
 59             {name: '金昌', value: 19},
 60             {name: '泉州', value: 21},
 61             {name: '莱西', value: 21},
 62             {name: '日照', value: 21},
 63             {name: '胶南', value: 22},
 64             {name: '南通', value: 23},
 65             {name: '拉萨', value: 24},
 66             {name: '云浮', value: 24},
 67             {name: '梅州', value: 25},
 68             {name: '文登', value: 25},
 69             {name: '上海', value: 25},
 70             {name: '攀枝花', value: 25},
 71             {name: '威海', value: 25},
 72             {name: '承德', value: 25},
 73             {name: '厦门', value: 26},
 74             {name: '汕尾', value: 26},
 75             {name: '潮州', value: 26},
 76             {name: '丹东', value: 27},
 77             {name: '太仓', value: 27},
 78             {name: '曲靖', value: 27},
 79             {name: '烟台', value: 28},
 80             {name: '福州', value: 29},
 81             {name: '瓦房店', value: 30},
 82             {name: '即墨', value: 30},
 83             {name: '抚顺', value: 31},
 84             {name: '玉溪', value: 31},
 85             {name: '张家口', value: 31},
 86             {name: '阳泉', value: 31},
 87             {name: '莱州', value: 32},
 88             {name: '湖州', value: 32},
 89             {name: '汕头', value: 32},
 90             {name: '昆山', value: 33},
 91             {name: '宁波', value: 33},
 92             {name: '湛江', value: 33},
 93             {name: '揭阳', value: 34},
 94             {name: '荣成', value: 34},
 95             {name: '连云港', value: 35},
 96             {name: '葫芦岛', value: 35},
 97             {name: '常熟', value: 36},
 98             {name: '东莞', value: 36},
 99             {name: '河源', value: 36},
100             {name: '淮安', value: 36},
101             {name: '泰州', value: 36},
102             {name: '南宁', value: 37},
103             {name: '营口', value: 37},
104             {name: '惠州', value: 37},
105             {name: '江阴', value: 37},
106             {name: '蓬莱', value: 37},
107             {name: '韶关', value: 38},
108             {name: '嘉峪关', value: 38},
109             {name: '广州', value: 38},
110             {name: '延安', value: 38},
111             {name: '太原', value: 39},
112             {name: '清远', value: 39},
113             {name: '中山', value: 39},
114             {name: '昆明', value: 39},
115             {name: '寿光', value: 40},
116             {name: '盘锦', value: 40},
117             {name: '长治', value: 41},
118             {name: '深圳', value: 41},
119             {name: '珠海', value: 42},
120             {name: '宿迁', value: 43},
121             {name: '咸阳', value: 43},
122             {name: '铜川', value: 44},
123             {name: '平度', value: 44},
124             {name: '佛山', value: 44},
125             {name: '海口', value: 44},
126             {name: '江门', value: 45},
127             {name: '章丘', value: 45},
128             {name: '肇庆', value: 46},
129             {name: '大连', value: 47},
130             {name: '临汾', value: 47},
131             {name: '吴江', value: 47},
132             {name: '石嘴山', value: 49},
133             {name: '沈阳', value: 50},
134             {name: '苏州', value: 50},
135             {name: '茂名', value: 50},
136             {name: '嘉兴', value: 51},
137             {name: '长春', value: 51},
138             {name: '胶州', value: 52},
139             {name: '银川', value: 52},
140             {name: '张家港', value: 52},
141             {name: '三门峡', value: 53},
142             {name: '锦州', value: 54},
143             {name: '南昌', value: 54},
144             {name: '柳州', value: 54},
145             {name: '三亚', value: 54},
146             {name: '自贡', value: 56},
147             {name: '吉林', value: 56},
148             {name: '阳江', value: 57},
149             {name: '泸州', value: 57},
150             {name: '西宁', value: 57},
151             {name: '宜宾', value: 58},
152             {name: '呼和浩特', value: 58},
153             {name: '成都', value: 58},
154             {name: '大同', value: 58},
155             {name: '镇江', value: 59},
156             {name: '桂林', value: 59},
157             {name: '张家界', value: 59},
158             {name: '宜兴', value: 59},
159             {name: '北海', value: 60},
160             {name: '西安', value: 61},
161             {name: '金坛', value: 62},
162             {name: '东营', value: 62},
163             {name: '牡丹江', value: 63},
164             {name: '遵义', value: 63},
165             {name: '绍兴', value: 63},
166             {name: '扬州', value: 64},
167             {name: '常州', value: 64},
168             {name: '潍坊', value: 65},
169             {name: '重庆', value: 66},
170             {name: '台州', value: 67},
171             {name: '南京', value: 67},
172             {name: '滨州', value: 70},
173             {name: '贵阳', value: 71},
174             {name: '无锡', value: 71},
175             {name: '本溪', value: 71},
176             {name: '克拉玛依', value: 72},
177             {name: '渭南', value: 72},
178             {name: '马鞍山', value: 72},
179             {name: '宝鸡', value: 72},
180             {name: '焦作', value: 75},
181             {name: '句容', value: 75},
182             {name: '北京', value: 79},
183             {name: '徐州', value: 79},
184             {name: '衡水', value: 80},
185             {name: '包头', value: 80},
186             {name: '绵阳', value: 80},
187             {name: '乌鲁木齐', value: 84},
188             {name: '枣庄', value: 84},
189             {name: '杭州', value: 84},
190             {name: '淄博', value: 85},
191             {name: '鞍山', value: 86},
192             {name: '溧阳', value: 86},
193             {name: '库尔勒', value: 86},
194             {name: '安阳', value: 90},
195             {name: '开封', value: 90},
196             {name: '济南', value: 92},
197             {name: '德阳', value: 93},
198             {name: '温州', value: 95},
199             {name: '九江', value: 96},
200             {name: '邯郸', value: 98},
201             {name: '临安', value: 99},
202             {name: '兰州', value: 99},
203             {name: '沧州', value: 100},
204             {name: '临沂', value: 103},
205             {name: '南充', value: 104},
206             {name: '天津', value: 105},
207             {name: '富阳', value: 106},
208             {name: '泰安', value: 112},
209             {name: '诸暨', value: 112},
210             {name: '郑州', value: 113},
211             {name: '哈尔滨', value: 114},
212             {name: '聊城', value: 116},
213             {name: '芜湖', value: 117},
214             {name: '唐山', value: 119},
215             {name: '平顶山', value: 119},
216             {name: '邢台', value: 119},
217             {name: '德州', value: 120},
218             {name: '济宁', value: 120},
219             {name: '荆州', value: 127},
220             {name: '宜昌', value: 130},
221             {name: '义乌', value: 132},
222             {name: '丽水', value: 133},
223             {name: '洛阳', value: 134},
224             {name: '秦皇岛', value: 136},
225             {name: '株洲', value: 143},
226             {name: '石家庄', value: 147},
227             {name: '莱芜', value: 148},
228             {name: '常德', value: 152},
229             {name: '保定', value: 153},
230             {name: '湘潭', value: 154},
231             {name: '金华', value: 157},
232             {name: '岳阳', value: 169},
233             {name: '长沙', value: 175},
234             {name: '衢州', value: 177},
235             {name: '廊坊', value: 193},
236             {name: '菏泽', value: 194},
237             {name: '合肥', value: 229},
238             {name: '武汉', value: 273},
239             {name: '大庆', value: 279}
240         ];
241 
242         var geoCoordMap = {
243             '海门':[121.15,31.89],
244             '鄂尔多斯':[109.781327,39.608266],
245             '招远':[120.38,37.35],
246             '舟山':[122.207216,29.985295],
247             '齐齐哈尔':[123.97,47.33],
248             '盐城':[120.13,33.38],
249             '赤峰':[118.87,42.28],
250             '青岛':[120.33,36.07],
251             '乳山':[121.52,36.89],
252             '金昌':[102.188043,38.520089],
253             '泉州':[118.58,24.93],
254             '莱西':[120.53,36.86],
255             '日照':[119.46,35.42],
256             '胶南':[119.97,35.88],
257             '南通':[121.05,32.08],
258             '拉萨':[91.11,29.97],
259             '云浮':[112.02,22.93],
260             '梅州':[116.1,24.55],
261             '文登':[122.05,37.2],
262             '上海':[121.48,31.22],
263             '攀枝花':[101.718637,26.582347],
264             '威海':[122.1,37.5],
265             '承德':[117.93,40.97],
266             '厦门':[118.1,24.46],
267             '汕尾':[115.375279,22.786211],
268             '潮州':[116.63,23.68],
269             '丹东':[124.37,40.13],
270             '太仓':[121.1,31.45],
271             '曲靖':[103.79,25.51],
272             '烟台':[121.39,37.52],
273             '福州':[119.3,26.08],
274             '瓦房店':[121.979603,39.627114],
275             '即墨':[120.45,36.38],
276             '抚顺':[123.97,41.97],
277             '玉溪':[102.52,24.35],
278             '张家口':[114.87,40.82],
279             '阳泉':[113.57,37.85],
280             '莱州':[119.942327,37.177017],
281             '湖州':[120.1,30.86],
282             '汕头':[116.69,23.39],
283             '昆山':[120.95,31.39],
284             '宁波':[121.56,29.86],
285             '湛江':[110.359377,21.270708],
286             '揭阳':[116.35,23.55],
287             '荣成':[122.41,37.16],
288             '连云港':[119.16,34.59],
289             '葫芦岛':[120.836932,40.711052],
290             '常熟':[120.74,31.64],
291             '东莞':[113.75,23.04],
292             '河源':[114.68,23.73],
293             '淮安':[119.15,33.5],
294             '泰州':[119.9,32.49],
295             '南宁':[108.33,22.84],
296             '营口':[122.18,40.65],
297             '惠州':[114.4,23.09],
298             '江阴':[120.26,31.91],
299             '蓬莱':[120.75,37.8],
300             '韶关':[113.62,24.84],
301             '嘉峪关':[98.289152,39.77313],
302             '广州':[113.23,23.16],
303             '延安':[109.47,36.6],
304             '太原':[112.53,37.87],
305             '清远':[113.01,23.7],
306             '中山':[113.38,22.52],
307             '昆明':[102.73,25.04],
308             '寿光':[118.73,36.86],
309             '盘锦':[122.070714,41.119997],
310             '长治':[113.08,36.18],
311             '深圳':[114.07,22.62],
312             '珠海':[113.52,22.3],
313             '宿迁':[118.3,33.96],
314             '咸阳':[108.72,34.36],
315             '铜川':[109.11,35.09],
316             '平度':[119.97,36.77],
317             '佛山':[113.11,23.05],
318             '海口':[110.35,20.02],
319             '江门':[113.06,22.61],
320             '章丘':[117.53,36.72],
321             '肇庆':[112.44,23.05],
322             '大连':[121.62,38.92],
323             '临汾':[111.5,36.08],
324             '吴江':[120.63,31.16],
325             '石嘴山':[106.39,39.04],
326             '沈阳':[123.38,41.8],
327             '苏州':[120.62,31.32],
328             '茂名':[110.88,21.68],
329             '嘉兴':[120.76,30.77],
330             '长春':[125.35,43.88],
331             '胶州':[120.03336,36.264622],
332             '银川':[106.27,38.47],
333             '张家港':[120.555821,31.875428],
334             '三门峡':[111.19,34.76],
335             '锦州':[121.15,41.13],
336             '南昌':[115.89,28.68],
337             '柳州':[109.4,24.33],
338             '三亚':[109.511909,18.252847],
339             '自贡':[104.778442,29.33903],
340             '吉林':[126.57,43.87],
341             '阳江':[111.95,21.85],
342             '泸州':[105.39,28.91],
343             '西宁':[101.74,36.56],
344             '宜宾':[104.56,29.77],
345             '呼和浩特':[111.65,40.82],
346             '成都':[104.06,30.67],
347             '大同':[113.3,40.12],
348             '镇江':[119.44,32.2],
349             '桂林':[110.28,25.29],
350             '张家界':[110.479191,29.117096],
351             '宜兴':[119.82,31.36],
352             '北海':[109.12,21.49],
353             '西安':[108.95,34.27],
354             '金坛':[119.56,31.74],
355             '东营':[118.49,37.46],
356             '牡丹江':[129.58,44.6],
357             '遵义':[106.9,27.7],
358             '绍兴':[120.58,30.01],
359             '扬州':[119.42,32.39],
360             '常州':[119.95,31.79],
361             '潍坊':[119.1,36.62],
362             '重庆':[106.54,29.59],
363             '台州':[121.420757,28.656386],
364             '南京':[118.78,32.04],
365             '滨州':[118.03,37.36],
366             '贵阳':[106.71,26.57],
367             '无锡':[120.29,31.59],
368             '本溪':[123.73,41.3],
369             '克拉玛依':[84.77,45.59],
370             '渭南':[109.5,34.52],
371             '马鞍山':[118.48,31.56],
372             '宝鸡':[107.15,34.38],
373             '焦作':[113.21,35.24],
374             '句容':[119.16,31.95],
375             '北京':[116.46,39.92],
376             '徐州':[117.2,34.26],
377             '衡水':[115.72,37.72],
378             '包头':[110,40.58],
379             '绵阳':[104.73,31.48],
380             '乌鲁木齐':[87.68,43.77],
381             '枣庄':[117.57,34.86],
382             '杭州':[120.19,30.26],
383             '淄博':[118.05,36.78],
384             '鞍山':[122.85,41.12],
385             '溧阳':[119.48,31.43],
386             '库尔勒':[86.06,41.68],
387             '安阳':[114.35,36.1],
388             '开封':[114.35,34.79],
389             '济南':[117,36.65],
390             '德阳':[104.37,31.13],
391             '温州':[120.65,28.01],
392             '九江':[115.97,29.71],
393             '邯郸':[114.47,36.6],
394             '临安':[119.72,30.23],
395             '兰州':[103.73,36.03],
396             '沧州':[116.83,38.33],
397             '临沂':[118.35,35.05],
398             '南充':[106.110698,30.837793],
399             '天津':[117.2,39.13],
400             '富阳':[119.95,30.07],
401             '泰安':[117.13,36.18],
402             '诸暨':[120.23,29.71],
403             '郑州':[113.65,34.76],
404             '哈尔滨':[126.63,45.75],
405             '聊城':[115.97,36.45],
406             '芜湖':[118.38,31.33],
407             '唐山':[118.02,39.63],
408             '平顶山':[113.29,33.75],
409             '邢台':[114.48,37.05],
410             '德州':[116.29,37.45],
411             '济宁':[116.59,35.38],
412             '荆州':[112.239741,30.335165],
413             '宜昌':[111.3,30.7],
414             '义乌':[120.06,29.32],
415             '丽水':[119.92,28.45],
416             '洛阳':[112.44,34.7],
417             '秦皇岛':[119.57,39.95],
418             '株洲':[113.16,27.83],
419             '石家庄':[114.48,38.03],
420             '莱芜':[117.67,36.19],
421             '常德':[111.69,29.05],
422             '保定':[115.48,38.85],
423             '湘潭':[112.91,27.87],
424             '金华':[119.64,29.12],
425             '岳阳':[113.09,29.37],
426             '长沙':[113,28.21],
427             '衢州':[118.88,28.97],
428             '廊坊':[116.7,39.53],
429             '菏泽':[115.480656,35.23375],
430             '合肥':[117.27,31.86],
431             '武汉':[114.31,30.52],
432             '大庆':[125.03,46.58]
433         };
434 
435         var convertData = function (data) {
436             var res = [];
437             for (var i = 0; i < data.length; i++) {
438                 var geoCoord = geoCoordMap[data[i].name];
439                 if (geoCoord) {
440                     res.push({
441                         name: data[i].name,
442                         value: geoCoord.concat(data[i].value)
443                     });
444                 }
445             }
446             return res;
447         };
448         // ECharts Option配置
449         var option = {
450             // 加载 amap 组件
451             amap: {
452                 // 高德地图中心经纬度
453                 center: [108.39, 39.9],
454                 // 高德地图缩放
455                 zoom: 4,
456                 // 启用resize
457                 resizeEnable: true,
458                 // 移动过程中实时渲染 默认为true 如数据量较大 建议置为false
459                 renderOnMoving: true,
460                 // 自定义地图样式主题
461                 mapStyle:'amap://styles/dark'
462                 // 说明：如果想要添加卫星、路网等图层
463                 // 暂时先不要使用layers配置，因为存在Bug
464                 // 建议使用amap.add的方式，使用方式参见最下方代码
465 
466                 // 其他高德地图支持的初始配置项都可以在这里配置
467             },
468             tooltip: {
469                 trigger: 'item'
470             },
471             animation: true,
472             series: [
473                 {
474                     name: 'PM2.5',
475                     type: 'scatter',
476                     // 使用高德地图坐标系
477                     coordinateSystem: 'amap', 
478                     data: convertData(data),
479                     symbolSize: function (val) {
480                         return val[2] / 10;
481                     },
482                     encode: {
483                      // 编码使用数组中第三个元素作为value维度
484                       value: 2
485                     },
486                     label: {
487                         normal: {
488                             formatter: '{b}',
489                             position: 'right',
490                             show: false
491                         },
492                         emphasis: {
493                             show: true
494                         }
495                     },
496                     itemStyle: {
497                         normal: {
498                             color: '#00c1de'
499                         }
500                     }
501                 },
502                 {
503                     name: 'Top 5',
504                     type: 'effectScatter',
505                     coordinateSystem: 'amap',
506                     data: convertData(data.sort(function (a, b) {
507                         return b.value - a.value;
508                     }).slice(0, 6)),
509                     symbolSize: function (val) {
510                         return val[2] / 10;
511                     },
512                     encode: {
513                       value: 2
514                     },
515                     showEffectOn: 'render',
516                     rippleEffect: {
517                         brushType: 'stroke'
518                     },
519                     hoverAnimation: true,
520                     label: {
521                         normal: {
522                             formatter: '{b}',
523                             position: 'right',
524                             show: true
525                         }
526                     },
527                     itemStyle: {
528                         normal: {
529                             color: '#fff',
530                             shadowBlur: 10,
531                             shadowColor: '#333'
532                         }
533                     },
534                     zlevel: 1
535                 }
536             ]
537         };
538         // 初始化ECharts
539         var chart = echarts.init(document.getElementById('echarts-amap'));
540         chart.setOption(option);
541         // 从ECharts实例中取到高德地图组件实例
542         var amap = chart.getModel().getComponent('amap').getAMap();
543         // 下边就可以按照高德官方API随意调用了
544         // 比如添加一些控件
545         amap.addControl(new AMap.Scale());
546         amap.addControl(new AMap.ToolBar());
547         // 添加一些图层 卫星图层/交通路网等等
548         // var satelliteLayer = new AMap.TileLayer.Satellite();
549         // var roadNetLayer = new AMap.TileLayer.RoadNet();
550         // amap.add([satelliteLayer, roadNetLayer]);
551     </script>
552 </body>
553 </html>
复制代码

五、效果图

 

这里有一个在线示例：https://codepen.io/plainheart/pen/qBbdNYx

六、可能会遇到的问题

Q：在地图上加了一些高德地图的Marker，发现无法点击？

A：因为 ECharts 是借助高德地图的 CustomLayer 来实现的，默认 zIndex 是2000，远高于 Marker 图层的 zIndex，所以要想 Marker 可点击，需要调整 echartsLayer 的 zIndex 层级。有两种方式可以解决，具体可以参考这里：https://github.com/plainheart/echarts-extension-amap/issues/6#issuecomment-628064379

注意：从 1.9.0 版本开始，由于不再借助高德地图 CustomLayer，因此上述方案不再适用，如需使高德地图图层元素可点击，请设置 `echartsLayerInteractive` 为 false。详见 README 和发行说明。

结合谷歌地图（Google Map）也可以使用对应的谷歌地图插件：

https://github.com/plainheart/echarts-extension-gmap

 

posted @   PlainHeart  阅读(18831)  评论(2)  编辑  收藏  举报
努力加载评论中...
点击右上角即可分享
微信分享提示