Javascript 如何为仅有数据可用的点显示X轴标签

发布于02月07日

我正在用echarts绘制一张时间图.我只想在图表中显示两个数据点.该图正确地显示了这两个点，但它在x轴(时间轴)上显示了两个以上的标签，这显然是这两个数据点之间的统一时间差.我想要的是只查看我拥有的数据点的时间标签.我怎么能做到这一点？

我也试过在xAxis.data中传递时间值，但它不起作用.

我已经为参考here创建了一个演示图.

预期结果:时间标签应仅显示在条形图下方.

推荐答案

此方法可确保仅为ECharts图表中的数据点显示时间标签.如果您有多个系列或需要处理其他方案，请调整格式化程序函数中的条件.

    option = {
  // Your existing options
  
  xAxis: {
    // Your existing xAxis configuration
    axisLabel: {
      // Your existing axisLabel configuration
      formatter: function (value, index) {
        // Check if the value corresponds to one of the data points
        for (let i = 0; i < option.series[0].data.length; i++) {
          if (value === option.series[0].data[i][0]) {
            // If the value matches a data point, format and return the time label
            return echarts.format.formatTime('yyyy-MM-dd\nhh:mm:ss', value);
          }
        }
        // Return an empty string for values that don't correspond to data points
        return '';
      }
    }
  },
  
  // Your existing options
};