在vue使用echarts的中国/世界地图

最新推荐文章于 2024-08-25 11:06:18 发布

百事可口

最新推荐文章于 2024-08-25 11:06:18 发布

阅读量506

点赞数

文章标签： echarts npm

本文链接：https://blog.csdn.net/qq_38594056/article/details/111463270

版权

最近echarts刚更新了5版本，导致原本的项目中国地图引入不上

这里可以npm 安装过去的4版本
npm install echarts@4.8.0，

import echarts from "echarts";
// 引入中国地图，仅针对4版本的echarts
import "../../../../node_modules/echarts/map/js/china";
// import "../../../../node_modules/echarts";
import "../../../../node_modules/echarts/map/js/world";

再次引入就正常了

在这里插入图片描述

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

百事可口

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

vue+echarts实现中国地图

qq_32166301的博客

06-21

1929

vue+echarts实现中国地图的展示，并自定义样式

vue 中 echarts 中国地图

灰太郎

06-15

2324

我们先来看一下效果

参与评论您还未登录，请先登录后发表或查看评论

vue 使用echarts 实现中国地图、以及下钻地图绘制

最新发布

huitu312的博客

08-25

161

注：中国配置地图里的引用多个json文件，大家可以提取出来会更好，我这里没有做，大家还有什么的好的建议或者更好的方法可以提出来，以供大家参考学习，持续进步成长。引用几个文件echars.js、china.js、world.js、geoAtlasJson.js。链接：https://juejin.cn/post/7085536087078076430。mapname、mapnamejson主要是为了可以灵活的对应省份下面的地图。二级页面主要是中国地图下钻的部分以及展示一些其他html元素等。

Vue项目中使用Echarts绘制中国地图

qq_52569656的博客

01-18

3033

本文基于Vue2+Echarts4实现中国地图的展示，将各个功能点以图文+代码的方式分步骤实现，希望对你能有所帮助~

echarts中国省份地图

atongmu2017的博客

11-23

2万+

echarts中国地图页面效果： jsp页面代码：ajax请求返回json数据 <div class="col-lg-7"> <div id="main8" style="width: 100%;height:500px"></div> </div> $.ajax({ type : 'POST', url

vue使用echarts实现中国地图

小小•愿望的博客

03-27

2802

vue使用echarts实现中国地图

【vue+echarts】绘制中国地图,3D地图,省、市、县三级下钻以及回钻,南海诸岛小窗化显示,点位飞线图,点位名称弹窗轮播

04-25

【vue+echarts】绘制中国地图,3D地图,省、市、县三级下钻以及回钻,南海诸岛小窗化显示,点位飞线图,点位名称弹窗轮播展示,及一些常见问题,解压直接使用【vue+echarts】绘制中国地图,3D地图,省、市、县三级下钻以及回...

vue3 echarts 显示中国地图的定位信息

02-27

中国各个省市的定位信息

Vue + Echarts 实现中国地图多级钻取功能.zip

08-01

本文为 Vue 2.x + Echarts 5.x 实现中国地图多级钻取功能（基本版未做过多功能拓展和样式优化便于二次开发）。（更多说明移步：https://blog.csdn.net/ZYS10000/article/details/119298354）

VUE echarts中国地图带下钻带返回带数据返回.rar

08-31

总的来说，"Vue echarts中国地图带下钻带返回带数据返回"项目是一个结合Vue.js组件化特性和Echarts地图功能的实践，它展示了如何在Web应用中创建交互式、数据驱动的中国地图，并实现下钻功能，以帮助用户探索和理解...

Echarts vue 中国地图

qq_41625949的博客

04-30

336

<template> <div class="echarts"> <div ref="map" :style="{height:'610px',width:'100%'}"></div> </div> </template> <script> import echarts from 'echarts' require('echarts/map/js/china') import api from '@/a.

vue使用echarts显示中国地图

一入前端深似海

09-11

2万+

到这就完成了中国地图绘制，就可以看到文章顶部效果图，具体参数配置根据个人可以更改。引入一个公共js文件（下面这段代码就是china.js文件）下面介绍一个方法如何用echarts画一个中国地图，如图。左侧图例加上单位的写法，替换掉原有的 splitList。项目引入echarts以后，在页面创建canvas标签。使用地图的页面引入上面的公用Js！2022/5/5 特别补充，2022/5/5 追加补充。

Vue项目中使用Echarts实现中国地图

往事随风

10-14

6013

echarts现在已经不提供地图map包的下载了（5.0之前会自带这个包），所以很多小伙伴做地图需要走很多弯路，今天给大家分享一下地图的实现 1、先在终端安装 npm install echarts --save 2、在main.js中引入echarts （注意这里有两种引入方式） <1> 5.0以下版本： import echarts from 'echarts ’ <2> 5.0以上版本： import * as echarts from ‘echarts’ 我这里用的是

vue使用echarts设置中国地图

qq_47888106的博客

12-26

586

<template> <divid="china-map"style="width:100%;height:500px"></div> </template> <script> exportdefault{ mounted(){ this.initCharts() }, methods:{ initCharts(){ ...

vue中使用echarts中国地图

sunnyboysix的博客

01-06

1346

一效果图二上代码封装的完整的地图组件，里面注释了很多就不解释了 <template> <div class="mapContent"> <div ref="MapArea" class="echarts"></div> </div> </template> <script> import 'echarts/map/js/china' //导入echart的中国地图插件 export d

vue中使用echarts绘制中国地图

weixin_44864084的博客

08-07

2900

首先需要一个绘制中国地图的json文件（资源还在审核，审核过后会重新贴上来） 1、首先引入echarts和json文件，在需要的地方引即可 import echarts from 'echarts'; const chinaJson = require('./china2.json'); 2、注册中国地图（重要代码），这是我写的一个动态的地图组件，可以根据自己的需求进行改造 init(data) { let dataSourcePie = echarts.init(

vue中使用echarts实现中国地图

口袋的天空的博客

03-31

2万+

第一种效果：不同省份颜色不同代码：注意：要实现这种效果，地图数据的name一定要是省份的名字，要不然颜色出不来 <template> <div class="echartsMapAllDemo">  <div id="myEcharts" ref="myEcharts" style="width:100vw;height:100vh;border:

echarts实现中国地图(Vue)