2012-06-28 48 views
9

Tôi đang sử dụng API biểu đồ Google để hiển thị biểu đồ dạng đường, nhưng tôi cần số để hiển thị dưới dạng đơn vị tiền tệ. Trên chính biểu đồ, tôi đã có thể nhận được các con số để hiển thị như tiền tệ, nhưng khi con chuột di chuột qua một điểm và hộp thoại hiển thị, số đó không được hiển thị như được chỉ định.Hiển thị đơn vị tiền tệ trong API biểu đồ Google

 <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> 

Như bạn có thể nhìn thấy từ hình ảnh này, cột dọc hiển thị ở bên trái không sử dụng dấu chấm thập phân theo quy định sử dụng vAxis.format trong đoạn mã trên, nhưng hộp thoại không hiển thị số thập phân hoặc ký hiệu đô la (I thêm dấu đô la sau khi chụp màn hình).

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

Làm thế nào tôi có thể lấy số trong hộp thoại để hiển thị giống như những con số trong trái thẳng hàng cột dọc?

Tôi đã thử cập nhật mảng PHP mà tôi đang sử dụng để điền dữ liệu vào định dạng tiền tệ ở đó, nhưng sau đó biểu đồ Google không hiển thị vì nó không phải là chữ số thuần túy.

+0

Bạn có tìm thấy câu trả lời của mình không ?? –

Trả lời

10

Có định dạng để chỉ định cả giá trị thô và giá trị được định dạng cho ô bây giờ [1]: khi tải giá trị vào biểu đồ, thay vì, ví dụ: addRow(['2012-08-31, 4]); nó sẽ là addRow(['2012-08-31', {v: 4, f: '$4.00'}]); Ví dụ khác về cú pháp đó được rắc qua các tài liệu nhưng tôi không thể tìm thấy một nơi tốt để liên kết với nó. Sẽ không quá khó để thay đổi phương thức mà đối tượng dữ liệu $ từ ví dụ của bạn được tạo để bao gồm định dạng đó, nhưng cũng có các tùy chọn định dạng khác.

Nếu bạn muốn xác định định dạng đó trong JS vì bất kỳ lý do gì, bạn có thể sử dụng NumberFormatter.

[1] Tôi không nghĩ rằng họ có cú pháp này khi lần đầu tiên tôi bắt đầu sử dụng các công cụ biểu đồ. Không có ý tưởng khi nó được thêm vào, mặc dù, hoặc nếu tôi chỉ không bao giờ nhận thấy nó cho đến gần đây.

+0

Điều này làm việc, cảm ơn! – Dave

1

Một tùy chọn khác mà tôi thấy rất hữu ích, và tương tự như trong khái niệm phương pháp arrayToDataTable() là JavaScript đen cú pháp khởi tạo như sau:

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

Đây là định dạng hoàn hảo để Brazil tệ:

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

Các công việc đồng USD whit tốt cũng có, chỉ cần thay đổi R$ để $

10500.5 nghỉ 10.500,50, tiền tố hơn

10500 ở lại 10.500,00, thêm tiền tố

Các vấn đề liên quan