Changing the X-axis display in a graph

Question

Changing the X-axis display in a graph

Navigation

#1 by (0 votes)

-1

I'm using the google API to create some financial graphs. I currently have data where the X (horizontal) axis represents the date and the Y (vertical) axis represents the quotation for the day:

Therangesshowninthefollowingimageindicateweekends(SaturdayandSunday),wheretherearenoquotes:

Is there any way for the Google Chart API to remove these days from the preview so the chart looks like this?

Hereisthecodeforthestartingpoint: link

I could change the first column to numeric data generated linearly instead of dates, remove the legend and generate it on its own ... but instead wanted to know if there is a more appropriate or practical way.

Note: I do not need a solution that works specifically with weekends, there are holidays too, so an idea that checks null values would be better.

javascript google-charts

asked by anonymous 02.02.2015 / 13:03

1 answer

Resizing on iOS 8 I need the file to list a specific folder

score 0 · Answer 1

You can put null in the data.

google.charts.load('current', {
  'packages': ['corechart']
});
google.charts.setOnLoadCallback(drawChart);

function drawChart() {

  var data = google.visualization.arrayToDataTable([
    ['Data', 'PLLO1 - Pallose'],
    [new Date('01/01/2015'), 1.00],
    [new Date('01/02/2015'), 1.02],
    [new Date('01/05/2015'), 1.04],
    [new Date('01/06/2015'), 1.06],
    [new Date('01/07/2015'), null],
    [new Date('01/08/2015'), 1.10],
    [new Date('01/09/2015'), 1.12],
    [new Date('01/12/2015'), 1.14],
    [new Date('01/13/2015'), 1.16],
    [new Date('01/14/2015'), 1.18]
  ]);

  var options = {
    title: 'Cotações da Empresa Pallose LTDA (fictícia)',
    pointSize: 5,
    legend: {
      position: 'bottom'
    }
  };

  var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));

  chart.draw(data, options);
}

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script><divid="curve_chart" style="width: 900px; height: 500px"></div>