Question

如果Highstock中的那些日期没有数据，我想显示空格。如果11月份没有数据，则该月份应在Highstock上显示空白。十月和十二月，应显示数据。

$(function() {

  var data = [
    /* Sep 2009 */
    [1253836800000, 26.05],
    [1254096000000, 26.59],
    [1254182400000, 26.48],
    [1254268800000, 26.48],
    /* Oct 2009 */
    [1254355200000, 25.84],
    [1254441600000, 26.41],
    [1254700800000, 26.57],
    [1254787200000, 27.14],
    [1254873600000, 27.18],
    [1254960000000, 27.04],
    [1255046400000, 27.21],
    [1255305600000, 27.26],
    [1255392000000, 27.15],
    [1255478400000, 27.33],
    [1255564800000, 27.22],
    [1255651200000, 26.86],
    [1255910400000, 27.12],
    [1255996800000, 28.39],
    [1256083200000, 29.27],
    [1256169600000, 29.31],
    [1256256000000, 29.13],
    [1256515200000, 28.93],
    [1256601600000, 28.20],
    [1256688000000, 27.49],
    [1256774400000, 28.05],
    [1256860800000, 26.93],
    /* Dec 2009 */
    [1259625600000, 28.14],
    [1259712000000, 28.03],
    [1259798400000, 28.07],
    [1259884800000, 27.62],
    [1260144000000, 26.99],
    [1260230400000, 27.12],
    [1260316800000, 28.26],
    [1260403200000, 28.06],
    [1260489600000, 27.81],
    [1260748800000, 28.14],
    [1260835200000, 27.74],
    [1260921600000, 27.86],
    [1261008000000, 27.41],
    [1261094400000, 27.92],
    [1261353600000, 28.32],
    [1261440000000, 28.62],
    [1261526400000, 28.87],
    [1261612800000, 29.86],
    [1261958400000, 30.23],
    [1262044800000, 29.87],
    [1262131200000, 30.23],
    [1262217600000, 30.10]
  ];
  /*$.getJSON('https://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function (data) {
   */ // Create the chart
  $('#container').highcharts('StockChart', {
    xAxis: {
      ordinal: false
    },

    rangeSelector: {
      selected: 1
    },

    title: {
      text: 'AAPL Stock Price'
    },

    series: [{
      name: 'AAPL',
      data: data,
      tooltip: {
        valueDecimals: 2
      }
    }]
  });
});
//});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://code.highcharts.com/stock/highstock.js"></script>
<script src="https://code.highcharts.com/stock/modules/exporting.js"></script>

<div id="container" style="height: 400px; min-width: 310px"></div>

View on JSFiddle

Answer 1

我认为您需要使用gapSize：

定义何时在图表中显示间隙。间隙大小为5意味着如果两个点之间的距离大于两个最接近点的距离的五倍，则图形将被破坏。

series: [{
    name: 'AAPL',
    data: data,
    gapSize: 5,
    tooltip: {
        valueDecimals: 2
    }
}]

下面的工作示例：

$(function() {

  var data = [
    /* Sep 2009 */
    [1253836800000, 26.05],
    [1254096000000, 26.59],
    [1254182400000, 26.48],
    [1254268800000, 26.48],
    /* Oct 2009 */
    [1254355200000, 25.84],
    [1254441600000, 26.41],
    [1254700800000, 26.57],
    [1254787200000, 27.14],
    [1254873600000, 27.18],
    [1254960000000, 27.04],
    [1255046400000, 27.21],
    [1255305600000, 27.26],
    [1255392000000, 27.15],
    [1255478400000, 27.33],
    [1255564800000, 27.22],
    [1255651200000, 26.86],
    [1255910400000, 27.12],
    [1255996800000, 28.39],
    [1256083200000, 29.27],
    [1256169600000, 29.31],
    [1256256000000, 29.13],
    [1256515200000, 28.93],
    [1256601600000, 28.20],
    [1256688000000, 27.49],
    [1256774400000, 28.05],
    [1256860800000, 26.93],
    /* Dec 2009 */
    [1259625600000, 28.14],
    [1259712000000, 28.03],
    [1259798400000, 28.07],
    [1259884800000, 27.62],
    [1260144000000, 26.99],
    [1260230400000, 27.12],
    [1260316800000, 28.26],
    [1260403200000, 28.06],
    [1260489600000, 27.81],
    [1260748800000, 28.14],
    [1260835200000, 27.74],
    [1260921600000, 27.86],
    [1261008000000, 27.41],
    [1261094400000, 27.92],
    [1261353600000, 28.32],
    [1261440000000, 28.62],
    [1261526400000, 28.87],
    [1261612800000, 29.86],
    [1261958400000, 30.23],
    [1262044800000, 29.87],
    [1262131200000, 30.23],
    [1262217600000, 30.10]
  ];
  /*$.getJSON('https://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function (data) {
   */ // Create the chart
  $('#container').highcharts('StockChart', {
    xAxis: {
      ordinal: false
    },

    rangeSelector: {
      selected: 1
    },

    title: {
      text: 'AAPL Stock Price'
    },

    series: [{
      name: 'AAPL',
      data: data,
      gapSize: 5,
      tooltip: {
        valueDecimals: 2
      }
    }]
  });
});
//});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://code.highcharts.com/stock/highstock.js"></script>
<script src="https://code.highcharts.com/stock/modules/exporting.js"></script>

<div id="container" style="height: 400px; min-width: 310px"></div>

View on JSFiddle

如果特定日期不存在数据，则显示空白

1 个答案: