Question

有谁知道如何将vAxis格式化为百分比？我尝试了很多东西，但没有用。代码如下。我已经尝试过NumberFormatter vAxis选项...

谢谢！

切尔西

<html>
<head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
        google.charts.load('current', { 'packages': ['corechart', 'bar'] });
        google.charts.setOnLoadCallback(drawChart);

        function drawChart() {
            var query = new google.visualization.Query("https://docs.google.com/spreadsheets/d/1mMYa6kqWIasGhdDG3i7YS5bzK_mtXT0_m0oqcYB-Loo/edit#gid=0?range=A1:C5");
            query.send(handleQueryResponse);
        }

        function handleQueryResponse(response) {
            var data = response.getDataTable();
            var chart = new google.visualization.ColumnChart(document.getElementById('student_chart'));
            var options = {
                isStacked: 'false',
                title: 'TPRI Averages 2015-16 (Students Performing on Grade Level)',
                curveType: 'function',
                legend: { gridlines: 'bottom' },
                colors: ['red', 'purple'],
                pointSize: 20,
                series: {
                	vAxis: {format: "###'%'"},
                    
                }
            };

            chart.draw(data, options);
        }
    </script>
</head>
<body>
    <div id="student_chart" style="width: 900px; height: 500px"></div>
</body>
</html>

Answer 1

vAxis不应在series中定义它应该在options

之内的第一级

var options = {
  vAxis: {format: "#,##0%"}
  ...

格式字符串，
将%添加到最后，会将数字转换为百分比

请参阅以下工作代码段...

＆＃13;

<html>
<head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
        google.charts.load('current', { 'packages': ['corechart', 'bar'] });
        google.charts.setOnLoadCallback(drawChart);

        function drawChart() {
            var query = new google.visualization.Query("https://docs.google.com/spreadsheets/d/1mMYa6kqWIasGhdDG3i7YS5bzK_mtXT0_m0oqcYB-Loo/edit#gid=0?range=A1:C5");
            query.send(handleQueryResponse);
        }

        function handleQueryResponse(response) {
            var data = response.getDataTable();
            var chart = new google.visualization.ColumnChart(document.getElementById('student_chart'));
            var options = {
                isStacked: 'false',
                title: 'TPRI Averages 2015-16 (Students Performing on Grade Level)',
                curveType: 'function',
                legend: { gridlines: 'bottom' },
                colors: ['red', 'purple'],
                pointSize: 20,
              	vAxis: {format: "#,##0%"}
            };

            chart.draw(data, options);
        }
    </script>
</head>
<body>
    <div id="student_chart" style="width: 900px; height: 500px"></div>
</body>
</html>

＆＃13;

如何在Google Charts API中将vAxis格式化为百分比？

1 个答案: