echarts版本：https://echarts.apache.org/zh/changelog.html

v5.x.x版本：不提供china.js和china.json文件

v4.x.x版本：使用npm安裝echarts，默認包含china.js和china.json文件

目錄

一、Html工程

二、vue工程

三、vue工程

四、矢量小圖標

方案一：

方案二：

---

一、Html工程

效果圖如下：

源碼百度網盤：?

鏈接：https://pan.baidu.com/s/1tsPE5Qo1fKqWKGTCEmspuA?pwd=p0ib?
提取碼：p0ib

二、vue工程

echarts版本v4.9.0：使用echarts依賴中的json文件，效果圖如下，可以完整顯示地圖。

源碼百度網盤：

鏈接：https://pan.baidu.com/s/17STxMmTSTxbZuHGbI2XzBw?pwd=irym?
提取碼：irym

三、vue工程

echarts版本v5.5.0：使用從阿里云下載的json文件，效果圖如下，不能完整顯示地圖。

源碼百度網盤：

鏈接：https://pan.baidu.com/s/1hFifJNq8wbT5JpZRYGRn4Q?pwd=ptc1?
提取碼：ptc1

四、矢量小圖標

echarts中關于矢量小圖標的描述：Documentation - Apache EChartshttps://echarts.apache.org/zh/option.html#series-effectScatter.symbol在上文效果圖中，飛機和火車的小圖標是用的svg矢量圖，將文件用記事本打開，將<path d="">標簽d后的內容復制到echarts地圖symbol屬性中即可，復雜的svg矢量小圖標可能是符合路徑，解決方案如下：

方案一：

• 電腦已經安裝?Adobe Illustrator CS6，可以使用
• 鼠標點擊選取整個圖標：上方菜單對象? →? 復合路徑? →? 建立?
• 導出 svg 格式，以文本打開 svg，將 <path 的 d 屬性復制
• 復制后放入 symbol 中，前面加以 path://

方案二：

• 使用GIMP軟件，官網地址：https://www.gimp.org/downloads/
• 使用教程參考：https://www.cnblogs.com/jasongrass/p/16011765.html