echarts绘制中国地图显示不正常怎么解决 求大牛帮助 5C

图片说明

代码:
var myChart = echarts.init(document.getElementById('china-map'));
var option = {
tooltip: {
// show: false //不显示提示标签
formatter: '{b}', //提示标签格式
backgroundColor:"#ff7f50",//提示标签背景颜色
textStyle:{color:"#fff"} //提示标签字体颜色
},
series: [{
type: 'map',
mapType: 'china',
label: {
normal: {
show: true,//显示省份标签
textStyle:{color:"#c71585"}//省份标签字体颜色
},
emphasis: {//对应的鼠标悬浮效果
show: true,
textStyle:{color:"#800080"}
}
},
itemStyle: {
normal: {
borderWidth: .5,//区域边框宽度
borderColor: '#009fe8',//区域边框颜色
areaColor:"#ffefd5",//区域颜色
},
emphasis: {
borderWidth: .5,
borderColor: '#4b0082',
areaColor:"#ffdead",
}
},
data:[
{name:'福建', selected:true}//福建为选中状态
],
geoCoord:{
"新疆":[84.9023,42.148],
"西藏":[87.8695,31.6846],
"内蒙古":[112.5977,46.3408],
"青海":[95.2402,35.4199],
"四川":[101.9199,30.1904],
"黑龙江":[126.1445,48.7156],
"甘肃":[99.7129,38.166],
"云南省":[101.0652,25.1807],
"广西":[107.7813,23.6426],
"湖南":[111.5332,27.3779],
"陕西":[109.5996,35.7396],
"广东":[113.4668,22.8076],
"吉林":[125.7746,43.5938],
"河北":[115.4004,39.4688],
"湖北":[112.2363,31.1572],
"贵州":[106.6113,26.9385],
"山东":[118.7402,36.4307],
"江西":[116.0156,27.29],
"河南":[113.0668,33.8818],
"辽宁":[122.0438,41.0889],
"山西":[112.4121,37.6611],
"安徽":[117.2461,32.0361],
"福建":[118.3008,25.9277],
"浙江":[120.498,29.0918],
"重庆":[107.7539,30.1904],
"宁夏":[105.9961,37.3096],
"海南":[109.9512,19.2041],
"台湾":[120.0254,23.5986],
"北京":[116.4551,40.2539],
"天津":[117.4219,39.4189],
"上海":[121.4648,31.2891],
"香港":[114.1178,22.3242],
"澳门":[111.5547,22.1484]
}
}],
};

myChart.setOption(option);
myChart.on('mouseover', function (params) {
    var dataIndex = params.dataIndex;
    console.log(params);
});

5个回答

你看下地点坐标是否正常,能显示出来说明显示应该没有问题

如果你根据echarts官网的demo去做的,一定要注意,官网的demo引用的js文件版本,建议你通过开发者工具将demo中的js文件全部下载到本地后,直接复制demo的代码,先将demo完全本地化后,再进行二次开发。

地点坐标、地图js文件的版本都可能带来某些异常,可以找比较靠谱的城市经纬度,另外,保证你使用的代码和版本是对应的。之前做过地图是没有出现这个问题,不过出现的问题是坐标点显示不出来(后来发现是经度和纬度位置写反了),但是你这个是可以显示出来的,可以看下是不是版本的问题。

今天刚好也遇见这个问题了,开始怎么也搞不懂,后来感觉是普通的乱码问题,后来果然是,解决很简单,在jsp页面第一行没有设置编码 这样就好了
<%@ page pageEncoding="utf-8" contentType="text/html; charset=utf-8" %>

这坐标对吗,发下我的,取自china.js
var geoCoordMap = {
上海: [121.472644, 31.231706],
云南: [102.712251, 25.040609],
内蒙古: [111.670801, 40.818311],
北京: [116.405285, 39.904989],
台湾: [121.509062, 25.044332],
吉林: [125.3245, 43.886841],
四川: [104.065735, 30.659462],
天津: [117.190182, 39.125596],
宁夏: [106.278179, 38.46637],
安徽: [117.283042, 31.86119],
山东: [117.000923, 36.675807],
山西: [112.549248, 37.857014],
广东: [113.280637, 23.125178],
广西: [108.320004, 22.82402],
新疆: [87.617733, 43.792818],
江苏: [118.767413, 32.041544],
江西: [115.892151, 28.676493],
河北: [114.502461, 38.045474],
河南: [113.665412, 34.757975],
浙江: [120.153576, 30.287459],
海南: [110.33119, 20.031971],
湖北: [114.298572, 30.584355],
湖南: [112.982279, 28.19409],
澳门: [113.54909, 22.198951],
甘肃: [103.823557, 36.058039],
福建: [119.306239, 26.075302],
西藏: [91.132212, 29.660361],
贵州: [106.713478, 26.578343],
辽宁: [123.429096, 41.796767],
重庆: [106.504962, 29.533155],
陕西: [108.948024, 34.263161],
青海: [101.778916, 36.623178],
香港: [114.173355, 22.320048],
黑龙江: [126.642464, 45.756967]
};

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
echarts绘制大数量折线图太卡,绘制很慢
-
利用echarts绘制关系图,如何根据边的权重设置边的粗细?
-
highmaps绘制中国地图
-
请教关于手机端使用echarts绘制折线图导致页面无法滚动的问题
-
如何用c#绘制中国地图
-
echarts绘制拓扑图,实现可拖曳
-
paintEvent绘制图形如何显示在最上层?
-
折线图如何能获取两个数据点之间的数据?
-
echarts中如何在标准圆形图中心空白区域加入图片
-
echarts 能否绘制如下的3d饼状图?
-
matplotlib绘制直方图不显示横坐标值
-
python使用scatter绘制散点图,如何一次绘制多组?
-
关于java开发echarts力导向图问题
-
raphael绘制动态交互地图
-
echarts怎么按不同颜色绘制地类图斑?
-
用echarts 制作图形 有大神么 帮帮忙???
-
如何使用HelloCharts绘制动态的折线图
-
关于绘制文本的代码,看的不是很懂,麻烦标注一下。
-
pyechart绘制平行坐标系,如何显示标签数值
-
学会了这些技术,你离BAT大厂不远了
每一个程序员都有一个梦想,梦想着能够进入阿里、腾讯、字节跳动、百度等一线互联网公司,由于身边的环境等原因,不知道 BAT 等一线互联网公司使用哪些技术?或者该如何去学习这些技术?或者我该去哪些获取这些技术资料?没关系,平头哥一站式服务,上面统统不是问题。平头哥整理了 BAT 等一线大厂的必备技能,并且帮你准备了对应的资料。对于整理出来的技术,如果你掌握的不牢固,那就赶快巩固,如果你还没有涉及,现在...
记一道字节跳动的算法面试题
点击蓝色“五分钟学算法”关注我哟加个“星标”,天天中午 12:15,一起学算法作者 | 帅地来源公众号 | 苦逼的码农前几天有个朋友去面试字节跳动,面试官问了他一道链表相...
程序员真是太太太太太有趣了!!!
网络上虽然已经有了很多关于程序员的话题,但大部分人对这个群体还是很陌生。我们在谈论程序员的时候,究竟该聊些什么呢?各位程序员大佬们,请让我听到你们的声音!不管你是前端开发...
史上最详细的IDEA优雅整合Maven+SSM框架(详细思路+附带源码)
网上很多整合SSM博客文章并不能让初探ssm的同学思路完全的清晰,可以试着关掉整合教程,摇两下头骨,哈一大口气,就在万事具备的时候,开整,这个时候你可能思路全无 ~中招了咩~ ,还有一些同学依旧在使用eclipse或者Myeclipse开发,我想对这些朋友说IDEA 的编译速度很快,人生苦短,来不及解释了,直接上手idea吧。这篇文章每一步搭建过程都测试过了,应该不会有什么差错。本文章还有个比较优秀的特点,就是idea的使用,基本上关于idea的操作都算是比较详细的,所以不用太担心不会撸idea!最后,本文
Python爬取淘宝商品信息
各位同学们,好久没写原创技术文章了,最近有些忙,所以进度很慢。 警告:本教程仅用作学习交流,请勿用作商业盈利,违者后果自负!如本文有侵犯任何组织集团公司的隐私或利益,请告知联系猪哥删除!!! 一、淘宝登录复习 前面我们已经介绍过了如何使用requests库登录淘宝,收到了很多同学的反馈和提问,猪哥感到很欣慰,同时对那些没有及时回复的同学说声抱歉! 顺便再提一下这个登录功能,代码是完全没有问题。...
全球最厉害的 14 位程序员!
来源 | ITWorld 整理自网络全球最厉害的 14 位程序员是谁?今天就让我们一起来了解一下吧,排名不分先后。01. Jon Skeet个人名望:程序技术问答网站 S...
从入门到精通,Java学习路线导航
引言 最近也有很多人来向我"请教",他们大都是一些刚入门的新手,还不了解这个行业,也不知道从何学起,开始的时候非常迷茫,实在是每天回复很多人也很麻烦,所以在这里统一作个回复吧。 Java学习路线 当然,这里我只是说Java学习路线,因为自己就是学Java的,对Java理当很熟悉,对于其它方面,我也不是很了解。 基础阶段 首先是基础阶段,在基础阶段,我们必须掌握Java基础,Mysql数据库,Ora...
我花了一夜用数据结构给女朋友写个H5走迷宫游戏
起因 又到深夜了,我按照以往在csdn和公众号写着数据结构!这占用了我大量的时间!我的超越妹妹严重缺乏陪伴而 怨气满满! 而女朋友时常埋怨,认为数据结构这么抽象难懂的东西没啥作用,常会问道:天天写这玩意,有啥作用。而我答道:能干事情多了,比如写个迷宫小游戏啥的! 当我码完字准备睡觉时:写不好别睡觉! 分析 如果用数据结构与算法造出东西来呢? ...
盘点那些被AI换脸、一键“脱”衣所滥用的AI模型
上周作者发布了一篇有关AI换脸的教程,不过令笔者始料未及的是一石激起千层浪,竟然有不少网友留言求所谓一键“脱”衣的教程。 虽然笔者对于技术的滥用深恶痛绝,但技术本身是中性的,并无好坏之分,从我上篇博文中也能看到“AI换脸”的门槛越来越低,目前其应用已经发展到几乎是随便什么人有个教程就能操作的地步了,所以想阻止这些滥用的技术,单靠封杀是不起了什么作用的,所以本文就回归...
五分钟小知识:为什么说 ++i 的效率比 i++ 高?
点击蓝色“五分钟学算法”关注我哟加个“星标”,天天中午 12:15,一起学算法作者 | 守望先生来源 | 编程珠玑前言不知道你是否听说过 ++i 比 i++ 快的说法,真...
接班马云的为何是张勇?
上海人、职业经理人、CFO 背景,集齐马云三大不喜欢的张勇怎么就成了阿里接班人? 作者|王琳 本文经授权转载自燃财经(ID:rancaijing) 9月10日,张勇转正了,他由阿里巴巴董事局候任主席正式成为阿里巴巴董事局主席,这也意味着阿里巴巴将正式开启“逍遥子时代”。 从2015年接任CEO开始,张勇已经将阿里巴巴股价拉升了超过200%。但和马云强大的个人光环比,张勇显得尤其...
什么是大公司病(太形象了)
点击蓝色“五分钟学算法”关注我哟加个“星标”,天天中午 12:15,一起学算法作者 | 南之鱼来源 | 芝麻观点(chinamkt)所谓大企业病,一般都具有机构臃肿、多重...
让程序员崩溃的瞬间(非程序员勿入)
今天给大家带来点快乐,程序员才能看懂。 来源:https://zhuanlan.zhihu.com/p/47066521 1. 公司实习生找 Bug 2.在调试时,将断点设置在错误的位置 3.当我有一个很棒的调试想法时 4.偶然间看到自己多年前写的代码 5.当我第一次启动我的单元测试时 ...
工厂模式,从第三方登录说起
现在的很多平台在登陆的时候,下面都会有一排选项,可以选择微信、QQ、微博账号等登陆,这些账号对平台来说都是第三方账号。第三方账号登陆是最近几年流行起来的,第三方账号登录一般都是基于OAuth2.0协议开发的。如果你不了解OAuth2.0协议,可以自行百度,也许会对你看这篇文章有所帮助。 现在由于公司要给平台引入流量,为了降低注册门槛,让更多的人来使用你们的平台,领导决定在你们的平台上接入第三方账号...
如何在Windows中开启"上帝模式"
原文链接 : https://mp.weixin.qq.com/s?__biz=MzIwMjE1MjMyMw==&amp;mid=2650202982&amp;idx=1&amp;sn=2c6c609ce06db1cee81abf2ba797be1b&amp;chksm=8ee1438ab996ca9c2d0cd0f76426e92faa835beef20ae21b537c0867ec2773be...
什么是“中台”?
“中台”这个概念,越来越多的在各种技术大会上提及,各大技术公司,纷纷推出自己的“中台”方案,究竟什么是“中台”?他和“前台”、“后台”有何区别?《》,这是我的朋友、前同事...
为什么面向对象糟透了?
又是周末,编程语言“三巨头”Java, Lisp 和C语言在Hello World咖啡馆聚会。服务员送来咖啡的同时还带来了一张今天的报纸, 三人寒暄了几句, C语言翻开了...
分享靠写代码赚钱的一些门路
作者 mezod,译者 josephchang10如今,通过自己的代码去赚钱变得越来越简单,不过对很多人来说依然还是很难,因为他们不知道有哪些门路。今天给大家分享一个精彩...
失业42天,我废了
作者:子彧师兄https://www.jianshu.com/p/62590c1339f12019.6.5这天下午,公司以资金困难,亏损较大为理由将我们整个技术部裁掉,我...
技术人员要拿百万年薪,必须要经历这9个段位
很多人都问,技术人员如何成长,每个阶段又是怎样的,如何才能走出当前的迷茫,实现自我的突破。所以我结合我自己10多年的从业经验,总结了技术人员成长的9个段位,希望对大家的职...
顶级产品经理是如何利用王者荣耀,3步毁掉你的自律。
【老王提示】:本文共 2384 字数,预计阅读时间为 8 Minute。 前言 当今时代,王者荣耀可谓无人不知无人不晓,该产品为其行业巨头,而其产品使用者年龄小则十几岁,大则近百岁。 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 这个现象极为恐怖,甚至有些心酸,本是正处于青春阳光成长中的孩子,应该围绕着学习才对,而不是花费大量时间在娱乐上。不仅是小学生,只要处于...
相关热词 c#多人合作开发项目策略 c# cad 坐标转换 c# 窗口内运行word c#线程睡眠 c# 静默打开打印机 c#获取当前路径的上一级 c# 去除线条 c# 取整倍数 c#窗体最大化控件不变 c# 程序更新程序案例