首页 > 其他 > 详细

ECharts 地图实现

时间:2020-03-21 16:53:13      阅读:64      评论:0      收藏:0      [点我收藏+]

ECharts 地图实现

  var myChart = echarts.init(document.getElementById(‘jyyddt_echarts‘));
    myChart.showLoading();

  //$.get第一个参数,引入json文件 $.get(‘../../statics/jslib/echarts/json/jilin.json‘, function (geoJson) { myChart.hideLoading(); echarts.registerMap(‘jilin‘, geoJson); myChart.setOption(option = { title: { text: ‘吉林各地市州‘, subtext: ‘副标题‘, textStyle: {//主标题文本样式 fontSize: 40 }, subtextStyle: {//副标题文本样式 fontSize: 20 } }, geo: { map: ‘jilin‘, // roam: true, //是否支持拖动 itemStyle: { normal: { borderColor: ‘#4b9b9c‘, borderWidth: 6 //设置外层边框 } } }, series: [ { type: ‘map‘, // roam: true, //是否支持拖动 mapType: ‘jilin‘, geoIndex: 1, aspectScale: 0.75, //长宽比 showLegendSymbol: false, // 存在legend时显示 label: { normal: { show: true, textStyle: { fontSize: 22, color: ‘#333‘ } }, emphasis: {//对应的鼠标悬浮效果 show: true, textStyle: { fontSize: 30, color: "#333" } } }, itemStyle: { normal: { label: { show: true }, borderWidth: 1 } }, data: [ { name: ‘长春市‘, itemStyle: { normal: { // areaColor: ‘rgba(0,0,0,0)‘, borderColor: ‘#3496c2‘, borderWidth: 1 }, emphasis: { areaColor: ‘rgba(0,0,0,0)‘, borderWidth: 3 } } }, { name: ‘吉林市‘, itemStyle: { normal: { // areaColor: ‘rgba(0,0,0,0)‘, borderColor: ‘#65a16f‘, borderWidth: 1 }, emphasis: { areaColor: ‘rgba(0,0,0,0)‘, borderWidth: 3 } } }, { name: ‘四平市‘, itemStyle: { normal: { // areaColor: ‘rgba(0,0,0,0)‘, borderColor: ‘#3496c2‘, borderWidth: 1 }, emphasis: { areaColor: ‘rgba(0,0,0,0)‘, borderWidth: 3 } } }, { name: ‘辽源市‘, itemStyle: { normal: { // areaColor: ‘rgba(0,0,0,0)‘, borderColor: ‘#3496c2‘, borderWidth: 1 }, emphasis: { areaColor: ‘rgba(0,0,0,0)‘, borderWidth: 3 } } }, { name: ‘通化市‘, itemStyle: { normal: { // areaColor: ‘rgba(0,0,0,0)‘, borderColor: ‘#65a16f‘, borderWidth: 1 }, emphasis: { areaColor: ‘rgba(0,0,0,0)‘, borderWidth: 3 } } }, { name: ‘白山市‘, itemStyle: { normal: { // areaColor: ‘rgba(0,0,0,0)‘, borderColor: ‘#65a16f‘, borderWidth: 1 }, emphasis: { areaColor: ‘rgba(0,0,0,0)‘, borderWidth: 3 } } }, { name: ‘松原市‘, itemStyle: { normal: { // areaColor: ‘rgba(0,0,0,0)‘, borderColor: ‘#3496c2‘, borderWidth: 1 }, emphasis: { areaColor: ‘rgba(0,0,0,0)‘, borderWidth: 3 } } }, { name: ‘白城市‘, itemStyle: { normal: { // areaColor: ‘rgba(0,0,0,0)‘, borderColor: ‘#3496c2‘, borderWidth: 1 }, emphasis: { areaColor: ‘rgba(0,0,0,0)‘, borderWidth: 3 } } }, { name: ‘延边朝鲜族自治州‘, itemStyle: { normal: { // areaColor: ‘rgba(0,0,0,0)‘, borderColor: ‘#65a16f‘, borderWidth: 1 }, emphasis: { areaColor: ‘rgba(0,0,0,0)‘, borderWidth: 3 } } } ] } ] }); });

  

ECharts 地图实现

原文:https://www.cnblogs.com/Michelle20180227/p/12539847.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!