ECharts 省份地图 显示市区名称问题

shiorol shiorol 墨衍会员 · AI 创作全网分发 墨衍智能分发 通过墨衍一键同步至各平台 可同步平台 CSDN微信公众号微博知乎掘金百家号博客园抖音小红书 你的文章也可以这样分发 墨衍会员 ¥399起/年,写一次发全网 我也要 + 加入社区
页面做了四川省地图 想让显示市区名字 现在只有鼠标浮动上去才显示 查了官网 没找到怎么弄

<script src="${ctx}/static/js/page.js" type="text/javascript"></script>
<script src="${ctx}/static/echarts/map/china.js"></script>
<script type="text/javascript" src="${ctx}/static/echarts/map/sichuan.js"></script>


var proMap = echarts.init(document.getElementById('proMap'));
proMap.resize();
proOption = {
backgroundColor:"#fff",
title: {

x:'center',
y:'2%',
textStyle:{
fontSize: 15,
fontWeight: 'bolder',
}
},
tooltip : {
trigger: 'item',
formatter: function(param){return '项目名称:'+ param.value[2]}
},
geo: {
map: '四川',
label: {
emphasis: {
show: true
}
} ,
roam:true,
itemStyle: {
normal: {
areaColor: '#45c8ff',
borderColor: '#fff'
},
emphasis: {
areaColor: '#00aeee'
}
}
},

visualMap: {
min: 0,
max: 100,
left: '20px',
top: 'bottom',
color:['#dd1d32','#325dc3','#429ffc','#3299fe','#79bcff','#9dcdfe','#bee0d0'],
text: ['高','低'], // 文本,默认为数值文本
calculable: true
},

series : [
{
name:'',
type: 'scatter',
coordinateSystem: 'geo',
selectedMode : 'single',
itemStyle:{
normal: {
color: '#ffe65d',
shadowBlur: 3,
shadowColor: '#fff',

},


},
roam:true,

data: [
{name: '甘孜藏族自治州', value: 100},
{name: '阿坝藏族羌族自治州', value: 10},
{name: '凉山彝族自治州', value: 20},
{name: '绵阳市', value: 30},
{name: '达州市',value: 30},
{name: '广元市',value:50},
{name: '雅安市',value: 50},
{name: '宜宾市',value: 50},
{name: '乐山市',value: 50},
{name: '南充市',value: 50},
{name: '巴中市',value: 50},
{name: '泸州市',value: 50},
{name: '成都市',value: 50},
{name: '资阳市',value: 50},
{name: '攀枝花市',value:50},
{name: '眉山市',value: 50},
{name: '广安市',value: 50},
{name: '德阳市',value:50},
{name: '内江市',value: 50},
{name: '遂宁市',value: 50},
{name: '自贡市 ',value: 50},
]

/* function(){
var data = eval('${mapListP}');
return data;
} ()*/

}
]
};
proMap.setOption(proOption);
更多 0


想要的是这种



结果这种
...全文

相关推荐

echarts地图省市区三级下钻联动

vue echarts地图三级下钻,默认全国地图,例如点击湖北省进入湖北省地图,然后点击武汉进入武汉市地图,点击上一级返回,Vue写法,js写法类似

珍妮玛•黛金

echarts geo3D结合map3D 生成可以点击获取省份信息跳转到相应省份 且地图显示省份名称

1.中国地图使用geo3d 和scatter3D做文字图层,用map3d实现点击可以获取省份信息,如果单独使用geo3d,无法获取到点击的省份信息。还有一些思路写在代码中了。2.对不同省份进行区分(项目涉及到省份排名之类的);3. 点击进入不同省份 展示各个省份的市区信息;4. 在省份地图上添加marker;

我科

echarts实现河南各省市区县地图(河南省各省市区县地图json文件可以在我博客里下载)

前言:最近公司项目有个需求,展示河南省各省市区县的地图,并展示相应的数据,看了些资料决定用echarts实现。 一、完成之后的效果图 点击市的模块显示对应的市,并显示对应市的数据 点击区县的模块显示对应的区县,并显示对应区县的数据 二、实现方法 1、首先要确定已经引入的echart的文件,vue项目和html项目的引入方法不一样,在此不再赘述,童鞋们自行百度。 2、把需要用到的json文件放到本地(json文件获取的方法后续我会上传,童鞋们自行下载),在此我放到了static目录下,如下图: 3、页

_我爱搬砖

Echarts全国及各省份地图

共享Echarts全国所有市地图的JSON文件。弥补官网不能下载的问题。

「已注销」

echarts地图下钻省市区展示,vue版

单击下钻至下一层地图展示,最低可到区级,双击返回全国地图,鼠标停于散点之上时,信息框提示当前散点对应的城市名称

北山遇雪
评论 4
收藏 已收藏
分享
返回顶部
shiorol
Java EE 67,535 成员 225,843 内容