Re: [visualization-api] Re: prevent negative axis
If you look at the one of the codes that I posted earlier, I have a setting of height: 400 On Friday, May 16, 2014 5:55:10 PM UTC-5, Andrew Gallant wrote: I suspect the reason the height was changing is because you never defined the height of the chart. Try setting either the height option for the chart (it takes a number for the height in pixels, eg height: 400) or in the style/CSS of the container div. On Friday, May 16, 2014 6:11:34 PM UTC-4, Neil Camara wrote: Here is a sample json - https://gist.github.com/c0debreaker/3c8e64722fdac6505439 By the way, I wrote it in AngularJS. - This is how I call the function - $scope.bigstackedchart = plotStackedColumnChartTemplateForGoogleCharts($scope.jsonData, 'Total Bytes Used Aggregated by World (Received/Sent)', 'user_name', 'totalbytesent', 'totalbytesreceived' , 'totalbytes'); - and on the template, this is what is being targeted. divdiv google-chart chart=bigstackedchart/div/div By the way, it's been running great right after I added viewWindow. I've never seen anymore issue. Thanks! On Friday, May 16, 2014 2:18:32 PM UTC-5, Andrew Gallant wrote: What is the context that you call plotStackedColumnChartTemplateForGoogleCharts in? What do you do with the returned value? Can you provide an example of jsonData passed to the function? On Friday, May 16, 2014 3:27:58 AM UTC-4, Neil Camara wrote: Here is the code which contains the fix on line 71. I actually just added viewWindow : { min : 0 , max : 600 }, https://gist.github.com/c0debreaker/390245014dabf4e965d7 On Thursday, May 15, 2014 5:50:16 PM UTC-5, Andrew Gallant wrote: That may have fixed it, but I would consider that a temporary solution at best. If you could share code that replicates the issue, I'll look into it to see if I can figure out what is going on to cause it in the first place. On Thursday, May 15, 2014 4:24:07 PM UTC-4, Neil Camara wrote: Awesome! It's fixed! I set both min and max. Thank you so much! :) -- 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+unsubscr...@googlegroups.com. To post to this group, send email to google-visualization-api@googlegroups.com. Visit this group at http://groups.google.com/group/google-visualization-api. For more options, visit https://groups.google.com/d/optout.
[visualization-api] How to assign chart formatting options to a dashboard with CategoryFilter?
Hi there, I want to create a chart with intervals and a category filter. I started without the category filter and was able to assign the format options with draw(view, options_boxes_background). I tried then to add a category filter by including the ControlWrapper and ChartWrapper and creating a dashboard. I learned that I can't include formatting options in dashboard.draw(...) as per below example. How can I assign the formatting options to the dashboard respectively to the chart? The code looks as follows: *html* * head* *script type='text/javascript' src='https://www.google.com/jsapi'/script* *script type='text/javascript'* *google.load('visualization', '1', {packages:['corechart', 'controls']});* *google.setOnLoadCallback(drawChart);* *function drawChart() {* *var data = new google.visualization.DataTable();* *data.addColumn('string', 'x');* *data.addColumn('number', 'values');* *data.addColumn({id:'min', type:'number', role:'interval'});* *data.addColumn({id:'max', type:'number', role:'interval'});* *data.addColumn({id:'25th', type:'number', role:'interval'});* *data.addColumn({id:'med', type:'number', role:'interval'});* *data.addColumn({id:'75th', type:'number', role:'interval'});* *data.addColumn({id:'value', type:'number', role:'interval'});* *data.addRows([* *['SP 500', 2.60, 1.40, 3.50, 2.20, 2.60, 2.80, 2.60],* *['Nikkei', 1.50, 0.90, 2.30, 1.30, 1.50, 1.80, 1.50],* *['MSCI Europe', 1.80, 1.10, 2.50, 1.60, 1.80, 2.20, 1.80],* *['MSCI Emerging Markets', 1.50, 1.00, 2.90, 1.50, 1.80, 2.00, 1.50]* *]);* * var control = new google.visualization.ControlWrapper({* *containerId: 'control_div',* *controlType: 'CategoryFilter',* *options: {* * filterColumnIndex: 0,* * }* * });* * var chart = new google.visualization.ChartWrapper({* *containerId: 'chart_div',* *chartType: 'LineChart' * * });* * var view = new google.visualization.DataView(data);* *view.setColumns([0, 1, 2, 3, {* *type: 'number',* *sourceColumn: 4,* *id: '25th-to-med',* *role: 'interval'* *}, {* *type: 'number',* *sourceColumn: 5,* *id: 'med-to-75th',* *role: 'interval'* *}, {* *type: 'number',* *sourceColumn: 6,* *id: 'med-to-75th',* *role: 'interval'* *}, {* *type: 'number',* *sourceColumn: 5,* *id: '25th-to-med',* *role: 'interval'* *}, 7]);* *// Focus is the error bars, but boxes are visible in the background.* *var options_boxes_background = {* *title:'Background boxes',* *curveType:'function',* *lineWidth: 0,* *series: [{'color': '#1A8763'}],* *intervals: { 'lineWidth':2, 'barWidth': 0.5 },* *interval: {* *'25th-to-med': {* *'style':'boxes',* *'color':'grey',* *'boxWidth': 0.5,* *'lineWidth': 0,* *'fillOpacity': 0.4* *},* *'med-to-75th': {* *'style':'boxes',* *'color':'#ff',* *'boxWidth': 0.5,* *'lineWidth': 0,* *'fillOpacity': 0.4* *},* *'value': {* *'style':'points',* *'color':'black',* *'pointSize': 5,* *'lineWidth': 0,* *'fillOpacity': 0.8* *}* *},* *legend: 'none',* *};* *var dashboard = new google.visualization.Dashboard(document.querySelector('#dashboard'));* *dashboard.bind([control], [chart]);* *dashboard.draw(view, options_boxes_background);* *} * */script* * /head* * body* *div id=dashboard* * div id=control_div/div* * div id=chart_div/div* */div* * /body* */html* Many thanks for any help! Beat -- 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+unsubscr...@googlegroups.com. To post to this group, send email to google-visualization-api@googlegroups.com. Visit this group at http://groups.google.com/group/google-visualization-api. For more options, visit https://groups.google.com/d/optout.
Re: [visualization-api] Re: prevent negative axis
Well then I'm stumped. I don't see any reason why two otherwise identical charts would draw with different size chart areas if the only difference is the range of the data. I haven't been able to replicate that effect with any other chart. What do you do with chart1.data? Do you pass that directly to the chart, or do you use it to create a DataTable? For reference, you should create a DataTable to drive your charts instead of passing data arrays. On Saturday, May 17, 2014 4:00:37 AM UTC-4, Neil Camara wrote: If you look at the one of the codes that I posted earlier, I have a setting of height: 400 On Friday, May 16, 2014 5:55:10 PM UTC-5, Andrew Gallant wrote: I suspect the reason the height was changing is because you never defined the height of the chart. Try setting either the height option for the chart (it takes a number for the height in pixels, eg height: 400) or in the style/CSS of the container div. On Friday, May 16, 2014 6:11:34 PM UTC-4, Neil Camara wrote: Here is a sample json - https://gist.github.com/c0debreaker/3c8e64722fdac6505439 By the way, I wrote it in AngularJS. - This is how I call the function - $scope.bigstackedchart = plotStackedColumnChartTemplateForGoogleCharts($scope.jsonData, 'Total Bytes Used Aggregated by World (Received/Sent)', 'user_name', 'totalbytesent', 'totalbytesreceived' , 'totalbytes'); - and on the template, this is what is being targeted. divdiv google-chart chart=bigstackedchart/div/div By the way, it's been running great right after I added viewWindow. I've never seen anymore issue. Thanks! On Friday, May 16, 2014 2:18:32 PM UTC-5, Andrew Gallant wrote: What is the context that you call plotStackedColumnChartTemplateForGoogleCharts in? What do you do with the returned value? Can you provide an example of jsonData passed to the function? On Friday, May 16, 2014 3:27:58 AM UTC-4, Neil Camara wrote: Here is the code which contains the fix on line 71. I actually just added viewWindow : { min : 0 , max : 600 }, https://gist.github.com/c0debreaker/390245014dabf4e965d7 On Thursday, May 15, 2014 5:50:16 PM UTC-5, Andrew Gallant wrote: That may have fixed it, but I would consider that a temporary solution at best. If you could share code that replicates the issue, I'll look into it to see if I can figure out what is going on to cause it in the first place. On Thursday, May 15, 2014 4:24:07 PM UTC-4, Neil Camara wrote: Awesome! It's fixed! I set both min and max. Thank you so much! :) -- 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+unsubscr...@googlegroups.com. To post to this group, send email to google-visualization-api@googlegroups.com. Visit this group at http://groups.google.com/group/google-visualization-api. For more options, visit https://groups.google.com/d/optout.
[visualization-api] Re: How to assign chart formatting options to a dashboard with CategoryFilter?
Set the options on the chart, not the Dashboard: var chart = new google.visualization.ChartWrapper({ containerId: 'chart_div', chartType: 'LineChart', options: { title:'Background boxes', curveType:'function', lineWidth: 0, series: [{'color': '#1A8763'}], intervals: { 'lineWidth':2, 'barWidth': 0.5 }, interval: { '25th-to-med': { 'style':'boxes', 'color':'grey', 'boxWidth': 0.5, 'lineWidth': 0, 'fillOpacity': 0.4 }, 'med-to-75th': { 'style':'boxes', 'color':'#ff', 'boxWidth': 0.5, 'lineWidth': 0, 'fillOpacity': 0.4 }, 'value': { 'style':'points', 'color':'black', 'pointSize': 5, 'lineWidth': 0, 'fillOpacity': 0.8 } }, legend: 'none' } }); When you draw the dashboard, just pass the view: dashboard.draw(view); On Saturday, May 17, 2014 6:17:57 AM UTC-4, Beat Buehlmann wrote: Hi there, I want to create a chart with intervals and a category filter. I started without the category filter and was able to assign the format options with draw(view, options_boxes_background). I tried then to add a category filter by including the ControlWrapper and ChartWrapper and creating a dashboard. I learned that I can't include formatting options in dashboard.draw(...) as per below example. How can I assign the formatting options to the dashboard respectively to the chart? The code looks as follows: *html* * head* *script type='text/javascript' src='https://www.google.com/jsapi https://www.google.com/jsapi'/script* *script type='text/javascript'* *google.load('visualization', '1', {packages:['corechart', 'controls']});* *google.setOnLoadCallback(drawChart);* *function drawChart() {* *var data = new google.visualization.DataTable();* *data.addColumn('string', 'x');* *data.addColumn('number', 'values');* *data.addColumn({id:'min', type:'number', role:'interval'});* *data.addColumn({id:'max', type:'number', role:'interval'});* *data.addColumn({id:'25th', type:'number', role:'interval'});* *data.addColumn({id:'med', type:'number', role:'interval'});* *data.addColumn({id:'75th', type:'number', role:'interval'});* *data.addColumn({id:'value', type:'number', role:'interval'});* *data.addRows([* *['SP 500', 2.60, 1.40, 3.50, 2.20, 2.60, 2.80, 2.60],* *['Nikkei', 1.50, 0.90, 2.30, 1.30, 1.50, 1.80, 1.50],* *['MSCI Europe', 1.80, 1.10, 2.50, 1.60, 1.80, 2.20, 1.80],* *['MSCI Emerging Markets', 1.50, 1.00, 2.90, 1.50, 1.80, 2.00, 1.50]* *]);* * var control = new google.visualization.ControlWrapper({* *containerId: 'control_div',* *controlType: 'CategoryFilter',* *options: {* * filterColumnIndex: 0,* * }* * });* * var chart = new google.visualization.ChartWrapper({* *containerId: 'chart_div',* *chartType: 'LineChart' * * });* * var view = new google.visualization.DataView(data);* *view.setColumns([0, 1, 2, 3, {* *type: 'number',* *sourceColumn: 4,* *id: '25th-to-med',* *role: 'interval'* *}, {* *type: 'number',* *sourceColumn: 5,* *id: 'med-to-75th',* *role: 'interval'* *}, {* *type: 'number',* *sourceColumn: 6,* *id: 'med-to-75th',* *role: 'interval'* *}, {* *type: 'number',* *sourceColumn: 5,* *id: '25th-to-med',* *role: 'interval'* *}, 7]);* *// Focus is the error bars, but boxes are visible in the background.* *var options_boxes_background = {* *title:'Background boxes',* *curveType:'function',* *lineWidth: 0,* *series: [{'color': '#1A8763'}],* *intervals: { 'lineWidth':2, 'barWidth': 0.5 },* *interval: {* *'25th-to-med': {* *'style':'boxes',* *'color':'grey',* *'boxWidth': 0.5,* *'lineWidth': 0,* *'fillOpacity': 0.4* *},* *'med-to-75th': {* *'style':'boxes',* *'color':'#ff',* *'boxWidth': 0.5,* *'lineWidth': 0,* *'fillOpacity':
Re: [visualization-api] Re: Container height is zero. Expecting a valid height error when I add any chart to spread sheet on Google Drive
Only seen the issue on AnnotatedTimeLine - other charts I've tried have been OK. On Friday, May 16, 2014 1:22:16 PM UTC-4, Sergey wrote: I think you mean the Trend/Time Line chart, which is the AnnotatedTimeLine chart. Have you seen this issue with any of the other charts? On Fri May 16 2014 at 12:39:47 PM, gustin@gmail.com javascript: wrote: I'm seeing the same issue with the Trendline graph (flash-based interactive line graph). Oddly enough if I select Show Revisions the graph appears normally, but I still can't edit or delete it. On Friday, May 16, 2014 12:25:58 PM UTC-4, Sergey wrote: Hello everyone, I'm looking into this. So far, I have been able to reproduce this issue in docs with the AnnotatedTimeLine. Are there other charts that are affected? On Fri May 16 2014 at 11:57:03 AM, Peter Kull pjk...@gmail.com wrote: Same problem with my charts. On Thursday, May 15, 2014 2:58:40 AM UTC-4, Rehan Razi wrote: Container height is zero. Expecting a valid height error when I add any chart to spread sheet on Google Drive. I am not only facing this issue when I create a new document, previously working charts on spread sheets are also giving this error. This also does not allow to make any changes to charts. Attached is screen shot. -- 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+unsubscr...@googlegroups.com. To post to this group, send email to google-visua...@googlegroups.com. Visit this group at http://groups.google.com/ group/google-visualization-api. For more options, visit https://groups.google.com/d/optout. -- 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+unsubscr...@googlegroups.comjavascript: . To post to this group, send email to google-visua...@googlegroups.comjavascript: . Visit this group at http://groups.google.com/group/google-visualization-api. For more options, visit https://groups.google.com/d/optout. -- 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+unsubscr...@googlegroups.com. To post to this group, send email to google-visualization-api@googlegroups.com. Visit this group at http://groups.google.com/group/google-visualization-api. For more options, visit https://groups.google.com/d/optout.
Re: [visualization-api] Re: Is it not possible to animate a pie chart?
The engineer who'll be doing it is on vacation this coming week. Once he returns we'll figure out how easy this'll be to add and I'll let you know. Jon On Fri, May 16, 2014 at 12:57 PM, Mickey Kay mickeys...@gmail.com wrote: Any thoughts on the timeframe? I realize this is tough to estimate, but a ballpark idea would be helpful. Thanks! On Fri, May 16, 2014 at 9:01 AM, 'Jon Orwant' via Google Visualization API google-visualization-api@googlegroups.com wrote: We'll add animations to pie charts, but nothing's coming immediately. Sorry! Jon On Fri, May 16, 2014 at 11:58 AM, Mickey Kay mickeys...@gmail.comwrote: Man, that's kind of a deal-breaker on this one :( Is there any other way you can think of to mimic a progress circle like I linked to? I'd really like to use Google Charts, but if I can't achieve something like this then I'll have to switch to another library. On Fri, May 16, 2014 at 12:09 AM, Andrew Gallant asgallant...@gmail.com wrote: PieCharts do not support animations. On Friday, May 16, 2014 2:59:04 AM UTC-4, Mickey Kay wrote: I'd like to animate my pie/donut charts much like this: http://codepen.io/ahsanrathore/pen/yGBCd Is this possible? This page seems to suggest that animations are not supported for pie/donut charts: https://developers.google.com/chart/interactive/docs/ animation#Supported_Modifications -- You received this message because you are subscribed to a topic in the Google Groups Google Visualization API group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/google-visualization-api/FJAn4p8ALPU/unsubscribe . To unsubscribe from this group and all its topics, send an email to google-visualization-api+unsubscr...@googlegroups.com. To post to this group, send email to google-visualization-api@googlegroups.com. Visit this group at http://groups.google.com/group/google-visualization-api. For more options, visit https://groups.google.com/d/optout. -- 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+unsubscr...@googlegroups.com. To post to this group, send email to google-visualization-api@googlegroups.com. Visit this group at http://groups.google.com/group/google-visualization-api. For more options, visit https://groups.google.com/d/optout. -- You received this message because you are subscribed to a topic in the Google Groups Google Visualization API group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/google-visualization-api/FJAn4p8ALPU/unsubscribe . To unsubscribe from this group and all its topics, send an email to google-visualization-api+unsubscr...@googlegroups.com. To post to this group, send email to google-visualization-api@googlegroups.com. Visit this group at http://groups.google.com/group/google-visualization-api. For more options, visit https://groups.google.com/d/optout. -- 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+unsubscr...@googlegroups.com. To post to this group, send email to google-visualization-api@googlegroups.com. Visit this group at http://groups.google.com/group/google-visualization-api. For more options, visit https://groups.google.com/d/optout. -- 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+unsubscr...@googlegroups.com. To post to this group, send email to google-visualization-api@googlegroups.com. Visit this group at http://groups.google.com/group/google-visualization-api. For more options, visit https://groups.google.com/d/optout.