如何在新點highchart中添加動態xaxis類別標簽名稱

Question

我需要在 highchart x,y 上添加點。 我無法在標簽中添加我的自定義 xaxis。 標簽自動添加potit 的索引。如何在新點xaixs 標簽中添加我的文本？

    var chartPresure = $('#PresureContainer').highcharts();
        var series = chartPresure.series[0];
        var newpointPresure = updatedresult.Pressure;
        if (lastDate != updatedresult.RegisterDatePersian) {
            var x = updatedresult.RegisterDatePersian,
                y = updatedresult.Pressure;
            series.addPoint([x, y, updatedresult.RegisterDatePersian], true);

            series.drawPoints();

            lastDate = updatedresult.RegisterDatePersian;
        }

Answer 1

您可以在點添加事件后更新軸標簽

function addPoint() {
  chart.series[0].addPoint(
    Math.floor(Math.random() * 6) + 1,
    true,
    false
  );
  //console.log(chart.xAxis[0].categories)
  chart.xAxis[0].categories.push(chart.series[0].data.length + 'th element')
  //console.log(chart.xAxis[0].categories)
  //update chart with category
  chart.update({
    xAxis: {
      categories: chart.xAxis[0].categories
    },
  });
}

 var chart = new Highcharts.chart('container', { chart: { type: 'column' }, title: { text: 'Stacked column chart' }, xAxis: { categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas'] }, yAxis: { min: 0, title: { text: 'Total fruit consumption' }, stackLabels: { enabled: true, style: { fontWeight: 'bold', color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray' } } }, legend: { align: 'right', x: -30, verticalAlign: 'top', y: 25, floating: true, backgroundColor: (Highcharts.theme && Highcharts.theme.background2) || 'white', borderColor: '#CCC', borderWidth: 1, shadow: false }, tooltip: { headerFormat: '<b>{point.x}</b><br/>', pointFormat: '{series.name}: {point.y}<br/>Total: {point.stackTotal}' }, plotOptions: { column: { stacking: 'normal', dataLabels: { enabled: true, color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white' } } }, series: [{ name: 'John', data: [5, 3, 4, 7, 2] }] }); function addPoint() { chart.series[0].addPoint( Math.floor(Math.random() * 6) + 1, true, false ); //console.log(chart.xAxis[0].categories) chart.xAxis[0].categories.push(chart.series[0].data.length + 'th element') //console.log(chart.xAxis[0].categories) chart.update({ xAxis: { categories: chart.xAxis[0].categories }, }); }

 <script src="https://code.highcharts.com/highcharts.js"></script> <script src="https://code.highcharts.com/modules/exporting.js"></script> <div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div> <button onclick="addPoint()" class="autocompare">Add point</button>