Question

我有一个html文档，其中显示了从同一Fusion Table查询的三个折线图。第一个图表是每年的出生人数，其他两个图表分别是每年的结婚和死亡人数。

我想设置vAxis，以使所有三个图表的比例尺都为0-35,000。我尝试了多种在线解决方案，包括设置viewWindowMode的最小/最大值和vAxis：ticks。每当我尝试设置其中之一时，图表均无法显示。

这是我目前的工作方式，但是显示的最大vAxis值为8K，我需要为35K才能与具有最高值的图表匹配。

  google.load('visualization', '1.1', { packages: ['line'] });
google.setOnLoadCallback(drawChart);

  function drawChart() {

    var query = "SELECT 'Year', 'Death' FROM 1_ZsP2sm6HteqyygtifQ0cIRKn00cA1GDeRu4KMEr WHERE 'Year_n' >= 1829 AND 'Year_n' <= 2012 ORDER BY 'Year'" ;

    var queryText = encodeURIComponent(query);
    var gvizQuery = new google.visualization.Query(
        'https://www.google.com/fusiontables/gvizdata?tq=' + queryText);

    gvizQuery.send(function(response) {
      var chart = new google.charts.Line(
          document.getElementById('linechart_death'));

      chart.draw(response.getDataTable(), {
    chart: {title:'Records Per Year'},
    legend: {position:'none'},

    lineWidth: 100,
    colors: '#87BA41',
      });
    });
  }

  google.setOnLoadCallback(drawChart);

Answer 1

材料图表不支持几个配置选项，
参见issues #: 2143。

这包括...

{hAxis,vAxis,hAxes.*,vAxes.*}.ticks
{hAxis,vAxis,hAxes.*,vAxes.*}.minValue
{hAxis,vAxis,hAxes.*,vAxes.*}.maxValue
{hAxis,vAxis,hAxes.*,vAxes.*}.viewWindowMode

要使用这些选项，需要使用经典图表...

材料 = google.charts.Line中的packages: ['line']

经典 = google.visualization.LineChart中的packages: ['corechart']

有一个选项可以使 Classic 图表与 Material ...

看起来相似

theme: 'material'

在同一页面的多个图表上将vAxis设置为相同比例

1 个答案: