Refresh chart after selection in order to get the right chart in save chart code

50 views
Skip to first unread message

Tora 68

unread,
Feb 22, 2021, 3:11:00 PM2/22/21
to Google Visualization API
Hi
- I'm building some code in order to select 2 strata variables using html form/select.
    <form id="formASL" name="formASL" onchange="drawChart()" >
         <select id="ASLdropdown">
         <option value="[203] ASL TO3">[203] ASL TO3</option>
         <option value="[213] ASL AL">[213] ASL AL</option>
     </select>
    </form>
    <form id="formFLUSSO" name="formFLUSSO" onchange="drawChart()" >
         <select id="FLUSSOdropdown">
         <option value="TOSSICODIPENDENZA">TOSSICODIPENDENZA</option>         
         <option value="ALCOLDIPENDENZA">ALCOLDIPENDENZA</option>
     </select>
    </form>   

        // Take selected STRATA(i)           
        mySTRATA1 = document.getElementById("ASLdropdown").value;          
        mySTRATA2 = document.getElementById("FLUSSOdropdown").value;

- Then I select the right values to be plot on an area chart according to the filters defined by strata variabiles, just with a for cylce:
        // Create the vars for CHART DATA TABLE        
        for(i=0; i<info.length; i++) {
       
            if(mySTRATA1 == info[i].STRATA1 && mySTRATA2 == info[i].STRATA2 && info[i].Anno=="2015") {
               PREV2015 = info[i].Prevalenti;
               INCI2015 = info[i].Incidenti;
            }// end if
    .....................          
        } // end for

- So I get the right values in the chart data table:
        // Create the CHART DATA TABLE
        var data = google.visualization.arrayToDataTable([
          [ {label: 'Anno', id: 'anno', type: 'string'},
            {label: 'Prevalenti', id: 'prevalenti', type: 'number'},
            {label: 'Incidenti', id: 'incidenti', type: 'number'} ],
          ['2015',  PREV2015,  INCI2015],
          ['2016',  PREV2016,  INCI2016],
          ['2017',  PREV2017,  INCI2017],
          ['2018',  PREV2018,  INCI2018],
          ['2019',  PREV2019,  INCI2019]
        ]);   

- Of course I call the proc to show the chart:

        // show actual chart
        var chart = new google.visualization.AreaChart(document.getElementById('chart_div'));
        chart.draw(data, options);
       
        - And I put the code to let the chart to be saved:

        // Allow to save chart BEGIN   
        google.visualization.events.addListener(chart, 'ready', function () {
            chart_div.innerHTML = '<img src="' + chart.getImageURI() + '">';
        });

        document.getElementById('chart_png').outerHTML = '<a href="' + chart.getImageURI() + '" >Salva il grafico</a>';
        // Allow to save chart END

Now, everything works properly.
In particular if I go for saving the chart I just get everything is ok.
on the other hand,  if I change the strata variabiles in any way, I get properly the new chart, but (and here is finally the problem) , when I ask for saving the chart, it shoes the previous chart, not the just changed one.
More, If I reload the page and then go to saving the chart , everything goes fine.
I tried to force a page refresh, using
- onclick="window.location.reload();
- onclick="return RefreshWindow();
...
but nothing works.
anybody could help? thanks
Luca

Reply all
Reply to author
Forward
0 new messages