记一次优化echarts中的海南诸岛显示

VIP文章 已于 2024-04-07 16:15:47 修改
阅读量447 收藏 10
点赞数 10
文章标签： echarts 前端 javascript
于 2024-01-09 14:34:42 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43144016/article/details/135479950
版权

最近产品经理在群里喊前端组，说公司使用的地图不规范，南海诸岛显示不完全，缺少了必要的岛屿。我们是使用了echarts版本包自带的json（在高版本中不自带json文件了，听说是因为版权问题）。

所以一开始我们的地图的关于南海诸岛这块基本都是这个样子，我相信主要是使用echarts绘制轮廓图的都长这样子，要么就不显示子图。

但是产品说这不行，因为最新的根据中国标准地图的绘制2023版中，南海诸岛应该有较多的群岛，以下是国家发布的标准地图版本，印度三哥听说我们发布了一组新的地图，他们民间也着急发布了一个地图，竟然把亚洲几个大国都画进印度版图中啦，哈哈，三哥的胃口还真不小，就是不知道实力够不够。

中国标准地图

然而我们看到官方只提供了eps和png版本，和我们需要的json和geoJson格式相差很大，eps是ai软件输出的文件格式，至少是矢量的，png格式是有损图片，非矢量，所以我们把eps试图转化成json成为了当下的

