echarts 在地图上显示数值

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/m0_37805167/article/details/80825195

预期效果

这里写图片描述

代码配置

series: [{
    name: '',
     type: 'map',
     mapType: 'china',
     roam: false, 
     itemStyle: {
         normal: {
             label: {
                 show: true,
                 formatter:'{b}\n{c}',
             },
             borderWidth:0
         },
         emphasis: {
             label: {
                 show: false
             },
             areaColor:'rgb(213, 214, 79)',
         }
     },
     top: "10%", //组件距离容器的距离
     data: [{
         name: '北京',
         value: Math.round(Math.random() * 1000),
     }, {
         name: '天津',
         value: Math.round(Math.random() * 500)
     }, {
         name: '上海',
         value: Math.round(Math.random() * 1500)
     },...]

通过配置label中的formatter来设置地图上显示文字
{a} — series的name值
{b} — 数据项的name值
{c} — 数据项的value值

猜你喜欢

转载自blog.csdn.net/m0_37805167/article/details/80825195