Every row has to have the same number of columns, so the problem here is that some rows have too many:
<html> <head> <script type="text/javascript" src="https://www.google.com/jsapi"></script> <script type="text/javascript"> google.load("visualization", "1", {packages:["corechart"]}); google.setOnLoadCallback(drawChart); function drawChart() { var data = new google.visualization.DataTable(); data.addColumn('number', 'Column 1 label'); data.addColumn('number', 'Player 1'); data.addColumn({type: 'string', role: 'tooltip', p: {html: true}}); data.addColumn('number', 'Player 1'); data.addColumn({type: 'string', role: 'tooltip', p: {html: true}}); data.addColumn('number', 'Ball'); data.addColumn({type: 'string', role: 'tooltip', p: {html: true}}); data.addRows([ [<?php echo $playerx01;?>, <?php echo $playery01;?>, '<b>Goalkeeper</b><br />Player <?php echo $player01;?>', null, null, null, null], [<?php echo $playerx02;?>, <?php echo $playery02;?>, '<b>Defender</b><br />Player <?php echo $player02;?>', null, null, null, null], [<?php echo $playerx03;?>, <?php echo $playery03;?>, '<b>Defender</b><br />Player <?php echo $player03;?>', null, null, null, null], [<?php echo $playerx04;?>, <?php echo $playery04;?>, '<b>Defender</b><br />Player <?php echo $player04;?>', null, null, null, null], [<?php echo $playerx05;?>, <?php echo $playery05;?>, '<b>Defender</b><br />Player <?php echo $player05;?>', null, null, null, null], [<?php echo $player1x01;?>, null, null, <?php echo $player1y01;?>, '<b>Goalkeeper</b><br />player <?php echo $player012;?>', null, null], [<?php echo $player1x02;?>, null, null, <?php echo $player1y02;?>, '<b>Defender</b><br />player <?php echo $player013;?>', null, null], [<?php echo $player1x03;?>, null, null, <?php echo $player1y03;?>, '<b>Defender</b><br />player <?php echo $player014;?>', null, null], [<?php echo $player1x04;?>, null, null, <?php echo $player1y04;?>, '<b>Defender</b><br />player <?php echo $player015;?>', null, null], [<?php echo $player1x05;?>, null, null, <?php echo $player1y05;?>, '<b>Defender</b><br />player <?php echo $player016;?>', null, null], [<?php echo $ballx;?>, null, null, null, null, <?php echo $bally;?>, '<b>Ball</b><br />'], [<?php echo $ballx;?>, null, null, null, null, <?php echo $bally;?>, '<b>Ball</b><br />'] // do you really want two ball rows? These will just draw on top of one another ]); var options = { title: 'Defence', hAxis: {title: '', minValue: 0, maxValue: 15}, vAxis: {title: '', minValue: 0, maxValue: 15}, legend: 'none', tooltip: { isHtml: true } }; var chart = new google.visualization.ScatterChart(document.getElementById('chart_div')); chart.draw(data, options); } </script> </head> <body> <div id="chart_div" style="width: 920px; height: 500px;"></div> </body> </html> On Friday, March 1, 2013 10:14:50 AM UTC-5, Jay Modha wrote: > > I don't need to add anymore players, just needed to add an extra ball with > a different color. I have done what you said but the graph does not display > anymore. I will paste the code if you could see whats wrong.Thanks :) > > > > <head> > <script type="text/javascript" src="https://www.google.com/jsapi > "></script> > <script type="text/javascript"> > google.load("visualization", "1", {packages:["corechart"]}); > google.setOnLoadCallback(drawChart); > function drawChart() { > var data = new google.visualization.DataTable(); > data.addColumn('number', 'Column 1 label'); > data.addColumn('number', 'Player 1'); > data.addColumn({type: 'string', role: 'tooltip', p: {html: true}}); > data.addColumn('number', 'Player 1'); > data.addColumn({type: 'string', role: 'tooltip', p: {html: true}}); > data.addColumn('number', 'Ball'); > data.addColumn({type: 'string', role: 'tooltip', p: {html: true}}); > data.addRows([ > [ <?php echo $playerx01;?>, <?php echo $playery01;?>, > '<b>Goalkeeper</b><br />Player <?php echo $player01;?>', null, null, null, > null, null, null], > [ <?php echo $playerx02;?>, <?php echo $playery02;?>, > '<b>Defender</b><br />Player <?php echo $player02;?>', null, null, null, > null, null, null], > [ <?php echo $playerx03;?>, <?php echo $playery03;?>, > '<b>Defender</b><br />Player <?php echo $player03;?>', null, null, null, > null, null, null], > [ <?php echo $playerx04;?>, <?php echo $playery04;?>, > '<b>Defender</b><br />Player <?php echo $player04;?>', null, null, null, > null, null, null], > [ <?php echo $playerx05;?>, <?php echo $playery05;?>, > '<b>Defender</b><br />Player <?php echo $player05;?>', null, null, null, > null, null, null], > [ <?php echo $player1x01;?>, null, null, <?php echo $player1y01;?>, > '<b>Goalkeeper</b><br />player <?php echo $player012;?>', null, null, null, > null], > [ <?php echo $player1x02;?>, null, null, <?php echo $player1y02;?>, > '<b>Defender</b><br />player <?php echo $player013;?>', null, null, null, > null], > [ <?php echo $player1x03;?>, null, null, <?php echo $player1y03;?>, > '<b>Defender</b><br />player <?php echo $player014;?>', null, null, null, > null], > [ <?php echo $player1x04;?>, null, null, <?php echo $player1y04;?>, > '<b>Defender</b><br />player <?php echo $player015;?>', null, null, null, > null], > [ <?php echo $player1x05;?>, null, null, <?php echo $player1y05;?>, > '<b>Defender</b><br />player <?php echo $player016;?>', null, null, null, > null], > [<?php echo $ballx;?>, null, null, null, null, null,null <?php echo > $bally;?>, '<b>Ball</b><br />'], > [<?php echo $ballx;?>, null, null, null, <?php echo $bally;?>, null, > null, null, '<b>Ball</b><br />'] > ]); > ]); > > > var options = { > title: 'Defence', > hAxis: {title: '', minValue: 0, maxValue: 15}, > vAxis: {title: '', minValue: 0, maxValue: 15}, > legend: 'none', > tooltip: { > isHtml: true > } > }; > > var chart = new > google.visualization.ScatterChart(document.getElementById('chart_div')); > chart.draw(data, options); > } > </script> > </head> > </table> > <body> > <div id="chart_div" style="width: 920px; height: 500px;"></div> > </body> > > </html> > > On Friday, March 1, 2013 2:56:32 PM UTC, asgallant wrote: >> >> Your array is a bit malformed. You put an extra null in the wrong place >> in the "player > > > >> 1" rows, and you are missing a couple commas in the last row: >> >> data.addRows([ >> [ <?php echo $playerx01;?>, <?php echo $playery01;?>, >> '<b>Goalkeeper</b><br />Player <?php echo $player01;?>', null, null, null, >> null, null, null], >> [ <?php echo $playerx02;?>, <?php echo $playery02;?>, >> '<b>Defender</b><br />Player <?php echo $player02;?>', null, null, null, >> null, null, null], >> [ <?php echo $playerx03;?>, <?php echo $playery03;?>, >> '<b>Defender</b><br />Player <?php echo $player03;?>', null, null, null, >> null, null, null], >> [ <?php echo $playerx04;?>, <?php echo $playery04;?>, >> '<b>Defender</b><br />Player <?php echo $player04;?>', null, null, null, >> null, null, null], >> [ <?php echo $playerx05;?>, <?php echo $playery05;?>, >> '<b>Defender</b><br />Player <?php echo $player05;?>', null, null, null, >> null, null, null], >> [ <?php echo $player1x01;?>, null, null, <?php echo $player1y01;?>, >> '<b>Goalkeeper</b><br />player <?php echo $player012;?>', null, null, null, >> null], >> [ <?php echo $player1x02;?>, null, null, <?php echo $player1y02;?>, >> '<b>Defender</b><br />player <?php echo $player013;?>', null, null, null, >> null], >> [ <?php echo $player1x03;?>, null, null, <?php echo $player1y03;?>, >> '<b>Defender</b><br />player <?php echo $player014;?>', null, null, null, >> null], >> [ <?php echo $player1x04;?>, null, null, <?php echo $player1y04;?>, >> '<b>Defender</b><br />player <?php echo $player015;?>', null, null, null, >> null], >> [ <?php echo $player1x05;?>, null, null, <?php echo $player1y05;?>, >> '<b>Defender</b><br />player <?php echo $player016;?>', null, null, null, >> null], >> [<?php echo $ballx;?>, null, null, null, null, null,null <?php echo >> $bally;?>, '<b>Ball</b><br />'], >> [3, null, null, null, 8, null, null, null, '<b>Defender</b><br >> />player <?php echo $player016;?>'] >> ]); >> >> I suspect that the "8" in the last row is in the wrong place, too, as it >> is in the tooltip column for the second player. >> >> Building the array like this is going to get very unwieldy as you add >> more players. There is an easier way to handle this problem, if you are >> interested. >> >> On Friday, March 1, 2013 6:11:43 AM UTC-5, Jay Modha wrote: >>> >>> //Any idea why i cant add another plot/color? thanks >>> >>> <html> >>> <script type="text/javascript" src="https://www.google.com/jsapi >>> "></script> >>> <script type="text/javascript"> >>> google.load("visualization", "1", {packages:["corechart"]}); >>> google.setOnLoadCallback(drawChart); >>> function drawChart() { >>> var data = new google.visualization.DataTable(); >>> data.addColumn('number', 'Column 1 label'); >>> data.addColumn('number', 'Player 1'); >>> data.addColumn({type: 'string', role: 'tooltip', p: {html: true}}); >>> data.addColumn('number', 'Player 1'); >>> data.addColumn({type: 'string', role: 'tooltip', p: {html: true}}); >>> data.addColumn('number', 'Ball'); >>> data.addColumn({type: 'string', role: 'tooltip', p: {html: true}}); >>> data.addColumn('number', 'Player 2'); >>> data.addColumn({type: 'string', role: 'tooltip', p: {html: true}}); >>> data.addRows([ >>> [ <?php echo $playerx01;?>, <?php echo $playery01;?>, >>> '<b>Goalkeeper</b><br />Player <?php echo $player01;?>', null, null, null, >>> null,null,null], >>> [ <?php echo $playerx02;?>, <?php echo $playery02;?>, >>> '<b>Defender</b><br />Player <?php echo $player02;?>', null, null, null, >>> null,null,null], >>> [ <?php echo $playerx03;?>, <?php echo $playery03;?>, >>> '<b>Defender</b><br />Player <?php echo $player03;?>', null, null, null, >>> null,null,null], >>> [ <?php echo $playerx04;?>, <?php echo $playery04;?>, >>> '<b>Defender</b><br />Player <?php echo $player04;?>', null, null, null, >>> null,null,null], >>> [ <?php echo $playerx05;?>, <?php echo $playery05;?>, >>> '<b>Defender</b><br />Player <?php echo $player05;?>', null, null, null, >>> null,null,null], >>> [ <?php echo $player1x01;?>, null, null, null <?php echo >>> $player1y01;?>, '<b>Goalkeeper</b><br />player <?php echo $player012;?>', >>> null, null,null], >>> [ <?php echo $player1x02;?>, null, null, null <?php echo >>> $player1y02;?>, '<b>Defender</b><br />player <?php echo $player013;?>', >>> null, null,null], >>> [ <?php echo $player1x03;?>, null, null, null <?php echo >>> $player1y03;?>, '<b>Defender</b><br />player <?php echo $player014;?>', >>> null, null,null], >>> [ <?php echo $player1x04;?>, null, null, null <?php echo >>> $player1y04;?>, '<b>Defender</b><br />player <?php echo $player015;?>', >>> null, null,null], >>> [ <?php echo $player1x05;?>, null, null, null <?php echo >>> $player1y05;?>, '<b>Defender</b><br />player <?php echo $player016;?>', >>> null, null,null], >>> >>> [<?php echo $ballx;?>, null, null, null, null, null,null <?php echo >>> $bally;?>, '<b>Ball</b><br />'], >>> [3, null, null, null 8,null, null,null '<b>Defender</b><br />player >>> <?php echo $player016;?>'] >>> ]); >>> >>> >>> var options = { >>> title: 'Defence', >>> hAxis: {title: '', minValue: 0, maxValue: 15}, >>> vAxis: {title: '', minValue: 0, maxValue: 15}, >>> legend: 'none', >>> tooltip: { >>> isHtml: true >>> } >>> }; >>> >>> var chart = new >>> google.visualization.ScatterChart(document.getElementById('chart_div')); >>> chart.draw(data, options); >>> } >>> </script> >>> </head> >>> </table> >>> <body> >>> <div id="chart_div" style="width: 920px; height: 500px;"></div> >>> </body> >>> >>> </html> >>> >>> On Thursday, February 28, 2013 5:05:20 PM UTC, Jay Modha wrote: >>>> >>>> It works :D you're a star mate, Thank you ever so much >>>> >>>> On Wednesday, February 27, 2013 9:13:39 PM UTC, Jay Modha wrote: >>>>> >>>>> //The code works perfectly fine and displays a scatter graph,however I >>>>> have two sets of data and I would therefore like two different colours, >>>>> one >>>>> for each set. the first set begins with $playerx01 and the 2nd set begins >>>>> with $player1x01. Help would be much appreciated. >>>>> >>>>> <html> >>>>> <head> >>>>> <script type="text/javascript" src="https://www.google.com/jsapi >>>>> "></script> >>>>> <script type="text/javascript"> >>>>> google.load("visualization", "1", {packages:["corechart"]}); >>>>> google.setOnLoadCallback(drawChart); >>>>> function drawChart() { >>>>> var data = google.visualization.arrayToDataTable([ >>>>> ['Age', 'Weight'], >>>>> [ <?php echo $playerx01;?>, <?php echo $playery01;?>], >>>>> [ <?php echo $playerx02;?>, <?php echo $playery02;?>], >>>>> [ <?php echo $playerx03;?>, <?php echo $playery03;?>], >>>>> [ <?php echo $playerx04;?>, <?php echo $playery04;?>], >>>>> [ <?php echo $playerx05;?>, <?php echo $playery05;?>], >>>>> >>>>> [ <?php echo $player1x01;?>, <?php echo $player1y01;?>], >>>>> [ <?php echo $player1x02;?>, <?php echo $player1y02;?>], >>>>> [ <?php echo $player1x03;?>, <?php echo $player1y03;?>], >>>>> [ <?php echo $player1x04;?>, <?php echo $player1y04;?>], >>>>> [ <?php echo $player1x05;?>, <?php echo $player1y05;?>] >>>>> >>>>> >>>>> ]); >>>>> >>>>> var options = { >>>>> title: 'Defence', >>>>> hAxis: {title: '', minValue: 0, maxValue: 15}, >>>>> vAxis: {title: '', minValue: 0, maxValue: 15}, >>>>> legend: 'none', >>>>> colors:['red','#004411'] >>>>> >>>>> }; >>>>> >>>>> var chart = new >>>>> google.visualization.ScatterChart(document.getElementById('chart_div')); >>>>> chart.draw(data, options); >>>>> } >>>>> </script> >>>>> </head> >>>>> <body> >>>>> <div id="chart_div" style="width: 900px; height: 500px;"></div> >>>>> </body> >>>>> </html> >>>>> >>>> -- 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 post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/google-visualization-api?hl=en. For more options, visit https://groups.google.com/groups/opt_out.
