2012-06-28 59 views
9

我正在使用Google图表API显示折线图,但我需要将数字显示为货币。在图表本身上,我可以将数字显示为货币,但是当鼠标悬停在某个点上并显示对话框时,该数字不会按指定显示。在Google图表中显示货币API

 <script type="text/javascript"> 
      google.load("visualization", "1", {packages:["corechart"]}); 
      google.setOnLoadCallback(drawChart); 

      function drawChart() { 

       var data = google.visualization.arrayToDataTable(<?php echo $data; ?>); 


       var options = { 
        chartArea:{left:40,top:10}, 
        pointSize: 6, 
        vAxis: {format:'$###,###,###.00'}, // Money format 
        legend: {position:'none'} 



       }; 

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

      } 
     </script> 

你可以从这个图片看到,立柱左侧显示在上面的代码中使用vAxis.format指定不使用小数点,但该对话框不显示小数或美元符号(我在屏幕截图后添加美元符号)。

http://i48.tinypic.com/121uznm.jpg

我怎样才能获得在对话框中显示的相同排列的竖列左边的数字是多少?

我尝试更新PHP数组,我使用它将数据填充到货币格式,但之后Google图表不显示,因为它不是普通数字。

+0

你有没有找到你的答案? –

回答

10

现在有一种格式可以指定单元格的原始值和格式化值[1]:将值加载到图表中时,而不是addRow(['2012-08-31, 4]);这将是addRow(['2012-08-31', {v: 4, f: '$4.00'}]);更多的例子,语法是通过文档洒,但我找不到一个好地方链接到它。改变生成示例中的$ data对象的方法不应该太难以包含该格式,但也有其他格式化选项。

如果您宁愿在JS中为任何原因定义格式,您可以使用NumberFormatter

[1]当我第一次开始使用图表工具时,我不认为他们有这种语法。不知道何时添加它,或者直到最近我才注意到它。

+0

这工作,谢谢! – Dave

1

,我发现非常有用的另一种选择,并且在概念上类似于arrayToDataTable()方法是JavaScript文字初始化语法如下:

var data = new google.visualization.DataTable(
       { 
        cols: [ 
         {id: 'date', label: 'Date', type: 'string'}, 
         {id: 'parnter1', label: 'Partner A', type: 'number'}, 
         {id: 'partner2', label: 'Partner B', type: 'number'} 
        ], 
        rows: [ 
         { c: [{ v: '06/2012' }, { v: 12345, f: '$12,345' }, { v: 98765, f: '$98,765'}] }, 
         { c: [{ v: '07/2012' }, { v: 10123, f: '$10,123' }, { v: 123123, f: '$123,123'}] } 
        ] 
       } 
      ); 

https://google-developers.appspot.com/chart/interactive/docs/datatables_dataviews

11

这是完美的格式,以巴西货币:

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

工作正常,丝毫美元也只是改变R$$

10500.5住宿10.500,50,更前缀

1050010.500,00,更多前缀