Google Matrix

Question

için eksen başlangıç ​​noktası nasıl ayarlanır How to set Axis step in Google Chart?, Trying to set y axis to 0 in google charts'dan verilen çok sayıda çözümü denedim ve herhangi bir şans olmadan baktığım diğer birkaç gönderiyi denedim. Y eksenini 0 başlangıç ​​noktasına ayarlamak için neler yapılabileceği konusunda bir fikri var mı? Gerekirse daha fazla bilgi sağlayabilirim. Ayrıca bir yan soru, tıklandığında ön tarafa bir çizgi getirmek mümkündür. Örneğin, mevcut trend çizgisine tıkladığınızda, bu, ancak veri noktaları onlar için görünmüyor.

<div id="thelinechart" style="width: 1000px; height: 550px"></div> 
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> 
<script>google.charts.load('current', {'packages':['line']}); 
     google.charts.setOnLoadCallback(drawChart); 

    function drawChart() { 

     var data = new google.visualization.DataTable();data.addColumn('string','Year'); 
data.addColumn('number','Current Trend'); 
data.addColumn('number','2015 Projection'); 
data.addColumn('number','2016 Projection'); 
data.addColumn('number','2017 Projection'); 
data.addColumn('number','2018 Projection'); 
data.addRows([ 
['2015',250,250,null,null,null],['2016',200,300,200,null,null],['2017',200,310,230,200,null],['2018',290,340,320,280,290],['2019',null,370,350,360,290],['2020',null,null,430,470,390],['2021',null,null,null,520,440],['2022',null,null,null,null,450] 
]); 

     var options = { 
     chart: { 
      title: 'Capacity', 
      subtitle: 'in weight' 
     }, 
     width: 850, 
     height: 450, 
vAxis: { 
     viewWindowMode: 'explicit', 
     viewWindow: { 
      //max: 8000, 
      min: 0, 
     }, 
     gridlines: { 
      count: 18, //set kind of step (max-min)/count 
     } 
     } 
     }; 

     var chart = new google.charts.Line(document.getElementById('thelinechart')); 

     chart.draw(data, options); 
    } 
    </script> 

Kodumun bulunduğu bir jsfiddle bağlantım var. Örneğin aşağıdaki paket bağlı, Malzeme Grafikler için seçenekleri dönüştürmek için https://jsfiddle.net/abufr36y/

Answer 1

İhtiyacı ...

google.charts.Line.convertOptions(options)

göster ... güncellenen

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

 
function drawChart() { 
 
    var data = new google.visualization.DataTable(); 
 
    data.addColumn('string','Year'); 
 
    data.addColumn('number','Current Trend'); 
 
    data.addColumn('number','2015 Projection'); 
 
    data.addColumn('number','2016 Projection'); 
 
    data.addColumn('number','2017 Projection'); 
 
    data.addColumn('number','2018 Projection'); 
 
    data.addRows([ 
 
    ['2015',250,250,null,null,null],['2016',200,300,200,null,null],['2017',200,310,230,200,null],['2018',290,340,320,280,290],['2019',null,370,350,360,290],['2020',null,null,430,470,390],['2021',null,null,null,520,440],['2022',null,null,null,null,450] 
 
    ]); 
 

 
    var options = { 
 
    chart: { 
 
     title: 'Capacity', 
 
     subtitle: 'in weight' 
 
    }, 
 
    width: 850, 
 
    height: 450, 
 
    vAxis: { 
 
     viewWindowMode: 'explicit', 
 
     viewWindow: { 
 
     //max: 8000, 
 
     min: 0, 
 
     }, 
 
     gridlines: { 
 
     count: 18, //set kind of step (max-min)/count 
 
     } 
 
    } 
 
    }; 
 

 
    var view = new google.visualization.DataView(data); 
 
    view.setColumns([0, 2, 3, 4, 5, 1]); 
 

 
    var chart = new google.charts.Line(document.getElementById('thelinechart')); 
 

 
    // convert options for Material Charts, use view vs. data 
 
    chart.draw(view, google.charts.Line.convertOptions(options)); 
 
}

<script src="https://www.gstatic.com/charts/loader.js"></script> 
 
<div id="thelinechart"></div>