Отображение валюты в API диаграмм Google

Я использую Google Chart 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 в приведенном выше коде, но в диалоговом окне не отображаются десятичные дроби или знак доллара (я добавил знак доллара после захвата экрана).

Как я могу получить число в диалоговом окне, чтобы оно отображалось так же, как числа в выровненном по левому краю вертикальном столбце?

Я попытался обновить массив PHP, который я использую, чтобы заполнить данные в формате валюты там, но затем диаграмма Google не отображается, поскольку это не простая цифра.

Ответы

Ответ 1

Здесь есть формат для указания как исходного значения, так и форматированного значения для ячейки [1]: при загрузке значения в диаграмму, а не, например, addRow(['2012-08-31, 4]); это будет addRow(['2012-08-31', {v: 4, f: '$4.00'}]);. Дополнительные примеры этого синтаксиса посыпаются через документы, но я не мог найти подходящее место для ссылки на него. Не должно быть слишком сложно изменить метод, с помощью которого объект данных из вашего примера генерируется для включения этого форматирования, но есть и другие параметры форматирования.

Если вы предпочитаете определять это форматирование в JS по какой-либо причине, вы можете использовать NumberFormatter.

[1] Я не думаю, что у них был этот синтаксис, когда я впервые начал использовать инструменты диаграммы. Не знаю, когда он был добавлен, или, если я просто не заметил его до недавнего времени.

Ответ 2

Это идеальный формат для бразильской валюты:

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

Также работает тонкий доллар, просто измените R$ на $

10500.5 stay 10.500,50, больше префикса

10500 stay 10.500,00, больше префикса

Ответ 4

Другим вариантом, который я нашел очень полезным и похожим по понятию методу 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