echarts 中国地图分地区:华中 华北 华南 华东 等 您所在的位置:网站首页 中国地图华南华北 echarts 中国地图分地区:华中 华北 华南 华东 等

echarts 中国地图分地区:华中 华北 华南 华东 等

2023-10-10 01:31| 来源: 网络整理| 查看: 265

地图分地区展示

代码下载地址:map_area地图分地区展示

var dom = document.getElementById("container"); var myChart = echarts.init(dom); var app = {}; option = null; function randomData() { return Math.round(Math.random()*1000); } option = { title: { text: '总数:1565476', subtext: '', left: 'left' }, tooltip: { trigger: 'item' }, legend: { orient: 'vertical', left: 'left', data:['车辆'] }, visualMap: { min: 0, max: 2500, left: 'left', top: 'bottom', text: ['高','低'], // 文本,默认为数值文本 calculable: true }, dataRange: { x: '-1000px',//图例横轴位置 y: '-1000px',//图例纵轴位置 orient: 'horizontal', min: 0, max: 55000, text: ['高', '低'], // 文本,默认为数值文本 splitList: [ {start: 1, end: 1, color: '#225a69'}, {start: 2, end: 2, color: '#368299'}, {start: 3, end: 3, color: '#507c83'}, {start: 4, end: 4, color: '#98cae0'}, {start: 5, end: 5, color: '#b8dcea'}, {start: 6, end: 6, color: '#dfeef3'}, {start: 7, end: 7, color: '#c0bebf'}, {start: 8, end: 8, color: '#f2f5f6'}, {start: 9, end: 9, color: '#f2f5f6'}, {start: 10, end: 10, color: '#f2f5f6'}, ], splitNumber: 0 }, series: [ { name: '车辆', type: 'map', mapType: 'china', showLegendSymbol : false, roam: false, label: { normal: { show: true }, emphasis: { show: false } }, itemStyle: { normal: { lineStyle: { type: 'solid', color:'#000' }, label: { fontSize:16, lineHeght:16, height:16, color:'#000', show: true, formatter:function(params){ if(params.name == '台湾' || params.name == '澳门' || params.name == '香港' ){ return ''; } params.name = params.name.substring(0,2); return params.name+":"+params.data.percent//+"\r\n"+params.data.val+"\r\n"+"Top"+params.value; }, } } }, emphasis: { label: { show: true } }, data:[ {name: '华东地区',value: 1,val:561,percent:'35.85%' }, {name: '华北地区',value: 2,val:306,percent:'19.60%' }, {name: '华南地区',value: 3,val:274,percent:'17.55%' }, {name: '华中地区',value: 4,val:241,percent:'15.40%' }, {name: '西南地区',value: 5,val:108,percent:'6.91%' }, {name: '西北地区',value: 6,val:53,percent:'3.41%'}, {name: '东北地区',value: 7,val:19,percent:'1.27%' }, {name: '台湾', value: 8,percent:'' }, {name: '香港', value: 9,percent:'' }, {name: '澳门', value: 10,percent:'' }, ] } ] };; if (option && typeof option === "object") { myChart.setOption(option, true); }

echarts 地图分区的demo很多,希望能对小伙伴有帮助



【本文地址】

公司简介

联系我们

今日新闻

    推荐新闻

    专题文章
      CopyRight 2018-2019 实验室设备网 版权所有