Question

以下是我的气泡图JSON数据。

{
 "chart":{"type":"bubble","plotBackgroundImage":"Image/bubble.jpg"},
 "plotOptions":{"series":{"dataLabels":{"enabled":true}}},
 "series":
  [
   {"data":[{"x":7,"y":7,"z":49,"name":"Task 2"}]},
   {"data":[{"x":7,"y":8,"z":56,"name":"Task 4"}]},
   {"data":[{"x":7,"y":8,"z":56,"name":"Task 3"}]},
   {"data":[{"x":3,"y":7,"z":21,"name":"Task 1"}]}
  ]
 }

为简单起见，我减少了数据内容，以下是我的结果..

我希望得到相关气泡的名称与气泡一起出现，尽管有系列名称，并且观察到y的数值显示在每个气泡上，不希望具有该数值表示并且还想要修复修复大小的背景图像。任何帮助将不胜感激。

enter image description here

--------更新的问题--------------

 string plotBackgroundImage = "Highcharts-3.0.7/graphics/Heatmap.jpg";
        var chart = new
        {
            type = ChartType,
            plotBackgroundImage

        };
        var dataLabels = new
        {
            enabled = true
        };
        var plotOptions = new
        {
            series = new { dataLabels = dataLabels }
        };
        var series = dataList;
        var obj = new { chart, plotOptions, series };
        string result = jSearializer.Serialize(obj);

并且我的JSON数据存储在字符串中以及我将此数据直接传递给Highchart API以绘制图形，现在我如何通过格式化函数可以任何人请解释或以任何其他方式实现此目标。

Answer 1

在工具提示格式化程序中，您可以访问与该点相关的所有选项。

我认为它也适用于这种情况。

这是一个示例。

tooltip:{
    formatter: function(){
        var name = this.point.options.name;
        return name + ' x : ' + this.x + " y: " + this.y
    }
}

我希望这会对你有所帮助。

Answer 2

使用tooltip.pointFormat，这是工具提示的模式，它的选项有限，但是point.name可以使用，看看：http://jsfiddle.net/bJtCt/

$('#container').highcharts({

    chart: {
    },

    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    },

    tooltip: {
        shared: true,
        useHTML: true,
        headerFormat: '<table>',
        pointFormat: '<tr><td style="color: {series.color}">{point.name}: </td>' +
        '<td style="text-align: right"><b>{point.y} EUR</b></td></tr>',
        footerFormat: '</table>',
        valueDecimals: 2
    },

    series: [{
        name: 'Short',
        data: [{
            x: 3, y: 15, name: 'test'
        }, {
            x: 5, y: 17, name: 'testing'   
        }]
    }]

});

在highcharts中获取气泡图中系列的名称

2 个答案: