Question

我已经搜索了很多，但仍然没有得到一个明确的答案所以我只是想再次问它，所以有人可以为我清除它。

我有这个谷歌图表：

 google.charts.load('current', {'packages': ['corechart']});
google.charts.setOnLoadCallback(drawChart1);

    function drawChart1() {
        var data = google.visualization.arrayToDataTable([
        ['Year', 'Savings'],
        [0, 0],
        [1, 2546250],
        [2, 2851500],
        [3, 3156750],
        [4, 3462000],
        [5, 3767250],
    ]);


    var options = {
        hAxis: {title: '', titleTextStyle: {color: '#ccc'}, count: 8},
        vAxis: {minValue: 0, gridlineColor: '#bcbcbc', backgroundColor: 'red', count: 8, format: '$#,###'},
        legend: {position: 'none'},
        colors: ['#91c33b'],
    };
    var chart = new google.visualization.AreaChart(document.getElementById('chart_div'));
        chart.draw(data, options);

     }

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div" class="charts"></div>

正如你所看到的，我已经为这些点使用了静态值，但我需要它们根据我在角度中添加的滑块进行更改。是否可以在移动或更新滑块时以某种方式重绘图表，并且图表可以采用dyncamic值而非静态？

Answer 1

如果您使用角度，您可以创建一个指令。请看这里的例子。

https://github.com/square/metrics/blob/master/main/web/static/script.js#L102 https://github.com/square/metrics/blob/master/main/web/static/index.html#L157

使用角度值绘制动态变化的谷歌图表

1 个答案: