Formatting google charts programmatically

问题

Using the following code how can I set the formatting so that CurrencyValue1 and CurrencyValue2 is shown with a dollar (as a currency value) in the chart?

function drawChart() {
    var data = new google.visualization.DataTable();
    data.addColumn('date', 'Date');
    data.addColumn('number', 'CurrencyValue1');
    data.addColumn('number', 'CurrencyValue2');

    data.addRows(1);
    data.setValue(0, 0, new Date(2011, 8, 12));
    data.setValue(0, 1, 300.0000);
    data.setValue(0, 2, 759.1707);

    var chart = new google.visualization.LineChart(document.getElementById('chart_div'));

    chart.draw(data, { width: 660, height: 470, title: 'Heading', is3D: true, backgroundColor: '#f5f3e5' });
}

回答1:

see documentation: http://code.google.com/intl/cs-CZ/apis/chart/interactive/docs/reference.html#numberformatter

var data = new google.visualization.DataTable();
data.addColumn('date', 'Date');
data.addColumn('number', 'CurrencyValue1');
data.addColumn('number', 'CurrencyValue2');

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

This will format columns two and three like money (prefixed with dollar sign like "$15.00")

回答2:

This is perfect format to Brazilian currency:

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

Works fine whit dollar also, some change the R$ to $

10500.5 stay 10.500,50, more prefix

10500 stay 10.500,00, more prefix

回答3:

Use Data.SetFormattedValue and change 3# param.

Like this:

For i As Integer = 0 To dt.Rows.Count - 1
....

   str.Append("data.setValue( " & i & "," & 0 & "," & "'" & Cadena & "');")
   str.Append("data.setValue(" & i & "," & 1 & "," & Valor & ") ;")
    str.Append("data.setFormattedValue(" & i & "," & 1 & ",'" &  FormatCurrency(Valor.Replace(".", ",")) & "') ;")
next

来源：https://stackoverflow.com/questions/7298685/formatting-google-charts-programmatically

标签

javascript

html

charts

formatting

google-visualization