HighCharts-在氣泡圖中以x軸表示x值的類別

Question

我的氣泡圖非常簡單，我希望它在xaxis上顯示自定義字符串而不是x值。 對於在x軸上的系列中的拳頭對象，顯示proyect 1，依此類推。

$(function () {
var names = ["DAVE","JOHN"];
var projects = ["Project 1","Project 2"];
$('#container').highcharts({

    chart: {
        type: 'bubble',
        plotBorderWidth: 1,
        zoomType: 'xy'
    },

    title: {
        text: 'Highcharts for staff project time'
    },

    xAxis: {
        categories:['Project 1', 'Project 2', 'Project 3']
    },



    series: [{
        data: [
                   { x: 3.5, y: 4, z: 5, color: 'blue' },
                   {  x: 7, y: 7, z: 3, color: 'blue' },
                   {  x: 4, y: 8, z: 6, color: 'blue' }
                ],
    }]

  });
});

我們要顯示項目1，proyect 2 ....，而不是相應的x值。 也許在x軸上顯示xAxis：{類別：['Project 1'，'Project 2'，'Project 3']}，

或在對象中

數據：[{名稱：Proyect 1，x：3.5，y：4，z：5，顏色：'blue'}，{名稱：Proyect 2，x：7，y：7，z：3，顏色：'blue '}，{名稱：Proyect 3，x：4，y：8，z：6，顏色：'blue'}]，

然后在x軸名稱中顯示，而不是x值。

這是我用於測試的jsfiddle，用於替換數據。

http://jsfiddle.net/jlbriggs/36zn2/1/

Answer 1

我們使這個氣泡圖非常簡單，我們希望它在xaxis上顯示自定義字符串而不是x值

$(function () {
var names = ["DAVE","JOHN"];
var projects = ["Project 1","Project 2"];
$('#container').highcharts({

    chart: {
        type: 'bubble',
        plotBorderWidth: 1,
        zoomType: 'xy'
    },

    title: {
        text: 'Highcharts for staff project time'
    },

    xAxis: {
        categories:['Project 1', 'Project 2', 'Project 3']
    },



    series: [{
        data: [
                   { x: 3.5, y: 4, z: 5, color: 'blue' },
                   {  x: 7, y: 7, z: 3, color: 'blue' },
                   {  x: 4, y: 8, z: 6, color: 'blue' }
                ],
    }]

   });
});

我們要顯示項目1，proyect 2 ....，而不是相應的x值。 也許像它在x軸上顯示的那樣

 xAxis: {
        categories:['Project 1', 'Project 2', 'Project 3']
      },

或在對象中

data: [
                   { name: Proyect 1, x: 3.5, y: 4, z: 5, color: 'blue' },
                   { name: Proyect 2, x: 7, y: 7, z: 3, color: 'blue' },
                   { name: Proyect 3, x: 4, y: 8, z: 6, color: 'blue' }
                ],

然后在x軸名稱中顯示，而不是x值。

我從Highcharts服務台獲得了答案，我想分享一下：

在第一種情況下，不會打印類別的標簽，因為類別是從0開始索引的，因此您有標簽“直到2”的索引。 但是在數據中，您引用的是3,5 / 4/7索引，因此僅打印數字。 （具有這些索引的標簽不在類別中）。

您可以使用以下解決方案：-在數據中修復索引，例如： http : //jsfiddle.net/ee5ffq9w/1/-增加類別數量-使用類別名稱為： http : //jsfiddle.net/ee5ffq9w的點/ 2 /