lzg95007
lzg95007
采纳率0%
2018-06-04 08:23

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

5

图片说明

代码:
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条回答

  • qq_39606632 qq_39606632 3年前

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

    点赞 2 评论 复制链接分享
  • cc_wake cc_wake 3年前

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

    点赞 评论 复制链接分享
  • u013170541 缘来又是你 3年前

    这坐标对吗,发下我的,取自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]
    };

    点赞 评论 复制链接分享
  • quiet_girl nana-li 3年前

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

    点赞 评论 复制链接分享
  • slkj_tcs slkj_tcs 3年前

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

    点赞 评论 复制链接分享

相关推荐