Echarts引入省级地图（简便快捷，以浙江省为例）

最近需求，利用echarts地图显示浙江省行政区。一开始找了很多资料，但是一直没法实现，也不知道为什么。网上的办法试了个遍，老是不成功。总感觉打开方式不对。不过真的感觉要用GeoJson真的是很麻烦，直到我看到了一篇博文，哈哈哈，博主的吐槽深得我意。
接下来，就是见证奇迹的时刻。哈哈哈哈

initZheJiang () {let mychart = this.$echarts.init(document.getElementById('mychart'))window.addEventListener('resize', function () {this.mychart.resize()})// 绘制图表mychart.setOption({backgroundColor: '#404a59',title: {text: '浙江',top: 25, left: 'center',textStyle: {fontSize: 25,fontWeight: 650,color: '#fff'}},tooltip: {trigger: 'item', formatter: function (val) {return val.data.name + '<br>宅基地审批: ' + val.data.value + '户'}},toolbox: {show: true,orient: 'vertical',left: 'right',top: 'center',feature: {dataView: {readOnly: false},restore: {},saveAsImage: {}}},series: [{type: 'map', map: '浙江',mapType: '浙江',//这个地方是重点，itemStyle: {normal: {areaColor: '#323c48',borderColor: '#111'},emphasis: {areaColor: '#2a333d',label: {show: true, color: 'white'},}},// 是否开启鼠标缩放和平移漫游 默认不开启 roam: true,top: 70, label: {show: true // 是否显示对应地名},data: this.cityDatas}], })
},

你想要的省级Js、Json文件，node_modules全都有。惊不惊喜，意不意外。
当然不要忘了在主文件中引入文件，这里我用JS的方式，其他的方法敬请期待之后的文章。

import echarts from ‘echarts’;
import ‘…/node_modules/echarts/map/js/province/zhejiang.js’;

参考
指路那篇深得我意的博文，博主把我想吐槽的全给说了，哈哈哈哈哈：https://blog.csdn.net/m0_37723113/article/details/81282205.

嘻嘻，我的下一篇文章讲得也很详细哦，引用下载下来的json文件，欢迎围观。https://blog.csdn.net/weixin_44272792/article/details/108880952

Echarts引入省级地图（简便快捷，以浙江省为例）相关推荐

Echarts实现省级地图的两种方法（以浙江省为例）
Echarts实现省级地图的两种方法(以浙江省为例) 在echarts调用地图时,我们往往会使用GeoJson格式的数据,根据网上的资料,会发现官网会提供世界.中国以及各省的数据.但是,访问下载最新的 ...
vue 引入json地图_vue中echarts引入中国地图的案例
如下所示: mounted() { this.drawLine(); }, drawLine(){ // 基于准备好的dom,初始化echarts实例 var myChartContainer = d ...
echarts引入百度地图并且添加点击事件
echarts引入百度地图并且添加点击事件 (1)下载依赖项 npm install echarts --save (2)引入echarts到页面当中 import * as echarts from ...
Echarts — 绘制省级地图
版本:vue@3.0.5 + echarts@5.1.2 本文将介绍如何使用 echarts 绘制一个省级地图(以江西省为例) 一.安装 echarts npm i echarts --save-de ...
echarts引入中国地图并且下探到省
提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录前言一.首先就是项目中引入地图包. 二.代码如下 1.项目中首先要引入json中国地图 2.免费地图数据总结前言例如 ...
echarts引入geo地图数据，前端学习记录01
最近遇到项目需要使用使用geoJson数据在echarts上进行地图的绘制,仅使用此文记录学习的过程. 首先需要在项目中引入echart相关依赖,在package.json中添加如下依赖: " ...
echarts引入省份地图失败原因
引入北京地图就是不出来找了一下午原因,无果偶然看到一博主的博客去看了beijing.js文件中文??? 真是喵喵喵啊问题解决 nice 感谢大佬!!! 喵喵喵效果图
微信小程序用echarts引入中国地图
下载下载GitHub 上的 ecomfe/echarts-for-weixin 项目链接: ecomfe/echarts-for-weixin. 导入下载好后解压,打开微信开发者工具,新建一个项 ...
vue使用echarts引入离线地图（geo.json）并切换省市（以四川为例）可下钻
首先安装echarts npm install echarts --save 1 然后再main.js中引入echarts import echarts from 'echarts' Vue.prot ...

Echarts引入省级地图（简便快捷，以浙江省为例）

Echarts引入省级地图（简便快捷，以浙江省为例）

Echarts引入省级地图（简便快捷，以浙江省为例）相关推荐

最新文章

热门文章