[quote=82092:@Brock Nash]The only thing to note is in the App.HTMLHeader property you will need to copy over the scripts from that project. I could not get the libraries to load dynamically with the WebControl and had to place it there.
[/quote]
While this means you don’t get automatic updates it also means that if it disappears your control doesn’t just up & fail.
We’ve seen that happen where the source javascript moved, gets deleted, or simply gets more restrictive access so you can’t load it in your web control.
Hi Norman can you help me out this is my code and works perfect on safari,Firefox but no on Xojo Way
Chart Testthanks so much for the Big Help to all the XOJO team my problem is Fix
I am learning i am so glad
I need to try ChartPart as a subclass of the webcanvas instead of the normal canvas. I’ll let you know how it goes.
Hi @Brock Nash , i’m starting to construct some classes to show charts on my webapp.
Did you finished this?
[quote=82092:@Brock Nash]I’m working on a wrapper for google charts. It isn’t complete and it needs a fair amount of clean up but here’s a link to use what I currently have:
https://www.dropbox.com/s/tok6pkwptet476v/GoogleVizualization.xojo_binary_project
You can essentially copy the GoogleVisualization WebControlWrapperClass out of the project and put it in your own. The only thing to note is in the App.HTMLHeader property you will need to copy over the scripts from that project. I could not get the libraries to load dynamically with the WebControl and had to place it there.
Here’s the Google Documentation:
https://developers.google.com/chart/interactive/docs/index[/quote]
Can you share it with us?
Best regards,
Alex
[quote=257929:@Alexandre Cunha]Hi @Brock Nash , i’m starting to construct some classes to show charts on my webapp.
Did you finished this?
Can you share it with us?
Best regards,
Alex[/quote]
https://www.dropbox.com/s/xu57jf5uh6160s9/GoogleVizualization.zip?dl=0
Here’s the last version I’ve worked with. I left all the classes unlocked. I can’t really provide support for it but feel free to look around and experiment. I also have a desktop version of it too.
Hi @Brock Nash
Ual! It’s a big work!
Bigger than i could imagine! I’m not so clever to use it kkk
Well, there is a bug on that class. If you run you got an error immediately.
Can you have a look?
Best regards,
Alex
I ran it yesterday and it worked just fine. As I said I can’t really provide support for it but you’re more than use/change it in any way. What error are you seeing?
Just run
Could not execute returned javascript: Unexpected token ‘}’. Expected ‘:’ after property name.
Source: dataTableVv1yms7N = new google.visualization.DataTable({cols : [{type : ‘string’, id : ‘Month’, label : ‘Month’}, {type : ‘number’, id : ‘Value’, label : ‘Value’}, {type : ‘string’, id : ‘Style’, label : ‘Style’, role : ‘style’}, {type : ‘string’, id : ‘TRole’, label : ‘TRole’, role : ‘annotation’}], rows : [{c : [{v : ‘1’}, {v : 150,0}, {v : ‘color:#FF9932’}, {v : ‘tooltip 1’}]}, {c : [{v : ‘1’}, {v : 211,0}, {v : ‘color:#FFFF32’}, {v : ‘tooltip 2’}]}, {c : [{v : ‘1’}, {v : 485,0}, {v : ‘color:#99FF32’}, {v : ‘tooltip 3’}]}, {c : [{v : ‘1’}, {v : 228,0}, {v : ‘color:#32FF32’}, {v : ‘tooltip 4’}]}, {c : [{v : ‘1’}, {v : 374,0}, {v : ‘color:#32FF99’}, {v : ‘tooltip 5’}]}, {c : [{v : ‘1’}, {v : 240,0}, {v : ‘color:#32FFFF’}, {v : ‘tooltip 6’}]}, {c : [{v : ‘1’}, {v : 355,0}, {v : ‘color:#3299FF’}, {v : ‘tooltip 7’}]}, {c : [{v : ‘1’}, {v : 29,0}, {v : ‘color:#3232FF’}, {v : ‘tooltip 8’}]}, {c : [{v : ‘1’}, {v : 305,0}, {v : ‘color:#9932FF’}, {v : ‘tooltip 9’}]}, {c : [{v : ‘1’}, {v : 80,0}, {v : ‘color:#FF32FF’}, {v : ‘tooltip 10’}]}, {c : [{v : ‘1’}, {v : 20,0}, {v : ‘color:#FF3299’}, {v : ‘tooltip 11’}]}, {c : [{v : ‘1’}, {v : 261,0}, {v : ‘color:#FF3232’}, {v : ‘tooltip 12’}]}]});
dataViewVv1yms7N = new google.visualization.DataView(dataTableVv1yms7N);
optionsVv1yms7N = {backgroundColor : ‘transparent’, title : ‘My Awesome Graph’, colors : [’#FF0000’, ‘#00FF00’, ‘#0000FF’], selectionMode : ‘multiple’}
chartVv1yms7N = new google.visualization.PieChart(document.getElementById(‘Vv1yms7N’));
function selectHandlerVv1yms7N() {var selection = chartVv1yms7N.getSelection();var myParameters = new Array(); for (var i = 0; i < selection.length; i++) { var item = selection[i]; var row = item.row || 0; var column = item.column || 0; var str = dataViewVv1yms7N.getFormattedValue(row, column); var myPieces = new Array(); myPieces[0] = item.row; myPieces[1] = item.column; myPieces[2] = str; myParameters[i] = myPieces; }Xojo.triggerServerEvent(‘Vv1yms7N’,‘Selected’,myParameters);}
google.visualization.events.addListener(chartVv1yms7N, ‘select’, selectHandlerVv1yms7N);
document.getElementById(“Vv1yms7N”).style.visibility=“hidden”;
chartVv1yms7N.draw(dataViewVv1yms7N, optionsVv1yms7N);
dataTableVWorjKhp = google.visualization.arrayToDataTable([[‘Day’, ‘Value’, { role: ‘style’ }, ‘Value2’],[‘1’, {v:3, p:{style: ‘border: 5px solid green;’}}, ‘#880000’, 242],[‘2’, {v:409, p:{style: ‘border: 5px solid green;’}}, ‘#880000’, 457],[‘3’, {v:348, p:{style: ‘border: 5px solid green;’}}, ‘#880000’, 73],[‘4’, {v:435, p:{style: ‘border: 5px solid green;’}}, ‘#880000’, 338],[‘5’, {v:432, p:{style: ‘border: 5px solid green;’}}, ‘#880000’, 336],[‘6’, {v:296, p:{style: ‘border: 5px solid green;’}}, ‘#880000’, 386],[‘7’, {v:328, p:{style: ‘border: 5px solid green;’}}, ‘#880000’, 225],[‘8’, {v:155, p:{style: ‘border: 5px solid green;’}}, ‘#880000’, 94],[‘9’, {v:416, p:{style: ‘border: 5px solid green;’}}, ‘#880000’, 459],[‘10’, {v:176, p:{style: ‘border: 5px solid green;’}}, ‘#880000’, 305],[‘11’, {v:277, p:{style: ‘border: 5px solid green;’}}, ‘#880000’, 202],[‘12’, {v:439, p:{style: ‘border: 5px solid green;’}}, ‘#880000’, 352],[‘13’, {v:443, p:{style: ‘border: 5px solid green;’}}, ‘#880000’, 425],[‘14’, {v:256, p:{style: ‘border: 5px solid green;’}}, ‘#880000’, 60],[‘15’, {v:443, p:{style: ‘border: 5px solid green;’}}, ‘#880000’, 412],[‘16’, {v:50, p:{style: ‘border: 5px solid green;’}}, ‘#880000’, 1],[‘17’, {v:128, p:{style: ‘border: 5px solid green;’}}, ‘#880000’, 303],[‘18’, {v:94, p:{style: ‘border: 5px solid green;’}}, ‘#880000’, 90],[‘19’, {v:178, p:{style: ‘border: 5px solid green;’}}, ‘#880000’, 285],[‘20’, {v:168, p:{style: ‘border: 5px solid green;’}}, ‘#880000’, 37]]);
dataViewVWorjKhp = new google.visualization.DataView(dataTableVWorjKhp);
optionsVWorjKhp = {backgroundColor : ‘transparent’, selectionMode : ‘multiple’}
chartVWorjKhp = new google.visualization.BarChart(document.getElementById(‘VWorjKhp’));
function selectHandlerVWorjKhp() {var selection = chartVWorjKhp.getSelection();var myParameters = new Array(); for (var i = 0; i < selection.length; i++) { var item = selection[i]; var row = item.row || 0; var column = item.column || 0; var str = dataViewVWorjKhp.getFormattedValue(row, column); var myPieces = new Array(); myPieces[0] = item.row; myPieces[1] = item.column; myPieces[2] = str; myParameters[i] = myPieces; }Xojo.triggerServerEvent(‘VWorjKhp’,‘Selected’,myParameters);}
google.visualization.events.addListener(chartVWorjKhp, ‘select’, selectHandlerVWorjKhp);
document.getElementById(“VWorjKhp”).style.visibility=“hidden”;
chartVWorjKhp.draw(dataViewVWorjKhp, optionsVWorjKhp);
document.getElementById(“Vv1yms7N”).style.width=“715px”;
try{chartVv1yms7N.draw(dataViewVv1yms7N, optionsVv1yms7N);}catch(err){}
document.getElementById(“VWorjKhp”).style.width=“715px”;
try{chartVWorjKhp.draw(dataViewVWorjKhp, optionsVWorjKhp);}catch(err){}
document.getElementById(“VWorjKhp”).style.height=“718px”;
try{chartVWorjKhp.draw(dataViewVWorjKhp, optionsVWorjKhp);}catch(err){}
No good deed goes unpunished 
I just ran it and it works. Thanks so much for sharing Brock!
@Alexandre Cunha
What version of Xojo are you running and what browser are you running it in. Since its working for other people too I imagine one of these two issues. I’m using the XOJO 2016r1and Chrome on OSX. I’m not sure about Hal is using.
It was Chrome. On OS X.
Safari, OS X, 2016r1
not working here too with the same setup
Any chance of making this available as well?