Upload data from google Charts

[jose mendes]

Hi all,
I'm working with the google charts on ionic 2 and by now I'm loving it.

But I have a problem .. When I try to update the data in the graph it gives me an error about the container.

When the application starts I create 3 graphs dynamically, and what I want to do is that when the user refreshes the page, the data of these graphs are updated, without creating new graphs.

Error:

ERROR Error: The container #3 is not defined.
at g (polyfills.js:3)
at gvjs_Z.gvjs_.getContainer (jsapi_compiled_default_module.js:240)
at gvjs_Z.gvjs_.draw (jsapi_compiled_default_module.js:236)
at google-chart-component.ts:63
at t.invokeTask (polyfills.js:3)
at Object.onInvokeTask (core.es5.js:4136)
at t.invokeTask (polyfills.js:3)
at n.runTask (polyfills.js:3)
at invoke (polyfills.js:3)
at e (polyfills.js:2)

Anyone have any idea what it might be?

Thanks!

 

[Daniel LaLiberte]

If you refresh the page, that normally means that everything starts from scratch, so you must recreate everything on the page.  I don't know what "refresh" means for ionic 2, but it appears from the error message that at least the container elements have been regenerated.  To help you figure this out, I'd suggest testing you use of iconic 2 with a very simple example, one chart, nothing else on the page.  

Hope this helps.

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsub...@googlegroups.com.
To post to this group, send email to google-visualization-api@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/b6126f32-eade-4050-96f9-eb284ab961fe%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

--

Daniel LaLiberte

dlaliberte@Google.com   5CC, Cambridge MA

[jose mendes]

hi,

My problem is that I want to update the graphics data but not draw them again. Is it possible to do that?

[Daniel LaLiberte]

The only way to update a Google Charts chart is to draw it again.   You don't have to create it again (with e.g. new google.visualization.PieChart(container)).

On Thu, May 4, 2017 at 9:54 AM, jose mendes <jose.me...@gmail.com> wrote:

hi,

My problem is that I want to update the graphics data but not draw them again. Is it possible to do that?

--

You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsub...@googlegroups.com.
To post to this group, send email to google-visualization-api@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.

To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/1bde13e6-17ac-4bb0-9d75-f4147ffc40ac%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

[jose mendes]

drawChartSelected(chart?) {

let loaded = false

this.wrapper = new google.visualization.ChartWrapper({

chartType: chart.options.chartType,

dataTable: chart.data,

options: chart.options || {},

containerId: chart.id

});

setTimeout(() => {

console.log(this.wrapper);

this.wrapper.draw();

}, 1000);

loaded = true;

this.events.publish('isLoaded', this.chartLoaded);

}

Here is the code I use to draw the graph again.

Can you see if this is correct or not?

This is where I get my error, when I try to do this.wrapper.draw ()

[Daniel LaLiberte]

Nothing appears wrong from what you have posted.  But you haven't posted all the details about what is going on, so we can't really tell.  If you could point us at a web page showing the error, then we could debug it to see what is going on.

There are some implicit ways to redraw a chart, by the way, but they end up internally calling the draw() method anyway.  But the ChartWrapper doesn't redraw implicitly (unless you use the refreshInterval option) by itself.

--

You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsub...@googlegroups.com.
To post to this group, send email to google-visualization-api@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.

To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/19d3763b-c734-4c91-9340-75ee90a84a8d%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

[jose mendes]

I attach a print screen of error

This is the method from which I invoke the function I showed above

  doRefresh(refresher) {

setTimeout(() => {

if (this.selectedGroup == "all") {

let updatedData = []

for (let i = 0; i < this.tagsId.length; i++) {

this.tagService.teste(this.tagsId[i].tagId).subscribe(tagData => {

updatedData.push(tagData["tagData"]["tagData"])

})

}

for (let i = 0; i < updatedData.length; i++) {

for (let data of updatedData[i]) {

data[0] = new Date(data[0])

}

updatedData[i].unshift(['Dias', 'Indice', { type: 'number', role: 'annotation' }])

}

for (let i = 0; i < updatedData.length; i++) {

this.charts[i].data = updatedData[i]

this.googleCharts.drawChartSelected(this.charts[i]);

}

this.event.subscribe('Loaded', (chartLoaded) => {

this.loaded = chartLoaded;

})

} else {

console.log("Update só de um grupo");

}

refresher.complete();

}, 1000);

}

[Daniel LaLiberte]

OK, now you have posted some more details, so thanks.  But this is further away from how the ChartWrapper might be affected by this context so this direction is not going to help (though maybe someone who knows ionic 2 may recognize something).  By pointing to a web page, I meant a link to a public web page that demonstrates the problem, so then we can debug to see what is happening in the chart at the time of the error.  If your page is not public, that will be difficult.  All the more reason to create a very simple example, say using jsfiddle, that avoids all the rest of the complexity on your page.

On Thu, May 4, 2017 at 10:59 AM, jose mendes <jose.me...@gmail.com> wrote:

 PrintScreen

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsub...@googlegroups.com.
To post to this group, send email to google-visualization-api@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.

To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/18f6123d-02ba-4f3b-a206-2e99985060c9%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

[jose mendes]

I'll try to do it on a simpler page, thank you