1

JavaScript と Google ビジュアライゼーション ライブラリは初めてです。以下の1のような折れ線グラフを作成しましたが、Y 軸に何も表示できません。データ テーブルの値とともに、軸自体が描画されるのを探しています。

これが私のコードです(グラフのラベルはスクリーンショットから変更されていますが、それ以上のものはありません):

google.setOnLoadCallback(drawLineChart);
function drawLineChart(){var data=google.visualization.arrayToDataTable(
    [
        [
            'Day',
            'Label 1','Label 2','Label 3','Label 4','Label 5',
            'Label 6','Label 7','Label 8','Label 9','Label 10',
        ],
        ['19 Aug 2013',1,0,0,0,0,0],
        ['20 Aug 2013',2,2,2,0,0,0],
        ['21 Aug 2013',5,5,0,6,5,0],
        ['22 Aug 2013',1,4,3,2,0,0],
        ['23 Aug 2013',0,0,0,4,0,0],
        ['24 Aug 2013',3,2,1,2,0,15],
        ['25 Aug 2013',1,2,1,2,0,0],
        ['26 Aug 2013',3,1,2,1,0,0],
        ['27 Aug 2013',0,0,3,2,0,1]
    ]);

    var options = {
        title:'Title',
        legend:{position:'bottom'},
        curveType:'none',
        interpolateNulls:true,
        chartArea:{left:0,top:10,width:"100%"}
    };

    var chart=new google.visualization.LineChart(document.getElementById('visits_by_day1'));chart.draw(data,options);}

スクリーンショット

4

3 に答える 3

2

chartArea.widthオプションを 100%に保つ別の答え:vAxis.textPositionオプションを "in" に設定すると、chartArea 内にラベルが描画されます。

var options = {
    title:'Title',
    legend:{position:'bottom'},
    curveType:'none',
    interpolateNulls:true,
    chartArea:{left:0,top:10,width:"100%"},
    vAxis:{textPosition: 'in'}
};

これにより、チャートエリアの端のすぐ内側に軸ラベルが表示されます

于 2013-08-27T15:24:52.313 に答える
0

いくつかのこと:

  1. 必要のない余分なラベルがあります。書かれたコードはまったく機能しません。ラベルの数を列の数まで減らします。
  2. 文字列を追加し、それらが日付として解釈されることを期待するとうまくいきません。明示してください。
  3. グラフ領域も vAxis ラベルを除外しました。

次のことを試してください。

function drawVisualization() {
  var data = new google.visualization.DataTable();
  data.addColumn('date', 'Day');
  data.addColumn('number', 'Label 1');
  data.addColumn('number', 'Label 2');
  data.addColumn('number', 'Label 3');
  data.addColumn('number', 'Label 4');
  data.addColumn('number', 'Label 5');
  data.addColumn('number', 'Label 6');
  data.addRows([
        [new Date('19 Aug 2013'),1,0,0,0,0,0],
        [new Date('20 Aug 2013'),2,2,2,0,0,0],
        [new Date('21 Aug 2013'),5,5,0,6,5,0],
        [new Date('22 Aug 2013'),1,4,3,2,0,0],
        [new Date('23 Aug 2013'),0,0,0,4,0,0],
        [new Date('24 Aug 2013'),3,2,1,2,0,15],
        [new Date('25 Aug 2013'),1,2,1,2,0,0],
        [new Date('26 Aug 2013'),3,1,2,1,0,0],
        [new Date('27 Aug 2013'),0,0,3,2,0,1]
    ]);

  var options = {
      title:'Title',
      legend:{position:'bottom'},
      curveType:'none',
      interpolateNulls:true,
      //chartArea:{left:0,top:10,width:"100%"}
  };

  var chart=new google.visualization.LineChart(document.getElementById('visits_by_day1'));
  chart.draw(data,options);
}
​
于 2013-08-27T14:02:38.227 に答える