使用highstocks創建一個間隔的垂直線

我想知道是否有可能以某種方式在xAxis中創建垂直線（plotLines）一段指定的時間間隔。使用highstocks創建一個間隔的垂直線

那些情節線索給定日期的一Here's an example。可以定義一個給定的時間間隔嗎？

xAxis: { 
      tickInterval: 5 * 4 * 1000, 
     lineColor: '#FF0000', 
     lineWidth: 1, 
     plotLines: [{ 
      value: Date.UTC(2014,03,05), 
      width: 1, 
      color: 'green', 
      dashStyle: 'dash', 
     }] 
    },

來源

2014-04-11 Alvaro

一般來說，在Highcharts中不存在像plotLines範圍那樣的事情。然而你cna創建簡單的功能：http://jsfiddle.net/kZkWZ/57/

function generatePlotLines(from, to, interval) { 
    var plotLines = []; 

    while (from < to) { 
     from += interval; 
     plotLines.push({ 
      value: from, 
      width: 1, 
      color: 'green', 
      dashStyle: 'dash', 
      label: { 
       text: 'some name', 
       align: 'right', 
       y: 122, 
       x: 0 
      } 
     }) 
    } 

    return plotLines; 
} 


$('#container').highcharts('StockChart', { 

    xAxis: { 
     plotLines: generatePlotLines(Date.UTC(2011, 0, 1), Date.UTC(2011, 3, 1), 7 * 24 * 3600 * 1000) 
    }, 

    rangeSelector: { 
     selected: 1 
    }, 

    series: [{ 
     name: 'USD to EUR', 
     data: usdeur 
    }] 
});

來源

2014-04-14 10:06:50

這個伎倆！謝謝！ – Alvaro

你在找什麼是plotBand。這允許使用範圍。一般用法是這樣的：

 xAxis: {   
      plotBands: [{ // mark the weekend 
       color: '#FCFFC5', 
       from: Date.UTC(2010, 0, 2), 
       to: Date.UTC(2010, 0, 4) 
      }], 
...

編輯 - 基於澄清就可以產生一系列像這樣：

chart: { 
    events: { 
     load: function() { 
      // set up the updating of the chart each second 
      var series = this.series[1]; 
      var Xmin = this.xAxis[0].min; 
      var Xmax = this.xAxis[0].max; 
      //console.log(Xmin); 
      //console.log(Xmax); 
      series.pointInterval = 24 * 3600 * 1000; 
      series.pointStart = Date.UTC(2011, 0, 01, 0, 0, 0, 0); 
      for (var i = Xmin; i < Xmax; i = i + (24 * 3600 * 1000)) { 
       var x = i, 
        y = 1; 
       series.addPoint([x, y], true); 
      } 

     } 
    } 
},

你需要讓新系列之前（但無數據）：

series: [{ 
    name: 'USD to EUR', 
    data: usdeur 
}, { 
    name: 'Interval', 
    type: 'column', 
    data: [] 
}

演示here。在你使用的那張圖表上，每秒鐘做這個事情都會磨礪。我每天都在做。每分鐘做這件事需要很長時間。請注意，我只是將其添加到可見的最小/最大負載。如果你想要跨越整個圖表，你將不得不定義自己的Xmin和Xmax。

來源

2014-04-11 11:53:48 wergeld

但是，這不是一個區間，這是一個範圍。我想每隔X秒添加一行，而不必定義範圍。 – Alvaro

啊，對不起。我以爲你的意思是跨度間隔。爲什麼不創建一個新的系列，其中有一列可以顯示圖表的整個高度？ – wergeld

它看起來並不像正確的方式，但更像是一種黑客攻擊。它不會填充圖表的其餘部分，其相當厚... – Alvaro

使用highstocks創建一個間隔的垂直線

回答

相關問題