title: Highstock.js question: how to draw VWAP indicator only for current day data?
body: <p>I develop a project where we use Highcharts.js/Highstock.js library. I use candlestick chart where I display VWAP indicator (here is sample code in JSFiddle: <a href="http://jsfiddle.net/ogorobets/vh3y8195/" rel="nofollow noreferrer">http://jsfiddle.net/ogorobets/vh3y8195/</a>).</p>
  
  <pre><code>var ohlc = JSON.parse(ohlcStringified),
      volume = JSON.parse(volumeStringified);
  
  Highcharts.stockChart('container', {
      chart: {
          borderWidth: 1
      },
      title: {
          text: 'Volume Weighted Average Price (VWAP)'
      },
      legend: {
          enabled: true
      },
      yAxis: [{
          height: '60%'
      }, {
          top: '65%',
          height: '35%',
          offset: 0
      }],
      series: [{
          type: 'candlestick',
          id: 'AAPL',
          name: 'AAPL',
          data: ohlc,
          tooltip: {
              valueDecimals: 2
          }
      }, {
          type: 'column',
          id: 'volume',
          name: 'Volume',
          data: volume,
          yAxis: 1
      }, {
          type: 'vwap',
          linkedTo: 'AAPL',
          showInLegend: true
      }]
  });
  </code></pre>
  
  <p>For this chart I need to display VWAP indicator only for current day data. But in official documentation (<a href="https://www.highcharts.com/docs/chart-and-series-types/technical-indicator-series" rel="nofollow noreferrer">https://www.highcharts.com/docs/chart-and-series-types/technical-indicator-series</a>) I see that we can only set parameters for some indicator (as 'params: {period: 7}' for EMA indicator) but I didn't find an option to set time period for which we show indicator (VWAP in my case). Default behaviour is that indicator is shown for whole timeline.  Please advise is it possible to set time period for which VWAP indicator is shown? </p>
  
  <p>I mean I don't need to set visible range area where indicator is shown with rangeSelector to one day. But instead I need to not draw VWAP indicator to other chart timeline area except current day. Do you know is it possible to develop that with highstock.js?</p>
  
  <p>Thank you in advance!</p>
  
  <p><strong>Update 1:</strong></p>
  
  <p>Thank you Wojciech Chmiel! Based on your idea (Using hidden chart serie  that consists only of data for current day. And based on this new chart to display WVAP indicator) I have built solution that I needed.</p>
  
  <p>Here is a link to JSFiddle: <a href="http://jsfiddle.net/ogorobets/vh3y8195/50/" rel="nofollow noreferrer">http://jsfiddle.net/ogorobets/vh3y8195/50/</a> .
  Here is my latest code:</p>
  
  <pre><code>var ohlc = JSON.parse(ohlcStringified),
      volume = JSON.parse(volumeStringified);
  var wvapSerieData = [];    
  var lastDayDate = new Date("December 6, 2018 00:00:00");
  var lastDayDateTs = lastDayDate.getTime();
  
  for(var i = 0; i &lt; ohlc.length; i++) {
      var currentPoint = ohlc[i];
      if(lastDayDateTs &lt;= currentPoint.x) {
           var pointToAdd = Object.assign({}, 
            currentPoint, {color: 'transparent', lineColor: 'transaprent'});
           wvapSerieData.push(pointToAdd);
      }
  }
  
  Highcharts.stockChart('container', {
      chart: {
          borderWidth: 1
      },
      title: {
          text: 'Volume Weighted Average Price (VWAP)'
      },
      legend: {
          enabled: true
      },
      yAxis: [{
          height: '60%'
      }, {
          top: '65%',
          height: '35%',
          offset: 0
      }],
      series: [{
          type: 'candlestick',
          id: 'AAPL',
          name: 'AAPL',
          data: ohlc,
          tooltip: {
              valueDecimals: 2
          }
      }, {
          type: 'column',
          id: 'volume',
          name: 'Volume',
          data: volume,
          yAxis: 1
      }, 
      {
          type: 'candlestick',
          id: 'wvap-serie',
          color: 'transparent',
          data: wvapSerieData,
          enableMouseTracking: false,
          tooltip: {
              valueDecimals: 2
          }
      },
      {
          type: 'vwap',
          linkedTo: 'wvap-serie',
          showInLegend: true,
          enableMouseTracking: true,
              dataGrouping: {
              enabled: true,
          }
      }]
  });
  </code></pre>