Javascript X轴标签作为类别未正确显示：Highcharts

当我试图在Highcharts API中创建动态流图表时，我遇到了一个奇怪的问题

首先要记住的是，我需要将X轴数据显示为

类别

，这就是为什么我在本例中将

日期

转换为字符串格式

出现的问题是X轴标签没有正确显示，X轴上只有一个点可见，这也改变了其值，而不是移动

下面是我尝试过的JS代码

Highcharts.chart('container', {
    chart: {
        type: 'line',
        animation: Highcharts.svg, // don't animate in old IE
        marginRight: 10,
        events: {
            load: function() {
              var series = this.series[0],
                    chart = this;
                var count = 0;
                 var draw = setInterval(function() {

                    x  = countval(); 
                   //   var counter = j;
                   //   console.log("Count: ", counter);
                      y = next();
                   console.log("CountVal : ", x);
                   console.log("DataPoints: ", y);
                 /* if (counter == 1300) {
                        clearInterval(draw);
                        return;
                    }
           */
                    if (counter > 1000) {
                        series.addPoint([x, y], true, true, false);
                    } else {
                        series.addPoint([x, y], true, false, false);
                    }
                }, 1000/130 );
             }
        }
    },

    time: {
        useUTC: false
    },

    title: {
        text: 'ECG Graph Plot From MySQl Data'
    },
    xAxis: {
        type: 'category',
        tickInterval: 200,
     /*/   labels: {
      format: '{value:%H:%M:%S}',
      range: false,
    },/*/
      //  plotLines: generateDynamicPlotLines(),
       // crosshair: false
    },
    yAxis: {
        title: {
            text: 'Value'
        },
        plotLines: [{
            value: 0,
            width: 1,
            color: '#808080'
        }]
    },
    tooltip: {
        enabled: false,
      /*/  headerFormat: '<b>{series.name}</b><br/>',
        pointFormat: '{point.x:%Y-%m-%d %H:%M:%S}<br/>{point.y:.2f}'/*/
    },
    legend: {
        enabled: false
    },
    exporting: {
        enabled: false
    },
     plotOptions: {
        series: {
            marker: {
                enabled: false
            },
            states: {
                        hover: {
                            enabled: false
                        }
                    }
        }
    },
    series: [{
            animation: false,
            name: 'ECG Graph Plot From MySQl Data',
            dataGrouping: {
                enabled: false
            },
            data: []
        },

    ]
});

Highcharts.chart（'container'{
图表：{
键入：“行”，
动画：Highcharts.svg，//不要在旧IE中设置动画
marginRight:10，
活动：{
加载：函数（）{
var series=此.series[0]，
图表=这个；
var计数=0；
var draw=setInterval（函数（）{
x=countval（）；
//var计数器=j；
//控制台日志（“计数：”，计数器）；
y=下一个（）；
console.log（“CountVal:，x”）；
日志（“数据点：”，y）；
/*如果（计数器==1300）{
净空间隔（抽签）；
返回；
}
*/
如果（计数器>1000）{
系列添加点（[x，y]，真，真，假）；
}否则{
系列添加点（[x，y]，真，假，假）；
}
}, 1000/130 );
}
}
},
时间：{
useUTC:false
},
标题：{
文本：“来自MySQl数据的ECG图形打印”
},
xAxis：{
类型：'类别'，
时间间隔：200，
/*/标签：{
格式：“{值：%H:%M:%S}”，
范围：false，
},/*/
//打印线：生成的动态打印线（），
//十字线：错
},
亚克斯：{
标题：{
文本：“值”
},
绘图线：[{
值：0，
宽度：1，
颜色：'#808080'
}]
},
工具提示：{
启用：false，
/*/headerFormat:“{series.name}
”，
点格式：“{point.x:%Y-%m-%d%H:%m:%S}
{point.Y:.2f}”/*/
},
图例：{
已启用：false
},
出口：{
已启用：false
},
打印选项：{
系列：{
标记：{
已启用：false
},
国家：{
悬停：{
已启用：false
}
}
}
},
系列：[{
动画：错，
名称：“来自MySQl数据的ECG图形打印”，
数据分组：{
已启用：false
},
数据：[]
},
]
});

为了进一步了解，你可以检查我的小提琴，它显示了我的问题。您可以看到X轴的问题

---

我将

tickInterval

设置为200，它不会绘制任何点。如果我把

ticipipxelsinterval

。X轴点只是更新编号而不是移动。

尝试将xAxis.type设置为“datetime”而不是“category”。

正如我在上面的问题中提到的那样。我需要X轴标签上的类别，我知道datetime会给我想要的结果。Hi@Chempooro，

tickInterval:200

with

category

axis type导致只生成第200个勾号。在这种情况下不支持Shift动画。