首页 新闻 会员 周边

Echarts地图中在地图名称下多显示一行数值

1
悬赏园豆:10 [已解决问题] 解决于 2017-06-07 11:04

在Echarts图表数据加载完成后就在地图名称下多显示一行数值,

如图:

要怎么实现?

骚年,你渴望力量吗的主页 骚年,你渴望力量吗 | 初学一级 | 园豆:45
提问于:2017-06-06 19:26
< >
分享
最佳答案
1
series: [{
                    name: '浙江',
                    map: 'zhejiang',
                    type: 'map',
                    roam: true,
                    label: {
                        normal: {
                            show: true,
                            textStyle: {
                                fontWeight: 500
                            }
                        },
                        emphasis: {
                            show: true
                        }
                    },
                    itemStyle: {//改变区域颜色
                        normal: {
                            areaColor: '#C1FFC1',
                        }
                    },
                    markPoint: {//图形
                        symbolSize: 80,
                        label: {
                            normal: {
                                show: true,
                                formatter: '{c}%'
                            }
                        },
                        itemStyle: {
                            normal: {
                                areaColor: '#C1FFC1',
                                color: ['rgba(127, 255, 0, 0.7)']
                            },
                            emphasis: {
                                color: ['rgb(127, 255, 0)']
                            }
                        },
                        markArea: {
                            itemStyle: {
                                normal: {
                                    color: ['#7FFFD4']
                                }
                            }
                        },
                        data: [
                            {name: '杭州市', value: 10.2, coord: [120.153576, 30.287459], symbol: 'pin'},
                            {name: '金华市', value: 20, coord: [119.649506, 29.089524], symbol: 'pin'},
                            {name: '嘉兴市', value: 100, coord: [120.750865, 30.762653], symbol: 'arrow'}
                        ]
                    }
                }]
骚年,你渴望力量吗 | 初学一级 |园豆:45 | 2017-06-07 11:02
其他回答(3)
0

value值

收获园豆:10
AliceH | 园豆:282 (菜鸟二级) | 2017-06-06 22:44

value我知道,我想知道要怎么才能让它显示出来

@骚年,你渴望力量吗?:把数据绑定到value啊

支持(0) 反对(0) AliceH | 园豆:282 (菜鸟二级) | 2017-06-07 09:11

@AliceH: 

 1 series: [{
 2                     name: '百分比',
 3                     type: 'map',
 4                     map: 'zhejiang',
 5                     roam: true,//是否支持地图缩放平移
 6 //                    center: [120.153576, 30.287459],//视角中心 杭州
 7                     label: {
 8                         normal: {
 9                             show: true/*,
10                             textStyle: {
11                                 fontWeight: 500
12                             }*/
13                         }/*,
14                         emphasis: {
15                             show: true
16                         }*/
17                     },
18                     data: [
19                         {name: '嘉兴市', value: 100},
20                         {name: '杭州市', value: 1000},
21                         {name: '金华市', value: 999}
22                     ]
23                 }]

@骚年,你渴望力量吗?:这是echart2.0的

var option = {
        title: {
            text : '上海地图',
            subtext : '-。-'
        },
        tooltip : {
            trigger: 'item',

        },
        legend: {
            orient: 'vertical',
            x:'right',
            data:['数据名称']
        },
        series : [
            {
                name: '数据名称',
                type: 'map',
                mapType: '上海',
                selectedMode : 'single',
                itemStyle:{
                    normal:{label:{show:true}},
                    emphasis:{label:{show:true}}
                },
                data:[
                    {name: '崇明县',value: Math.round(Math.random()*1000)},
                    {name: '宝山区',value: Math.round(Math.random()*1000)},
                    {name: '嘉定区',value: Math.round(Math.random()*1000)},
                    {name: '青浦区',value: Math.round(Math.random()*1000)},
                    {name: '杨浦区',value: Math.round(Math.random()*1000)},
                    {name: '虹口区',value: Math.round(Math.random()*1000)},
                    {name: '闸北区',value: Math.round(Math.random()*1000)},
                    {name: '普陀区',value: Math.round(Math.random()*1000)},
                    {name: '静安区',value: Math.round(Math.random()*1000)},
                    {name: '黄浦区',value: Math.round(Math.random()*1000)},
                    {name: '卢湾区',value: Math.round(Math.random()*1000)},
                    {name: '长宁区',value: Math.round(Math.random()*1000)},
                    {name: '徐汇区',value: Math.round(Math.random()*1000)},
                    {name: '浦东新区',value: Math.round(Math.random()*1000)},
                    {name: '松江区',value: Math.round(Math.random()*1000)},
                    {name: '闵行区',value: Math.round(Math.random()*1000)},
                    {name: '金山区',value: Math.round(Math.random()*1000)},
                    {name: '奉贤区',value: Math.round(Math.random()*1000)},
                    {name: '南汇区',value: Math.round(Math.random()*1000)}
                ]
            }
        ]
    };
支持(0) 反对(0) AliceH | 园豆:282 (菜鸟二级) | 2017-06-07 10:27

@AliceH: 

series: [{
                    name: '浙江',
                    map: 'zhejiang',
                    type: 'map',
                    roam: true,
                    label: {
                        normal: {
                            show: true,
                            textStyle: {
                                fontWeight: 500
                            }
                        },
                        emphasis: {
                            show: true
                        }
                    },
                    itemStyle: {//改变区域颜色
                        normal: {
                            areaColor: '#C1FFC1',
                        }
                    },
                    markPoint: {//图形
                        symbolSize: 80,
                        label: {
                            normal: {
                                show: true,
                                formatter: '{c}%'
                            }
                        },
                        itemStyle: {
                            normal: {
                                areaColor: '#C1FFC1',
                                color: ['rgba(127, 255, 0, 0.7)']
                            },
                            emphasis: {
                                color: ['rgb(127, 255, 0)']
                            }
                        },
                        markArea: {
                            itemStyle: {
                                normal: {
                                    color: ['#7FFFD4']
                                }
                            }
                        },
                        data: [
                            {name: '杭州市', value: 10.2, coord: [120.153576, 30.287459], symbol: 'pin'},
                            {name: '金华市', value: 20, coord: [119.649506, 29.089524], symbol: 'pin'},
                            {name: '嘉兴市', value: 100, coord: [120.750865, 30.762653], symbol: 'arrow'}
                        ]
                    }
                }]
0

请问

这个百分比的值是怎么绑定上去,并显示出来的,我的只能悬浮才能出来。

大胃王1992 | 园豆:202 (菜鸟二级) | 2017-11-15 14:45
0

原来是markPoint属性调出来的

BobLiang | 园豆:202 (菜鸟二级) | 2021-04-23 18:03
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册