I'm probably missing the obvious and I'm thinking the answer lies in "dataview's" yet I see where it applies to rendering a chart and table for example, of the same queried data, but what I'd like to do is something like in which many chart options can be derived from a single query?
Currently, and I'll keep it simple for now, to render 4 linecharts to display 30day, 60day, 90day and 180day data, I have to run 4 queries: php query 1 =- 180 days convert to JSON, render 180 day chart php query 2 =- 90 days convert to JSON, render 90 day chart then 60, then 30 .... Yet I'm blatantly aware that all the necessary data to render all 4 is included in the first 180 day query. Page load times are just killing me and while I can show fewer images per page, the coding cannot be assigned per page on wordpress despite several plugins that are supposed to do just that. I dont know what they add to the code but it negates any charts from being rendered, forcing me to place all needed code into the header.php file. The results are great, but even the homepage takes far too long to load.. I should mention, The above example is only "SOME" of the data needed to render a page like this, but again, even if I break it down into 10 individual pages, I'm forced into running the same scripts and php calls to my database on every page, needed or not. <https://lh6.googleusercontent.com/-dBfh1ffmfFI/VNarBQ1iVjI/AAAAAAAAA6k/_yO0zdErqXg/s1600/page.jpg> ..and in case you ask I'll offer it up now also. I noticed some posts where it was stated only one callback should be made. The datatables seem to do well with the concept, <script type="text/javascript"> google.load('visualization', '1', {packages: ['table']}); google.setOnLoadCallback(drawTable); function drawTable() { var data4 = new google.visualization.DataTable(<?=$swtable1?>); var data5 = new google.visualization.DataTable(<?=$swtable2?>); var data6 = new google.visualization.DataTable(<?=$swtable5?>); var data7 = new google.visualization.DataTable(<?=$swtable6?>); var data8 = new google.visualization.DataTable(<?=$swtable7?>); var data9 = new google.visualization.DataTable(<?=$swtable8?>); var data10 = new google.visualization.DataTable(<?=$swtable9?>); var data11 = new google.visualization.DataTable(<?=$swtable10?>); var data12 = new google.visualization.DataTable(<?=$swtable11?>); var table4 = new google.visualization.Table(document.getElementById('swtable1_div')); table4.draw(data4, {showRowNumber: true}); var table5 = new google.visualization.Table(document.getElementById('swtable2_div')); table5.draw(data5, {showRowNumber: true}); var table6 = new google.visualization.Table(document.getElementById('swtable5_div')); table6.draw(data6, {showRowNumber: true}); var table7 = new google.visualization.Table(document.getElementById('swtable6_div')); table7.draw(data7, {showRowNumber: true}); var table8 = new google.visualization.Table(document.getElementById('swtable7_div')); table8.draw(data8, {showRowNumber: true}); var table9 = new google.visualization.Table(document.getElementById('swtable8_div')); table9.draw(data9, {showRowNumber: true}); var table10 = new google.visualization.Table(document.getElementById('swtable9_div')); table10.draw(data10, {showRowNumber: true}); var table11 = new google.visualization.Table(document.getElementById('swtable10_div')); table11.draw(data11, {showRowNumber: true}); var table12 = new google.visualization.Table(document.getElementById('swtable11_div')); table12.draw(data12, {showRowNumber: true}); } </script> But the charts do not: (the following does not work) <script type="text/javascript"> google.load("visualization", "1", {packages:["corechart"]}); google.setOnLoadCallback(drawChart); function drawChart() { var data7 = new google.visualization.DataTable(<?=$Data212?>); var data8 = new google.visualization.DataTable(<?=$jsonData21b?>); var data9 = new google.visualization.DataTable(<?=$jsonTablepie?>); var data10 = new google.visualization.DataTable(<?=$jsonTablepie?>); var data11 = new google.visualization.DataTable(<?=$jsonData30?>); var data12 = new google.visualization.DataTable(<?=$jsonData60?>); var data13 = new google.visualization.DataTable(<?=$jsonData90?>); var data14 = new google.visualization.DataTable(<?=$jsonData180?>); var data15 = new google.visualization.DataTable(<?=$jsonData30dp?>); var data16 = new google.visualization.DataTable(<?=$jsonData60dp?>); var data17 = new google.visualization.DataTable(<?=$jsonData90dp?>); var data18 = new google.visualization.DataTable(<?=$jsonData180dp?>); var options7 = {title: '<?=$query?>: Total Short Volume to Price Comparison', tooltip: {textStyle: fontSize:14}}, titleTextStyle:{fontSize:12}, width: 525, height:300, hAxis: {textStyle: {fontSize:11,fontStyle:'bold'}}, legend: maxLines:10, textStyle: {fontSize: 11.5}}, seriesType: "lines", series: { 0: {type: line", targetAxisIndex:0,color:'#2148F7'}, 1: {type: line", targetAxisIndex:1, color:'#BF0F0F'} }, vAxes:{ 0:{title:'Price',titleTextStyle: {fontSize:14},textStyle:{color: blue',fontSize:15}}, 1:{title:'Total Short Pct',titleTextStyle: {fontSize:14},textStyle:{color: 'red',fontSize:15}} }}; var options8 = {title: '<?=$query?>: Open Short Volume to Price Comparison', tooltip: {textStyle: fontSize:14}}, titleTextStyle:{fontSize:12}, width: 525, height:300, hAxis: { textStyle: {fontSize:11,fontStyle:'bold'}}, legend: maxLines:10, textStyle: {fontSize: 11.5}}, seriesType: "lines", series: { 0: {type: line", targetAxisIndex:0,color:'#2148F7'}, 1: {type: line", targetAxisIndex:1, color:'#BF0F0F'}}, vAxes:{ 0:{title:'Price',titleTextStyle: {fontSize:14},textStyle:{color: blue',fontSize:15}}, 1:{title:'Open Short Pct',titleTextStyle: {fontSize:14},textStyle:{color: 'red',fontSize:15}} }}; var options9 = {title: '<?=$query?>: Volume Comparison', width: 525, height: 300, is3D: 'true'}; var options10 = {title: '<?=$query?>: Volume Comparison', width: 525, height: 300, is3D: 'false'}; var options11 = {title: '<?=$query?>: 30 day Short Volume Percentage', width: 530, height: 300}; var options12 = {title: '<?=$query?>: 60 day Short Volume Percentage', width:530, height:300}; var options13 = {title: '<?=$query?>: 90 day Short Volume Percentage', width: 400, height: 300}; var options14 = {title: '<?=$query?>: 180 day Short Volume Percentage', width: 400, height: 300}; var options15 = {title: '<?=$query?>: 30 day Dark Pool Volume Percentages', width: 530, height: 300}; var options16 = { title: '<?=$query?>: 60 day Dark Pool Volume Percentages', width: 400, height: 300}; var options17 = { title: '<?=$query?>: 90 day Dark Pool Volume Percentages', width: 400, height: 300}; var options18 = { title: '<?=$query?>: 180 day Dark Pool Volume Percentages', width: 400, height: 300}; var chart7 = new google.visualization.ComboChart(document.getElementById('chart212_div')); chart7.draw(data7, options7); var chart8 = new google.visualization.ComboChart(document.getElementById('linechart21_div')); chart8.draw(data8, options8); var chart9= new google.visualization.PieChart(document.getElementById('piechart_div')); chart9.draw(data9, options9); var chart10 = new google.visualization.BarChart(document.getElementById('BARchart_div')); chart10.draw(data10, options10); var chart11 = new google.visualization.LineChart(document.getElementById('linechart30_div')); chart11.draw(data11, options11); var chart12 = new google.visualization.LineChart(document.getElementById('linechart60_div')); chart12.draw(data12, options12); var chart13 = new google.visualization.LineChart(document.getElementById('linechart90_div')); chart13.draw(data13, options13); var chart14 = new google.visualization.LineChart(document.getElementById('linechart180_div')); chart14.draw(data14, options14); var chart15 = new google.visualization.LineChart(document.getElementById('darkpool30_div')); chart15.draw(data15, options15); var chart16 = new google.visualization.LineChart(document.getElementById('darkpool60_div')); chart16.draw16(data16, options16); var chart 17= new google.visualization.LineChart(document.getElementById('darkpoo90_div')); chart17.draw(data17, options17); var chart18 = new google.visualization.LineChart(document.getElementById('darkpool180_div')); chart18.draw(data18, options18); } </script> Forcing me time and time again to start over with:each separately, which is where I am at now in case it's just a "where's Waldo" issue and I'm not seeing the obvious blunder... The horrific page load times can be seen at realshortdata.com and if you search a ticker symbol in the righthand sidebar, as I did with 'GOOG' in the sample data page you'll understand my plight. Dom -- 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. For more options, visit https://groups.google.com/d/optout.
