自定义echarts中散点图中的标签百度

Question

引用此示例以使用echarts库创建散点图： 基本散点图

我的代码如下：

option ={
            xAxis : [
                        {
                            type : 'value',
                            scale:true
                        }
                    ],
            yAxis : [
                        {
                            type : 'value',
                            scale:true
                        }
                    ],
            series : [
                        {
                            symbolSize: 40,
                            itemStyle: {
                                        normal: {
                                                    color: 'lightblue',
                                                    borderWidth: 4,
                                                    label : {
                                                                show: true,
                                                                position: 'inside',
                                                                formatter: function(v)
                                                                {
                                                                    if (v==[161.2, 51.6])
                                                                        return 'a'
                                                                    else
                                                                        return v
                                                                }
                                                            }
                                                }
                                        },
                            type:'scatter',
                            data: [
                                    [161.2, 51.6],[167.5, 59.0],[157.0, 63.0],[155.8, 53.6],
                                    [170.0, 59.0], [166.0, 69.8], [176.2, 66.8]
                                  ],    
                        }
                    ]
        };

在series内部的formatter函数中，我试图将变量“ v”与数据中的坐标点进行匹配。 但是不满足该条件。 我要去哪里错了？ 我只在所有气泡中看到[object Object] 。 请帮忙。

Answer 1

如果您使用的是Echarts2.x版本，则代码如下：

option ={
    xAxis : [
        {
            type : 'value',
            scale:true
        }
    ],
    yAxis : [
        {
            type : 'value',
            scale:true
        }
    ],
    series : [
        {
            symbolSize: 40,
            itemStyle: {
                normal: {
                    color: 'lightblue',
                    borderWidth: 4,
                    label : {
                        show: true,
                        position: 'inside',
                        formatter: function(data){
                            var v = data.value;
                            if (v[0]==161.2 && v[1]==51.6)
                                return 'a'
                            else
                                return v
                        }
                    }
                }
            },
            type:'scatter',
            data: [
                [161.2, 51.6],[167.5, 59.0],[157.0, 63.0],[155.8, 53.6],
                [170.0, 59.0], [166.0, 69.8], [176.2, 66.8]
            ],    
        }
    ]
};

formatter函数的参数是一个散点上的点对象，其结构如下：

$vars:Array[3]
color:"lightblue"
componentSubType:"scatter"
componentType:"series"
data:Array[2]
dataIndex:0
dataType:undefined
name:""
seriesIndex:0
seriesName:"-"
seriesType:"scatter"
status:"normal"
value:Array[2]

因此，该参数不是您想要的数组。 itemStyle属性用于设置图形样式， label属性用于设置图形上的文本标签，该标签可用于解释图形的某些数据信息。 例如值，名称等。在Echarts3.x中，为了使整个配置的结构更加平坦合理，在同一级别上使用itemStyle删除了label 。 像itemStyle一样有normal和emphasis两种状态。 如果您使用的是Echarts3.x版本，则代码如下：

option ={
    xAxis : [
        {
            type : 'value',
            scale:true
        }
    ],
    yAxis : [
        {
            type : 'value',
            scale:true
        }
    ],
    series : [
        {
            symbolSize: 40,
            itemStyle: {
                normal: {
                    color: 'lightblue',
                    borderWidth: 4,
                }
            },
            label : {
                normal: {
                    show: true,
                    position: 'inside',
                    formatter: function(data){
                        var v = data.value;
                        if (v[0]==161.2 && v[1]==51.6)
                            return 'a'
                        else
                            return v
                    }
                }
            },
            type:'scatter',
            data: [
                [161.2, 51.6],[167.5, 59.0],[157.0, 63.0],[155.8, 53.6],
                [170.0, 59.0], [166.0, 69.8], [176.2, 66.8]
            ],    
        }
    ]
};