The result getBoundingBox is roughly the same as calling getBoundingBox on the SVG element. The chart.getBoundingBox() call is the result of what is rendered given the width/height you pass in. In theory, it shouldn't be rendering things outside of the chart area, but there are reasonable cases of this. For example, if you draw a LineChart with a lot of data, but set the view window to show a small part of it, the getBoundingBox call might return a much larger bounding box than what is actually visible, because there are elements that are clipped; either by the SVG element itself, or by a clip path.
What you are seeing does look like some sort of error or bug, but without any way to reproduce it, I'm not sure we can do anything about it. What device is this failing on? That would be immensely helpful. On Thu Oct 23 2014 at 3:05:30 PM Gladyston Agra França <[email protected]> wrote: > I had only experienced this issue on a specific device, unfortunately it > is the target device, (on galaxy x it runs fine). I think without debugging > on that device investigation will be difficult, so could you please just > clarify what is the relationship between options' width and height and width > and height coming from this function: chart.getBoundingBox() > I am asking that because in galaxy x(webview) and desktop browsers those > values match(width and height). But on the target device width from > getBoundingBox is a bit higher. > > Is that possible framework is laying out chart based on getBoundingBox > values and cropping chart based on options values? This could explain the > scenario i am facing. > > Hi Andrew, > > I already tested manipulating chartArea options. It seems my problem is > not related to those settings :) > > Em quinta-feira, 23 de outubro de 2014 10h59min04s UTC-3, Sergey > Grabkovsky escreveu: >> >> Hm. I've had no luck reproducing your issue on a Nexus 7. I've seen these >> types of issues occur when people draw into a div that is not visible when >> the chart is drawn. Is it possible that the div is hidden when you draw the >> chart? It looks like you're just using a WebView for the chart, which makes >> it a bit more difficult for me to reproduce your issue. Can you reproduce >> the issue with Chrome? Preferably in your plnkr example? >> >> On Thu Oct 23 2014 at 8:57:32 AM 'Andrew Gallant' via Google Chart API < >> [email protected]> wrote: >> > You can override the default dimensions of the chart area (where the bars >>> are drawn), which determines the space left for the axis labels, by setting >>> the chartArea.height/width/top/left options. These options can either >>> be numbers (pixels) or strings (percents of the total relevant outer >>> dimension). To make room for the axis labels, you could move the chart >>> area up and shrink it, like this: >>> >>> chartArea: { >>> top: 20, >>> height: '70%' >>> } >>> >>> You'll need to fiddle with the values to get something that works for >>> you. You can also use the left and width options under chartArea to make >>> more room for the legend labels. >>> >> >>> On Wed, Oct 22, 2014 at 6:11 PM, Gladyston Agra França < >>> [email protected]> wrote: >>> >>>> I think maybe looking an image of the chart could shade some light. >>>> >>>> chart print image <http://s29.postimg.org/rol0c3zp3/chart_print.png> >>>> >>>> >>>> 1. The chart's parent div is drawn in blue. >>>> 2. Chart background color is gray >>>> >>>> So in theory chart size (options.width and options.height) is smaller >>>> than the available size (div size is 40 px large and taller ) >>>> It is ok if after laying out the chart the remaining space if not >>>> enoght to render the label, it should be truncated (those 3 dots). My >>>> complain is about >>>> the cropped area, the initial part of the string is being cropped. >>>> The question is, why not just truncate a little more in order to >>>> prevent string being cropped. >>>> >>>> Att. >>>> Gladyston >>>> >>>> >>>> >>>> >>>> >>>> >>>> Em quarta-feira, 22 de outubro de 2014 14h19min55s UTC-3, Sergey >>>> Grabkovsky escreveu: >>>>> >>>>> What you probably want is to change the size of the chartArea, not the >>>>> chart itself, to leave enough room for the labels. The chart layout >>>>> interface will not report the size of the div, it will report the bounding >>>>> size of the elements in the chart, which may be different than the size of >>>>> the div. >>>>> On Wed Oct 22 2014 at 1:02:54 PM Gladyston Agra França < >>>>> [email protected]> wrote: >>>>> >>>>>> Just adding, >>>>>> >>>>>> My check to see if height i had set was changed or not is done using >>>>>> this code: >>>>>> >>>>>> >>>>>> >>>>>> var cli = chart.getChartLayoutInterface(); >>>>>> var chartSize = cli.getBoundingBox('chart'); >>>>>> >>>>>> console.log("configured chart height: "+SCREEN_HEIGHT); >>>>>> console.log("current chart height: "+chartSize.height); >>>>>> >>>>>> >>>>>> >>>>>> Chart bounding box should not match size set on options variable? If >>>>>> it should not, is that a problem with margin or something else. And more >>>>>> important, Is there a way to set those values? >>>>>> >>>>>> About div stuff: >>>>>> I am setting the div to the exact size (width and height) that i am >>>>>> setting the chart options. (Even when i set div with a size larger than >>>>>> the >>>>>> one set to chart options cropping still occurs) >>>>>> >>>>>> Just one heads up, testint same code (java and html) it runs fine in >>>>>> a different device (same dpi but different manufacturer and android >>>>>> version: 4.0.1) >>>>>> >>>>>> Thanks for your time anyway :) >>>>>> >>>>>> >>>>>> Em quarta-feira, 22 de outubro de 2014 10h57min45s UTC-3, Sergey >>>>>> Grabkovsky escreveu: >>>>>>> >>>>>>> Ok, so I'm a little confused about your question. You said in your >>>>>>> previous message that options.height is being "changed by the >>>>>>> framework." I >>>>>>> took that to mean that you were reading the value from options and it >>>>>>> wasn't what you originally stored in, like so: >>>>>>> options.height = 5; >>>>>>> chart.draw(data, options); >>>>>>> console.log(options.height); // I thought this would print out >>>>>>> something other than 5. >>>>>>> >>>>>>> However, it occurs to me now that you may have meant that Google >>>>>>> Charts isn't setting the div to be your expected size, which may very >>>>>>> well >>>>>>> be the case. Especially, since you're giving the chart multiple signals >>>>>>> of >>>>>>> what its size should be. You're both setting options.width/height to >>>>>>> something, and you're setting your div size to some number. Generally, >>>>>>> the >>>>>>> style attribute should have a unit attached to it, as just the number is >>>>>>> ambiguous (i.e. you should be doing div.style.height = >>>>>>> window.innerHeight + >>>>>>> 'px'). >>>>>>> >>>>>>> Furthermore, since different browsers may have different display >>>>>>> defaults (especially for different devices), they may either have >>>>>>> different >>>>>>> units or different default margins. >>>>>>> >>>>>>> Another thing that may be occurring is that the chart may think that >>>>>>> it doesn't have enough space to fully render, and so it would be >>>>>>> clipped. >>>>>>> You may try to fix this by setting the chartArea size such that it >>>>>>> leaves >>>>>>> enough room for the labels. In the absence of other information, charts >>>>>>> attempt to lay themselves out to have some balance, and optimize for the >>>>>>> presentation of data. This means that when the chart doesn't have a lot >>>>>>> of >>>>>>> room to render, it will truncate labels. Unfortunately, we don't have an >>>>>>> option to say "never truncate" or "prioritize labels". You may file a >>>>>>> feature request, but it is unlikely that we will be changing the >>>>>>> implementation for the layout of these charts. >>>>>>> >>>>>>> On Tue Oct 21 2014 at 6:03:11 PM Gladyston Agra França < >>>>>>> [email protected]> wrote: >>>>>>> >>>>>>>> Hi Sergey, >>>>>>>> >>>>>>>> Sorry about the lack of information, should had post my setup. >>>>>>>> >>>>>>>> I am running google chart on a mobile device (android 4.4.4). >>>>>>>> >>>>>>>> following jsfiddle runs ok on desktop but presents the behavior i >>>>>>>> described when running on device. >>>>>>>> >>>>>>>> chart sample <http://plnkr.co/edit/VC5fFqS3mdbmegdI1wRt?p=preview> >>>>>>>> >>>>>>>> >>>>>>>> I am not taking in account webview stuff, as i think it should not >>>>>>>> influence the value set in options variable. >>>>>>>> >>>>>>>> Is it possible android client is being dowloading a different >>>>>>>> library than the desktop client? >>>>>>>> >>>>>>>> >>>>>>>> Em terça-feira, 21 de outubro de 2014 16h17min29s UTC-3, Sergey >>>>>>>> Grabkovsky escreveu: >>>>>>>>> >>>>>>>>> Hi Gladyston, charts should not be modifying their options >>>>>>>>> structure. In fact, one of the first things we do in our code is copy >>>>>>>>> the >>>>>>>>> options object so that we may have our own copy. To answer your >>>>>>>>> question, >>>>>>>>> no this is not a known issue, and I'm very surprised it's happening. >>>>>>>>> However, before we decide that it is in fact a bug, could you please >>>>>>>>> let us >>>>>>>>> know which chart you are attempting to use and if at all possible, >>>>>>>>> either >>>>>>>>> provide a link to this happening in the wild, or create a jsfiddle >>>>>>>>> that >>>>>>>>> demonstrates the problem. It is very important for us to be able to >>>>>>>>> reproduce the reported issues. >>>>>>>>> >>>>>>>>> Thanks, >>>>>>>>> - Sergey >>>>>>>>> >>>>>>>>> On Tue Oct 21 2014 at 3:06:26 PM Gladyston Agra França < >>>>>>>>> [email protected]> wrote: >>>>>>>>> >>>>>>>> Hi guys, >>>>>>>>>> >>>>>>>>>> About the issue, it is not a truncating problem. The beginning of >>>>>>>>>> the string is just being erased (slanted text in X axis), >>>>>>>>>> It could be related to the fact that the "options.height" value >>>>>>>>>> is being changed internally by the framework. >>>>>>>>>> I am setting the chart values for width and height via options >>>>>>>>>> parameter. But after chart is drawn if i query the options.height >>>>>>>>>> value, >>>>>>>>>> it is a bit larger than the value I had set. It seems like the >>>>>>>>>> chart layout is calculated using the new higher options.height but >>>>>>>>>> it is >>>>>>>>>> drawn using the options.height i had set, so the >>>>>>>>>> label is just cropped. >>>>>>>>>> Is it a known issue? >>>>>>>>>> >>>>>>>>>> >>>>>>>>>> >>>>>>>>>> >>>>>>>>>> >>>>>>>>>> >>>>>>>>>> >>>>>>>>>> >>>>>>>>>> -- >>>>>>>>>> You received this message because you are subscribed to the >>>>>>>>>> Google Groups "Google Chart 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-chart-api. >>>>>>>>>> For more options, visit https://groups.google.com/d/optout. >>>>>>>>>> >>>>>>>>> -- >>>>>>>> You received this message because you are subscribed to the Google >>>>>>>> Groups "Google Chart 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-chart-api >>>>>>>> . >>>>>>>> For more options, visit https://groups.google.com/d/optout. >>>>>>>> >>>>>>> -- >>>>>> You received this message because you are subscribed to the Google >>>>>> Groups "Google Chart 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-chart-api. >>>>>> For more options, visit https://groups.google.com/d/optout. >>>>>> >>>>> -- >>>> You received this message because you are subscribed to the Google >>>> Groups "Google Chart 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-chart-api. >>>> For more options, visit https://groups.google.com/d/optout. >>>> >>> >>> -- >>> You received this message because you are subscribed to the Google >>> Groups "Google Chart 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-chart-api. >>> For more options, visit https://groups.google.com/d/optout. >>> >> -- > You received this message because you are subscribed to the Google Groups > "Google Chart 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-chart-api. > For more options, visit https://groups.google.com/d/optout. > -- You received this message because you are subscribed to the Google Groups "Google Chart 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-chart-api. For more options, visit https://groups.google.com/d/optout.
