谷歌可视化柱形图指定目标行确定性的作用(Google Visualization Column Ch

当我把这个下面的代码我来到与可视化操场我得到的目标/目标行，但我想它要落空/点需要把握角色，在文档中指定。任何人都可以启发我如何与阵列输入到谷歌数据表中的，或DataTable的JSON字符串格式做

码

function drawVisualization() {

  // Create and populate the data table.
 var data = google.visualization.arrayToDataTable([
    ['Year', 'Red', 'Yellow', 'Green','Target'],
    ['2003',  20,   0,      0,80],
    ['2004',  0,   55,      0,80],
    ['2005',  0,   0,       80,80],
    ['2005',  0,   0,      85,80]
  ]);

  // Create and draw the visualization.
  new google.visualization.ColumnChart(document.getElementById('visualization')).
      draw(data,
           {title:"Yearly Coffee Consumption by Country",
            width:600, height:400,
            hAxis: {title: "Year"},
            legend:'none',
            colors:['red','yellow','green'],
            //isStacked: true,
            series:{
              3:{type:'steppedArea',areaOpacity:0}
            }
            //interpolateNulls: true
           }
      );
}

更新

我把它练到低于这个水平，用代码，但如何使线拉伸曲线宽度

function drawVisualization() {

  var data = new google.visualization.DataTable();
data.addColumn('string', 'Month'); // Implicit domain label col.
data.addColumn('number', 'Sales'); // Implicit series 1 data col.
data.addColumn({type:'number'});  // interval role col.
data.addColumn({type:'number'});  // interval role col.
data.addColumn({type:'number'});  // interval role col.
data.addColumn({type:'boolean',role:'certainty'}); // certainty col.
data.addRows([
    ['Red',20,  0,0,  80,true],
    ['Yellow',  0, 55, 0,  80,false],
    ['Green',  0,  0,  85,  80,false]
]);

  // Create and draw the visualization.
  new google.visualization.ColumnChart(document.getElementById('visualization')).
      draw(data,
           {title:"Yearly Coffee Consumption by Country",
            width:600, height:400,
            hAxis: {title: "Year"},
            legend:'none',
            colors:['red','yellow','green'],
            //isStacked: true,
            series:{
              3:{type:'line',areaOpacity:0}
            }
            //interpolateNulls: true
           }
      );
}

操场：

https://code.google.com/apis/ajax/playground/?type=visualization#column_chart

角色文档：

https://developers.google.com/chart/interactive/docs/roles

那么，什么是虚线右侧JSON格式？
有什么，我的意思是反正我可以显示在目标线的右侧角落箭头指示到视觉上指示目标是什么？

您可以通过在开始和图表结束创建空列，然后设置视图窗口，是你真正想要的范围内实现这一目标。下面的代码实现这一点：

    function drawVisualization() {

      var data = new google.visualization.DataTable();
      data.addColumn('string', 'Month'); // Implicit domain label col.
      data.addColumn('number', 'Sales'); // Implicit series 1 data col.
      data.addColumn({type:'number'});  // interval role col.
      data.addColumn({type:'number'});  // interval role col.
      data.addColumn({type:'number'});  // interval role col.
      data.addColumn({type:'boolean',role:'certainty'}); // certainty col.
      data.addRows([
        ['', null, null, null, 80, false],
        ['Red',20,  0,0,  80,true],
        ['Yellow',  0, 55, 0,  80,false],
        ['Green',  0,  0,  85,  80,false],
        ['', null, null, null, 80, true]
      ]);

      // Create and draw the visualization.
      new google.visualization.ColumnChart(document.getElementById('visualization')).
        draw(data,
             {title:"Yearly Coffee Consumption by Country",
              width:600, height:400,
              hAxis: {title: "Year"},
              legend:'none',
              colors:['red','yellow','green'],
              //isStacked: true,
              series:{
                3:{type:'line',areaOpacity:0}
              },
              hAxis: {
                viewWindow: {
                  min: 1,
                  max: 4
                }
              }

              //interpolateNulls: true
             }
            );
    }