Help with Labels on Bar Charts (Loop)

81 views
Skip to first unread message

Carmen S

unread,
Mar 23, 2012, 1:34:28 PM3/23/12
to google-visua...@googlegroups.com
Hello!

This is going to seem silly as I have a found a really roundabout way to achieve my goals already, I am wondering now if there is a simpler way.

I have created a set of charts for one of my projects using the Google Code Playground and essentially stapling solutions together from those sources.  I took the Data Resource Request example (data was stored in a spreadsheet already), and then attached it to the Image Bar Chart example as my PM wanted me to add labels to the end of Bar Charts.  I would then save the resulting image and drop them into the document that way.  It was not the most automated process and now it was eaten by the Google Gadget Editor...  I had saved my Frankenstein code in the Google Gadget Editor in iGoogle and it just deleted all of my XML files so I am trying to recreate what I did (however my looping logic is failing to return to me).

Example Chart:  

Is there any easier way to achieve this, is there a gadget that can be used?  Or even created?

Alternatively... The solution I did have is about 80% away from being completed (and attached to this post), I am just having a bear of a time with the looping part.  It is just really not clicking for whatever reason this time.  I know I'm close but the Google Code Playground Debugger and I are not friends and I cannot get it to cooperate with me to save my soul (I wish it would!).
looping.txt

asgallant

unread,
Mar 26, 2012, 1:21:48 PM3/26/12
to google-visua...@googlegroups.com
I'm not familiar with the Image Charts format, so I can't help much there, but if you could give some more detail about what you are trying to accomplish with the loop, I can probably help with that. 

I'm not sure why you are doing this, but it might be the cause of your problems:
var labelString = [suffix, color, index, allbars, fontSize];
...
labelString = labelString + '|' + [suffix, color, index, allbars, fontSize];

You are adding a string to an array and then adding another array, which in Javascript, gives you a string, not an array.  Ex:

var a = [0, 1, 2];
var b = [9, 8, 7];
var c = a + '|' + b; // => "1,2,3|9,8,7"

Maybe this is what you actually wanted, but the labelstring.join(',') call after the loop makes me think not.

Carmen S

unread,
Mar 26, 2012, 1:53:29 PM3/26/12
to google-visua...@googlegroups.com
Hello, thanks for the response!

The idea of the loop was to avoid manually putting in the suffix, color, index, allbars, fontSize over and over again to put a marker at the end of each bar.  If you do not put values for each index (data set) you will only get markers at the end of one bar, instead of all.  I had achieved this before and unfortunately google gadget editor ate the code so now I'm trying to remake it but drawing a blank.

So the intent is to have the loop basically build the "1,2,3|9,8,7" for you as it goes through each time, except that index (counting) is the only number changing, everything else stays the same.

The labelstring.join(',') outside of the loop is attaching the string/array we've just created to the options variable above in the code.  If you comment out the loop and just have the [suffixcolorindexallbarsfontSizejust assign to labelString as is with no fancy other stuff, it works, it's just when things start getting played with in the loop.  However due to only one index being accounted for, as you can see below, we only have one label.

asgallant

unread,
Mar 26, 2012, 2:12:25 PM3/26/12
to google-visua...@googlegroups.com
The Array#join method glues the array elements together with the given separator.  Since, at this point in time, labelstring is a string, and not an array, it does not have a join method.

I created a test script on jsfiddle (http://jsfiddle.net/3mYbp/) to try it out.  The first thing I notice is that the script throws errors because you commented out the line "var index = 0;", so index doesn't get initialized before you try to assign it as an array element.  If I un-comment out that line and remove the join call, then the chart draws (with the labels).  There are cleaner ways to accomplish the same thing, but your code basically works.

Carmen S

unread,
Mar 26, 2012, 2:29:58 PM3/26/12
to google-visua...@googlegroups.com
My apologies on that, I went on a commenting out frenzy as I started to back step myself as much as possible.

Thank you so much, of course it just had to be that one thing tripping me up..., but most importantly it's good to know why it wasn't working (array vs string) so I can address these issues in the future.

Hero of the day!
Reply all
Reply to author
Forward
0 new messages