js实现省市名称简称 ,echarts全国地图省市名称简称

背景介绍:
最近开发ecahrts做地图的时候,发现其只支持简称,
比如“河北省”在echarts里面只有显示“河北”,才能正确显示渲染样式,不然样式效果就实现不了,显示异常(如下图),但是现在我们后端返回来的数据是全称,所以需要前端对数据进行处理,然后再去实现.

解决方式
我这里是通过js来对数据进行处理的,举个例子,后端返回的参数是这样的

我们要把他处理成我们想要的“北京”,“新疆”…这种形式,

解决代码如下

    mounted() {this.getNewList()},

methods方法:

getNewList() {this.list.forEach((item, index) => {let isAutonomy = item.name.search('自治区') != -1if (isAutonomy) {item.address = item.name.search('内') != -1 ? item.name.substr(0, 3) : item.name.substr(0, 2)} else {item.address = item.name.match(/(\S*)(省|市|特别行政区)/)[1];}});console.log('list2', this.list)},

最终效果:

各位还有什么更好的方式欢迎在评论里面交流

js实现省市名称简称 ,echarts全国地图省市名称简称相关推荐

echarts全国地图资源，省份名称居中
echarts 全国地图资源 echarts全国地图资源全国地图山东黑龙江吉林辽宁北京天津河北河南山西陕西内蒙古安徽江苏上海浙江福建台湾广东香港澳门广西江 ...
Layuiadmin+Echarts全国地图数据分布
Layuiadmin+Echarts全国地图数据分布 *样式要引用layui的css js Html代码 <div class="layui-col-sm8">< ...
echarts 全国各省市地图切换展示
效果如上图,开始默认为全国地图,选择省或者市渲染为对应的地图 index.html <script type="text/javascript" src="http ...
echarts全国地图只显示南海诸岛问题
在使用百度开源的可视化工具echarts时,用到中国地图,参照官方文档用此段代码 value = [155, 10, 66, 78, 33, 80, 190, 53, 49.6]attr = [&qu ...
vue中引用echarts全国地图
<template><div><div ref="mapInfo" style="width:750px; height: 540px&qu ...
Vue版本echarts 全国地图geo、geo3D
需求:大屏显示3D全国地图,点击地图上标记连接到指定页面,网上资源多数不是Vue版本的,实现的方式也是由html页面修改为Vue版本效果展示: 由于图片涉嫌违规,给大家一个自己脑补的 ...
echarts全国地图只显示南海诸岛问题解决
经排查发现是因为eharts3 不再内置地图文件,因此需要我们手动引入官网的js或者json文件. 显示中国地图需要china.js文件. echarts官网 http://echarts.baidu ...
echarts全国地图点击弹窗（Vue）
前言 echarts使用很多次了,可以配置地图还是第一次,要实现的是地图上标注两个点,点击点弹出弹窗,点击可以跳转,效果如下: Echarts官网配置项参考 Echarts官网的一参考demo 贴关键 ...
echarts 全国地图，省市地图案例案例代码
``山西省地图代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> & ...
echarts全国地图china.js
1.链接:https://pan.baidu.com/s/1pmM2roAKg7gw7-sEyt8fNw 2.提取码:kdmr

js实现省市名称简称 ,echarts全国地图省市名称简称

js实现省市名称简称 ,echarts全国地图省市名称简称相关推荐

最新文章

热门文章