Draw dynamically changing google chart with angular values

Question

I have searched a lot but still did not get a clear answer so I just thought of asking it once again so someone can clear it for me.

I have this google chart :

 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>

As you can see i have used static values for the points, but i need them to change according to a slider that i have added in angular. Is it possible to somehow redraw the charts whenever the slider is moved or updated, and the chart to take dyncamic values and not static?

codegrep_admin · Accepted Answer · 2016-11-17 06:35:03Z

1

If you are using angular, you can perhaps create a directive. See here for an example.

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

answered Nov 17, 2016 at 6:35

codegrep_admin

5294 silver badges7 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Draw dynamically changing google chart with angular values

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related