WhiteHat's answer is correct, though a bit confusing for your particular use. I added this comment: "The one difference in WhiteHat's answer regarding where your data comes from, whether locally defined or via a spreadsheet query, doesn't matter because the solution is independent of that. Focus on how a DataView is used to change the role of a column of (string) data in your DataTable into a column used for annotations."
On Fri, Oct 4, 2019 at 6:52 AM Travel Berlin <[email protected]> wrote: > Hello everyone, > > I would like to add some annotations to my personal chart -which is a line > chart by the way- as shown here: > https://developers.google.com/chart/interactive/docs/roles#annotationrole > > Now, that doesnt seem hard at all; except that in my case the chart takes > its data from a Google Sheet, so I am *not *using this kind of > construction where I can manually define columns > > var data = new google.visualization.DataTable(); > data.addColumn('string', 'Month'); // Implicit domain label col. > data.addColumn('number', 'Sales'); // Implicit series 1 data col. > data.addColumn({type:'number', role:'interval'}); // interval role col. > data.addColumn({type:'number', role:'interval'}); // interval role col. > data.addColumn({type:'string', role:'annotation'}); // annotation role col. > data.addColumn({type:'string', role:'annotationText'}); // annotationText col. > data.addColumn({type:'boolean',role:'certainty'}); // certainty col. > data.addRows([ > ['April',1000, 900, 1100, 'A','Stolen data', true], > ['May', 1170, 1000, 1200, 'B','Coffee spill', true], > ['June', 660, 550, 800, 'C','Wumpus attack', true], > ['July', 1030, null, null, null, null, false] > ]); > > > > but rather THIS one where I don't know ho to proceed: > > > > // Load the Visualization API and the corechart package. > google.charts.load('current', {'packages':['corechart']}); > > // Set a callback to run when the Google Visualization API is loaded. > google.charts.setOnLoadCallback(drawGID); > > function drawGID() { > > var query = new google.visualization.Query( > 'https://docs.google.com/spreadsheets/d/***/gviz/tq?gid=0&sheet=****'); > query.setQuery('select A, H, P, Q, R, S, T, U, E, F, G limit 40 offset 2'); > query.send(handleQueryResponse); > } > > function handleQueryResponse(response) { > if (response.isError()) { > alert('Error in query: ' + response.getMessage() + ' ' + > response.getDetailedMessage()); > return; > } > > // Set chart options > var options = {'title':'Mon graphique', > 'width':'1300', > 'height':'1000', > 'hAxis':{'title':'time (mois)'}, > 'vAxis':{'title':'price'} > };// fine options > > var data = response.getDataTable(); > var chart = new > google.visualization.LineChart(document.getElementById('chart_div')); > chart.draw(data, options); > } > > We have tried on stackoverflow already > <https://stackoverflow.com/questions/58047642/how-to-add-annotation-to-google-bar-chart-where-dataset-comes-from-google-sheet> > but they say it's a duplicate from a previous answer already, which is not > in my opinion. > > any help would be appreciated, thanks > > -- > 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 [email protected]. > To view this discussion on the web visit > https://groups.google.com/d/msgid/google-visualization-api/0fcb9365-c379-423a-9c04-1779779253ca%40googlegroups.com > <https://groups.google.com/d/msgid/google-visualization-api/0fcb9365-c379-423a-9c04-1779779253ca%40googlegroups.com?utm_medium=email&utm_source=footer> > . > -- Daniel LaLiberte <https://plus.google.com/100631381223468223275?prsrc=2> [email protected] <[email protected]> Cambridge MA -- 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 [email protected]. To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/CAOtcSJM3He7nkfzGEiT7Jz0EvY-zDEnQu35xMr6GhztZ3qT0sg%40mail.gmail.com.
