2017-08-09 19 views
1

HighStockの縦棒グラフを作成しています。スクロールバーを有効にしました:有効にしました。スクロールバーは小さなデータセットでは問題ありませんが、このデータセットには多くのカテゴリがあります(私は必要なだけ半分だけを含んでいます)。何らかの理由で、特定の数の後、棒グラフの矩形が正しく表示されない(または間違った値を表示する)xAxisラベルが実際の名前ではなく数値として表示されます。また、私はクリックイベントを追加するために各バーにIDを追加しようとしていますが、最初に適切にレンダリングされたバーにIDを追加するだけです。また、すべての矩形要素が正しくレンダリングされるため、スクロールバーでもIDを適切に追加できることに気付きました。より大きなデータセットに対してこのスクロールバーを動作させる方法はありますか?大型データセットでHighStocks/HighChartsスクロールバーが表示されないxAxisラベルが消えてバーが表示されない

あなたは、上記の問題は、このリンクではどのようなものかわかります https://jsfiddle.net/sauravvenkat/96ue59qy/

Highcharts.chart('container', { 
    chart: { 
     type: 'column', 
     color: 'rgb(245,111,35)', 
    }, 
    title: { 
     text: 'Physicians By Specialty' 
    }, 
    subtitle: { 
     text: 'Source: Physician Specaialty' 
    }, 
    xAxis: { 
     type: 'category', 
     title: { 
      text: null 
     }, 
     scrollbar: { 
      enabled: true 
     }, 
     // min: 0, 
     max: 7, 
     tickLength: 0, 
     labels: { 
      rotation: -60 
     } 
    }, 
    yAxis: { 
     title: { 
      text: 'Profiles', 
      align: 'high' 
     } 
    }, 
    plotOptions: { 
     bar: { 
      dataLabels: { 
       enabled: true 
      } 
     } 
    }, 
    legend: { 
     enabled: false 
    }, 
    credits: { 
     enabled: false 
    }, 
    series: [{ 
     name: 'Totals', 
     color: 'rgb(245,111,35)', 
     data: [["Spec1",1000],["Spec2", 1000], ["Spec3",500],["Spec4",300],["Spec5",1000],["Spec6", 1000], ["Spec26",500],["Spec27",300],["Spec28",1000],["Spec29", 1000], ["Spec30",500],["Spec31",300],["Spec32",1000],["Spec33", 1000], ["Spec34",500],["Spec35",300],["Spec36",300],["Spec37",300], ["Spec38",300], ["Spec39",300], ["Spec40",300], ["Spec41",300], ["Spec42",300], ["Spec43",300], ["Spec44",300], ["Spec45",300], ["Spec46",300],["Spec47",1000],["Spec48", 1000], ["Spec49",500],["Spec50",300],["Spec51",1000],["Spec52", 1000], ["Spec53",500],["Spec54",300],["Spec55",1000],["Spec56", 1000], ["Spec57",500],["Spec58",300],["Spec59",300],["Spec60",300], ["Spec61",300], ["Spec62",300], ["Spec63",300], ["Spec64",300], ["Spec65",300], ["Spec66",300], ["Spec67",300], ["Spec68",300], ["Spec",300],["Spec24",1000],["Spec25", 1000], ["Spec26",500],["Spec27",300],["Spec28",1000],["Spec29", 1000], ["Spec30",500],["Spec31",300],["Spec32",1000],["Spec33", 1000], ["Spec34",500],["Spec35",300],["Spec36",300], ["Spec44",300], ["Spec45",300], ["Spec46",300],["Unknown",250]] 
    }] 
}); 

答えて

関連する問題