Separate areas for line chart from google sheets

12 views

Skip to first unread message

ms1110

unread,

Dec 13, 2018, 3:57:11 PM12/13/18

to Google Visualization API

Hi!

I create a linechart from a google sheet with two lines and want to have two separate areas - one for each line, one on top and one underneath.

Also, options for the chart do not work.

So my questions: can I split the chart in two different areas - a crosshair above both would be nice and how do I insert option (e.g. line colors)

here is my code:

<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>COT Gold</title>
<link rel="stylesheet" href="cot1.css">
     
<script type="text/javascript"
    src='https://www.gstatic.com/charts/loader.js'></script>

    <script type="text/javascript">

    // Load the Visualization API and the corechart package.
      google.charts.load('current', {'packages':['corechart']});

    // Set a callback to run when the Google Visualization API is loaded.
      google.charts.setOnLoadCallback(drawChart);

     function drawChart() {

      // Create data table 1.
      var queryString = encodeURIComponent();
      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/14KASFMnH2-Bgw-687Zuf7DjTk1aoYGuSSUr3fw7T8w4/edit#gid=0');
      query.setQuery('select A, AB, B');
      query.send(handleQueryResponse);

    }

     function handleQueryResponse(response) {
      if (response.isError()) {
        alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage());
        return;
      }

      var data = response.getDataTable();

      // Instantiate and draw our chart, passing in some options.

      var chart = new google.visualization.LineChart(document.getElementById('chart1_div')).
      draw(data,

      {vAxes:[
      {viewWindowMode:'explicit',
        viewWindow:{
        max:-100000,
        min:-500000
        },
        },
        ],

        series:[
        {targetAxisIndex:1},
        {targetAxisIndex:0}

    ],

    }

    );

    }

    </script>

</head>
<body>

<div id="chart1_div"></div>

</body>
</html>

Reply all

Reply to author

Forward

0 new messages