Google Charts格式无法正常工作

时间:2015-07-04 03:19:28

标签: javascript charts google-visualization

我有以下折线图代码。我想在列$旁边显示Earnings in AUD符号;但是我在互联网上尝试的一切都没有用。我的控制台也没有错误。

我怎样才能让它发挥作用?这是我的javaScript:

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

    function drawChart()
    {
      var data = new google.visualization.DataTable();
      data.addColumn('number', 'Day');
      data.addColumn('number', 'Pageviews');
      data.addColumn('number', 'Number of Sales');
      data.addColumn('number', 'Earnings in AUD');

      data.addRows([
        [1,  37.8, 80.8, 41.8],
        [2,  30.9, 69.5, 32.4],
        [3,  25.4,   57, 25.7],
        [4,  11.7, 18.8, 10.5],
        [5,  11.9, 17.6, 10.4],
        [6,   8.8, 13.6,  7.7],
        [7,   7.6, 12.3,  9.6],
        [8,  12.3, 29.2, 10.6],
        [9,  16.9, 42.9, 14.8],
        [10, 12.8, 30.9, 11.6],
        [11,  5.3,  7.9,  4.7],
        [12,  6.6,  8.4,  5.2],
        [13,  4.8,  6.3,  3.6],
        [14,  4.2,  6.2,  3.4]
      ]);

      var options = {
        chart: {

        },
        width: 900,
        height: 500
      };

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

      var formatter = new google.visualization.NumberFormat({prefix: '$', negativeColor: 'red', negativeParens: true});
      formatter.format(data, 3);

      chart.draw(data, options);
    }

这是图表的样子。如您所见,$符号不会显示在数据旁边:

screenshot

1 个答案:

答案 0 :(得分:0)

Please check this one, that might be helpful for you.
google.setOnLoadCallback(drawChart);
function drawChart()
{
  var data = new google.visualization.DataTable();
  data.addColumn('number', 'Day');
  data.addColumn('number', 'Pageviews');
  data.addColumn('number', 'Number of Sales');
  data.addColumn('number', 'Earnings in AUD');
  data.addColumn({type: 'string', role: 'tooltip'});

  data.addRows([
    [1,  37.8, 80.8, 41.8 , '1 Earnings in AUD 41.8 $'],
    [2,  30.9, 69.5, 32.4, '2 Earnings in AUD 32.4 $'],
    [3,  25.4,   57, 25.7, '3 Earnings in AUD 25.7 $'],
    [4,  11.7, 18.8, 10.5, '4 Earnings in AUD 10.5 $'],
    [5,  11.9, 17.6, 10.4, '5 Earnings in AUD 10.4 $'],
    [6,   8.8, 13.6,  7.7,'6 Earnings in AUD 7.7 $'],
    [7,   7.6, 12.3,  9.6,'7 Earnings in AUD 9.6 $'],
    [8,  12.3, 29.2, 10.6,'8 Earnings in AUD 10.6 $'],
    [9,  16.9, 42.9, 14.8,'9 Earnings in AUD 14.8 $'],
    [10, 12.8, 30.9, 11.6,'10 Earnings in AUD 11.6 $'],
    [11,  5.3,  7.9,  4.7,'11 Earnings in AUD 4.7 $'],
    [12,  6.6,  8.4,  5.2,'12 Earnings in AUD 5.2 $'],
    [13,  4.8,  6.3,  3.6,'13 Earnings in AUD 3.6 $'],
    [14,  4.2,  6.2,  3.4,'14 Earnings in AUD 3.4 $']
  ]);

    var formatter = new google.visualization.NumberFormat({
    fractionDigits: 2,
     prefix: '£'
   });
  var options = {
    chart: {

    },
    width: 900,
    height: 500
  };

 // var chart = new google.charts.Line(document.getElementById('linechart_material'));
   var chart  = new google.visualization.LineChart(document.getElementById('linechart_material'));     
  //var formatter = new google.visualization.NumberFormat({prefix: '$', negativeColor: 'red', negativeParens: true});
  // formatter.format(data, 3);

  chart.draw(data, options);
}