PHP mySQL Highcharts Json 多选

Question

我正在尝试使用两个系列名称（子类别）制作散点图。

highcharts 中的This 示例是我的起点。

在此示例中，您只有两个类别，即女性和男性。我想在工具提示中看到女性/男性的名字。不在传说中！

在myexample jsfiddle中我在数据和工具提示中添加了四个名字

我知道这不是正确的方法，但我想澄清一下我想要实现的目标。有谁知道如何正确处理这个，所以图例中仍然有两个类别（女/男），但在工具提示中还有女/男的名字。

已经非常感谢你了！

Highcharts.chart('container', {
chart: {
    type: 'scatter',
    zoomType: 'xy'
},
title: {
    text: 'Height Versus Weight of 507 Individuals by Gender'
},
subtitle: {
    text: 'Source: Heinz  2003'
},
xAxis: {
    title: {
        enabled: true,
        text: 'Height (cm)'
    },
    startOnTick: true,
    endOnTick: true,
    showLastLabel: true
},
yAxis: {
    title: {
        text: 'Weight (kg)'
    }
},
legend: {
    layout: 'vertical',
    align: 'left',
    verticalAlign: 'top',
    x: 100,
    y: 70,
    floating: true,
    backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF',
    borderWidth: 1
},
plotOptions: {
    scatter: {
        marker: {
            radius: 5,
            states: {
                hover: {
                    enabled: true,
                    lineColor: 'rgb(100,100,100)'
                }
            }
        },
        states: {
            hover: {
                marker: {
                    enabled: false
                }
            }
        },
        tooltip: {
            headerFormat: '<b>{series.name}</b><br>',
            pointFormat: 'name: (), {point.x} cm, {point.y} kg'
        }
    }
},
series: [{
    name: 'Female',
    color: 'rgba(223, 83, 83, .5)',
    data: [{name: 'Anna', [161.2, 51.6]}, {name: 'Clair',[167.5, 59.0]]

}, {
    name: 'Male',
    color: 'rgba(119, 152, 191, .5)',
    data: [{name: 'James',[174.0, 65.6], {name: 'Peet',[175.3, 71.8]]
}]

});

Answer 1

括号和大括号有很多错误，其中括号太多或太少。太多了，我无法全部指出，但主要是在分区区域周围。

但是，当您为系列定义名称时，您需要将散点图坐标定义为 x 和 y，如下所示：

series: [{
    name: 'Female',
    data: [{
        name: 'Anna'
        x: 161.2,
        y: 51.6
        },
        ...
        ]
    }
    ...
]

此外，要显示数据点的名称（即人），您可以使用以下工具提示格式化程序：

tooltip: {
    headerFormat: '<b>{series.name}</b><br>',
    pointFormat: 'Name: {point.name}, {point.x} cm, {point.y} kg'
}

关于散点数据的 Highcharts API：http://api.highcharts.com/highcharts/series.scatter.data

使用您的数据的工作示例：http://jsfiddle.net/ewolden/0uc1g8b5/2/