Highcharts在x轴上多次显示额外的标签

问题描述：

我使用highcharts创建了一个简单的气泡图，x轴值是时间戳。除了显示多个相同日期的标签之外，每件事都能正常工作。Highcharts在x轴上多次显示额外的标签

创建一个的jsfiddle：http://jsfiddle.net/anvk4y0o/

代码：

$('#container').highcharts({ 
    chart: { 
     type: 'bubble', 
     zoomType: 'xy' 
    }, 

    title: { 
     text: 'Highcharts Bubbles' 
    }, 

    xAxis: { 
     labels: { 
      formatter: function() { 
       return Highcharts.dateFormat('%m/%d/%Y', this.value); 
      } 
     } 
    }, 

    series: [{ 
     // data: [[1437415889539,36,79],[1437415899539,74,60],[1437515889539,76,58]] 
     data: [{ 
      x: 1437416876595, 
      y: 10, 
      z: 34435 
     }, { 
      x: 1437503398847, 
      y: 60, 
      z: 24435 
     }] 
    }] 
});

我只是想表明什么都x值我有。

感谢

有什么问题吗？ – mjohnsonengr

答

Highcharts会自动尝试填写日期范围。由于您仅为这两个日期提供了数据集，因此该插件试图制作完整的图表，但只有该日期范围才能使用。一旦添加了跨越较长日期范围的较大数据集，它应该进行补偿。在此之前，您可以添加选项来显示时间。这会让您更清楚地了解图表中发生的情况。 Documentation

 xAxis: { 
      dateTimeLabelFormats: { 
       millisecond: '%H:%M:%S.%L', 
       second: '%H:%M:%S', 
       minute: '%H:%M', 
       hour: '%H:%M', 
       day: '%e. %b', 
       week: '%e. %b', 
       month: '%b \'%y', 
       year: '%Y' 
      }, 
      labels: { 
       formatter: function() { 
        return Highcharts.dateFormat('%m/%d/%Y %H:%M:%S', this.value); 
       } 
      } 
     },

DEMO

编辑：在演示中，你可能需要做出的成绩窗口变大，所以你可以看到正确的DATE_TIME标签。

此外，您可以尝试使用tickInterval选项来强制应用范围，或考虑将时间戳更改为不包括时间，仅考虑实际日期。

你能告诉我如何显示2个日期吗？我尝试了所有的方法。但无法弄清楚 – testzuser

@testzuser塞巴斯蒂安的答案提供了您应该需要的所有信息。 – wrxsti

答

您可以通过设置tickInterval和startOnTick/endOnTick来定义滴答。其他解决方案是使用tickPositions/tickPositioner。

 startOnTick: true, 
     endOnTick:true, 
     tickInterval: 24 * 3600 * 1000, // one day

例子：http://jsfiddle.net/anvk4y0o/3/

很好，奇怪的是，我觉得我在文档中查找了15分钟的这些选项，但找不到它们。 – wrxsti

Highcharts在x轴上多次显示额外的标签

相关推荐