Google Charts:ChartWrapper和Formatters(NumberFormat)

Soc*_*fun 1 charts google-visualization google-chartwrapper

如何使用ChartWrapper和格式化程序在线/条形图上的工具提示中添加后缀?这是ChartWrapper的代码

function drawChartb() {

    var wrapper = new google.visualization.ChartWrapper({
    chartType: 'LineChart',
    dataTable: [['Person', 'Score'], [1, .50], [2, .25]],
    options: {'legend': 'bottom', 'colors': ['#D70005'], 'chartArea': {left: 40, top: 10, width: 450}, 'vAxis': {format: '#,###%', 'viewWindow': {max: 1.05, min: .2}}, 'pointSize': 6},
    containerId: 'chart_div'
    });

    wrapper.draw();
}
Run Code Online (Sandbox Code Playgroud)

这就是我在不使用chartwrapper的情况下完成的.

// set tooltip as percentage
var formatter = new google.visualization.NumberFormat({
pattern: '#%', 
fractionDigits: 2
});
formatter.format(data, 1);
Run Code Online (Sandbox Code Playgroud)

谢谢

jma*_*mac 6

您可以在包装器外部定义数据,在其上使用格式化程序,然后将dataTable设置为等于该数据源:

function drawVisualization() {

  var data = google.visualization.arrayToDataTable([
        ['Person', 'Score'], [1, .50], [2, .25]
    ]);

  // set tooltip as percentage
  var formatter = new google.visualization.NumberFormat({
    pattern: '#%',
    fractionDigits: 2
  });
  formatter.format(data, 1);

  var wrapper = new google.visualization.ChartWrapper({
    chartType: 'LineChart',
    dataTable: data,
    options: {'legend': 'bottom', 'colors': ['#D70005'], 'chartArea': {left: 40, top: 10, width: 450}, 'vAxis': {format: '#,###%', 'viewWindow': {max: 1.05, min: .2}}, 'pointSize': 6},
    containerId: 'visualization'
  });


  wrapper.draw();
}
Run Code Online (Sandbox Code Playgroud)

结果:

示例图像