最低0.47元/天 解锁文章
weixin_43144016
关注
  • 10
    点赞
  • 踩
  • 10
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
海南省echarts地图资源
12-30
海南省echarts地图资源
前端开发，利用echarts图表实现海南地图、广东地图等 对应区域的显示、添加图标 等操作，常用大屏展示的部分区域的地图显示~
06-30
前端开发，利用echarts图表实现海南地图、广东地图等 对应区域的显示、添加图标 等操作，常用大屏展示的部分区域的地图显示~
关于echarts中南海诸岛的显示问题
ddyy2695734664的博客
02-19 2269
关于echarts中南海诸岛的显示问题 1.china.js 文件中 echarts.registerMap(‘china’, //名字要是’china’，不能写成’中国’ 2.echarts 配置中地图名称 mapName: ‘china’, var myChart = echarts.chinaMap(‘firstchart’, { bgColor: ‘#154e90’, mapName: ‘china’,//1.此处也需是’china’不能写成’中国’ }); 效果图： ...
Echarts 地图隐藏右下角 “南海诸岛” 的方法
01-20
1、需求： Echarts 地图右下角 “南海诸岛” 在项目中有点多余，需要隐藏 2、查询 Echarts 官网配置项，发现修改属性 “geo.regions” 即可 3、没设置属性 “geo.regions” 之前，如下图 4、设置属性 “geo.regions” 之后，如下图 5、”geo.regions” 属性可以对特定的区域配置样式，此项目中，是将该地区透明度设置为 0 ，隐藏文字标签，主要内容如下 geo: [ { // 地理坐标系组件 map: china, roam: false, // 可以缩放和平移
关于echarts画中国地图只显示海南诸岛的问题
weixin_46092405的博客
09-11 964
有些同学估计跟我遇到过一样的问题 我也不废话 首先js用echarts画中国地图需要俩个js文件 1.china.js 可以去网上找一下 2.echarts-min.js 官网定制自己需要的js文件 将俩个文件src的形式导入jsp文件中 如果china.js在echarts-min.js之前导入的话 会只显示海南诸岛 注意调换导入俩个js文件的顺序 echarts-min.js在china.js之前导入 ...
vue echarts 中国地图处理南海诸岛为简图
n_2021的博客
09-12 3054
=访问这个网址，进入下图页面，选择图中标记的按钮，下载成功后的json文件为中文名称，将其改名为china.json。问题原因在于地图注册的时候，China的首字母大写，改成小写，就会出现缩略图。json文件中，删掉下面所示代码。
Echarts 南海诸岛简图显示位置调整
深蓝旭的博客
09-10 2419
    最近需要echart同时显示海南岛和南海诸岛，开始想寻找南海诸岛的数据，经过查找，这种简图数据是没有的(china.js地图数据一一找过了)，下图是echarts的一些示例，没有满足我们的要求     后来在echarts.min.js中通过关键字'南海诸岛'查找到了关键的代码，echarts在地图名为china时，加入南海诸岛数据，然后经过坐标变换（先设置缩放比率再平移到指定点）展示到echart地图中。     要想海南岛地图和南海诸岛简图显示到一起并不复杂。总共只要改四个参数就好了...
[问题探讨]ECharts实现带钓鱼岛和南海诸岛的中国(China)地图
tom_wong666
10-15 5099
主要介绍 json方式获取 json的要看下为什么南海诸岛显示不出来–china.js 钓鱼岛的主要说一下—增加
【echarts】地图钓鱼岛赤尾屿和南海诸岛内部岛屿问题
lorogy的博客
11-04 4599
echarts china.js地图显示不符合国家要求问题 先从下面地址下载中国地图的json文件 地图选择器 修改该文件中各省name，去掉“X族自治区”、“特别行政区”等 使用echarts先注册再使用 //注册 $.getJSON("js/mapJson/china.json", function (data) { echarts.registerM...
echarts全国地图只显示南海诸岛问题
dreamer23的专栏
10-08 9940
在使用百度开源的可视化工具echarts时，用到中国地图，参照官方文档用此段代码 value = [155, 10, 66, 78, 33, 80, 190, 53, 49.6] attr = [ "福建", "山东", "北京", "上海", "甘肃", "新疆", "河南", "广西", "西藏" ] map = Map("Map 结合 Vi...
解决echarts5中国地图只显示南海问题，及china.js china.json下载
qq_43217258的博客
03-29 5306
问题： echarts5中国地图，只显示南海 说明： echarts3版本后，因为版权问题，echarts不再内置中国地图，也没有中国地图数据，网上找的又很多有问题，或者语焉不详。。。 1：需要手动引入china.json文件，在public文件下，不能放src那。: 2：很多开源项目或者老项目用的jQuery的$.getJSON，vue就不要引入这玩意了，用axios的axios.get(uploadedDataURL).then((geoJson: any) => {})就行了。 3：echar
解决echarts中横坐标值显示不全(自动隐藏)问题
10-15
主要介绍了解决echarts中横坐标值显示不全(自动隐藏)问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2022年echarts海南省最新4地级市5县级市4县6自治县json地图
04-30
2022年自己调整过使用过的echarts海南省最新5县级市4县6自治县json地图，4个地级市分别是海口市、三亚市、三沙市、儋州市;5个县级市、4个县、6个自治县,分别是五指山市、文昌市、琼海市、万宁市、东方市、定安县、...
关于echarts中，南海诸岛不显示的问题
WLQ_slient的博客
12-28 2597
关于自定义echarts地图南海诸岛不显示问题
Geojson 海南省数据 带南海诸岛 优化 echarts
weixin_48408736的博客
08-04 1065
大屏需要用到海南地图，但是三沙市和南海诸岛的空间位置过大，导致图形难看，所以使用了 geo编辑器，自己修改了一下数据。，发现数据都加密了，特此开源。
echarts地图显示比例_Echarts 南海诸岛简图显示位置调整
weixin_35907638的博客
01-19 1701
 最近需要echart同时显示海南岛和南海诸岛，开始想寻找南海诸岛的数据，经过查找，这种简图数据是没有的(china.js地图数据一一找过了)，下图是echarts的一些示例，没有满足我们的要求    后来在echarts.min.js中通过关键字'南海诸岛'查找到了关键的代码，echarts在地图名为china时，加入南海诸岛数据，然后经过坐标变换(先设置缩放比率再平移到指定点)展示到echar...
Echarts中国地图不能显示南海诸岛的问题
HDdgut的博客
03-12 3532
注册中国地图的时候，必须是china，则echarts.registerMap(‘china’, geoJson)，不能China或是‘中国’，否则无法显示南海诸岛
echarts南海诸岛无法显示问题
最新发布
qq_51048647的博客
01-19 471
无需特殊json，在vue项目中解决echarts南海诸岛无法显示的问题
echarts 隐藏南海诸岛
08-18
要隐藏Echarts地图中的南海诸岛，可以通过修改属性 "geo.regions" 来实现。在设置属性 "geo.regions" 之前，＊＊＊<span class="em">1</span><span class="em">2</span> #### 引用[.reference_title] - *1* [Echarts 地图隐藏右下角 “南海诸岛” 的方法](https://download.csdn.net/download/weixin_38688855/14885532)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT0_1"}}] [.reference_item style="max-width: 50%"] - *2* [Django+Python+Echarts对招聘数据进行可视化分析](https://download.csdn.net/download/wchg21131/88222605)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT0_1"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值