I have posted a new version of the “Charting for SharePoint using Google Visualization API” – v2.9.0. The changes are described here, but the background story and the code is found in original article. This post describes the new features in v2.9.0.
You should read the original post found here, the update for v2.8 posted here and the update for v2.8.5 posted here.
Changes from v2.8.5:
- Changed the behavior of “Average” to divide the grand total on the number of columns actually containing a value. This means any columns being blank or “null” will not be considered into the “total column count”. Thanks to Ayodele Ayodeji for pointing this out to me.
- Changed the “Chart option parser” to use eval on the Chart Options. YES i know it’s not the smartest thing to do, but as the Google Visualization API changes, my crude “option parser” failed to swallow some of the object literation formatted options.
- Added new chart types: Combo Chart and Candlestick Chart
- Added support for PatternFormat
- Pulled the variables: “showFilterInfo”, “showItemCount”, “itemCountPrefix”, “itemCountSuffix”, “labelIfEmpty”, introduced in v.2.8.5 in from the CEWP code and into the Chart configuration. This update should override the CEWP settings and these obsolete settings should not interfere.
- Added a few minor GUI tweaks like auto open the configuration for a newly added chart – no more “Table has no columns” error. Changed some of the error message. And a few other small fixes.
- Changed the solution to check for any missing columns in the configuration list and add them as needed. No more need to manually add columns to the configuration list when updating from a previous version!
- I have changed the code for the “save configuration function” as jQuery v1.6 introduced a new approach on DOM attributes and properties which affected the value returned by .attr(“checked”). This made saving “checked” checkboxes impossible when using jQuery v1.6.x.
NOTE: I have done one change in the way the formatters are targeted to a column. I originally went for a numbering of the columns starting with 1, but changed this to use 0 for the first column. This has to do with the columns being 0-indexed in the DataTable “behind the scenes” and this making things easier. To those of you using formatters now, you might end up with an error message, but it is just a matter of notching the “index” down by one.
If you use this solution, please consider donating a few dollars.
June 6, 2011 at 9:06 pm |
Thank you for the Combo Chart option! How would I utilize the series/seriesType option though? Thanks for the help.
June 7, 2011 at 12:11 am
Hi,
Take a look here
Alexander
June 7, 2011 at 3:47 am
Worked like a charm! Must have overlooked that example. Thanks again.
June 8, 2011 at 5:19 pm |
Alexander,
If we’re upgrading from a previous version, do we need to add any new columns?
Thanks,
DF
June 8, 2011 at 5:36 pm
Hi,
No more need to add columns manually. See point 7 in the list above.
Alexander
June 8, 2011 at 7:36 pm
Alex,
I swapped my old 2.85 for the new 2.9.1. Afterwards, I noticed a invalid parameter “ttletextstyle” error, one for each chart, and an invalid parameter “tooltipTextStyle”, one for every chart.
Are these options still supported?
Thanks!
June 8, 2011 at 7:48 pm
“Invalid character” was the error…
I was using:
titleTextStyle = {color:”black”,fontName:”Arial”,fontSize:24px}
tooltipTextStyle = {color:”black”,fontName:”Arial”,fontSize:14px}
Also, I’m using 2.9.1 with my pre-existing charts. Now it seems to take alot longer to load the charts. For example, the page is blank for 3~4 seconds, then all 6 pop up almost instantaneously.
Thanks!
June 8, 2011 at 11:33 pm
Hi,
Regarding the parameter error, the parameter “fontSize” must be written without the “px” like this:
{color:”black”,fontName:”Arial”,fontSize:24}
Regarding load speed i do not think i have done anything that could impact that in this update. If you could do a cross check with v2.8.5 it would be interesting.
Alexander
June 9, 2011 at 7:50 pm
Alex,
I removed the “px”, however the error occurs anyway…
Any other ideas?
BTW, I’m busy playing with the Combo Chart, and I’m really liking what you’ve done here. Keep up the good work!
DF
June 9, 2011 at 8:29 pm
Send me a screenshot of the configuration and the error message and i will take a look.
Alexander
June 9, 2011 at 9:21 pm
Done…
June 9, 2011 at 2:55 am |
After many hours wrestling with other options this has been a real lifesaver! In particular I am using the querystring variable filter for custom CAML and it worked fine in 2.8.5, but when I tried 2.9.1 I got a javascript error (in Firefox)
Error: showFilterInfo is not defined
Source File: [..]ChartUsingGoogleVisualizationAPI.js
Line: 689
Inserting “showFilterInfo = true;” before line 689 solves the problem, so it looks like there is something in the javascript that Firefox 4 does not like
June 9, 2011 at 8:26 am
Hi,
I have fixed this bug in v2.9.2. Thanks for noticing it.
Alexander
June 10, 2011 at 12:50 am |
Hi Alexander, amazing work!
I just wonder if possible to load the charts in async mode so the page does not freeze while the chart is loading (the users are mostly using MS-IE, on Mozilla no problem)
thanks
June 10, 2011 at 10:07 am
Hi,
The “freeze” most likely occurs when the data is being “chewed” by javascript in the browser. Doing the ajax-requst async *could* be possible and may do a little difference. I will look into that in future releases.
Alexander
June 10, 2011 at 10:10 pm |
Hi again, I’ve found something, but don’t know how to do it by myself…
https://www.nothingbutsharepoint.com/sites/eusp/Pages/SharePoint-2007-Automatically-Updating-Web-Parts.aspx
thanks
June 27, 2011 at 11:56 pm |
I am a big fan of the code you have developed here. During work for a client I encountered a need to serve the charts over HTTPS without the hassle of the mixed content warnings(Internet Explorer Only). After struggling over this for some time, I finally found a solution. Not only do you need a local copy of the jsapi file stored within your HTTPS environment, you also need to make changes to the jsapi code itself. To do this replace all instances of HTTP: within the jsapi code to HTTPS: . This can be done fairly easily using notepad and the replace all command. Now that the secure URLs have been added, you only need to save the file (and remove the .txt extension after) and upload the file and update your chart rendering jsapi code calls. Works like a charm!*
*One exception to this is the chart type “Map” which I believe needs to reference live data to be rendered accurately. Even with the changes this chart still prompts the mixed content warning. Please note this solution is only for IE.
Hope this helps!
June 28, 2011 at 12:29 am
Hi,
Though this might be a solution to your problem, it is not allowed due to the terms of use provided by Google
Try loading the api using:
Alexander
June 28, 2011 at 5:15 pm
My apologizes, I didn’t realize that the https source that google provided was actually a different version of the jsapi code. I figured it was just the same code served over an https connection. Storing a local copy of the code located at the google https location seems to work just fine, and removes the need to alter it. Is storing a local copy of the unaltered https jsapi google provides in conflict with the terms of use?
June 30, 2011 at 6:35 pm
Hi, Following the termes of use provided by Google, you are not allowed to download the API locally.
Alexander
June 28, 2011 at 3:28 pm |
HI Alexender – what you provided here is great. Our internal developers couldn’t touch what you’ve done here (i’m not a developer, just dabble a bit). One issue I seem to have is the charts not rendering in IE8 for me. Is there a setting or configuration I am missing? Works in Chrome and FF, but only the items are showing in IE8. Thanks
July 6, 2011 at 8:28 am
Hi,
Sorry for the late reply, This most likely has to do with the API itself and not the SharePoint integration.
Look here for Google’s discussion board
Alexander
July 6, 2011 at 2:41 am |
I have got this great tool working execpt i cannot get the numbers on the vertical axis
Anyone know whch option that turns this ‘on’
July 6, 2011 at 8:31 am
Hi,
If you mean to put the number on top of the columns, this is not supported in the Google Visualization API.
Alexander
July 6, 2011 at 6:54 pm |
Is there any way to Sort column chart in descending order?
July 6, 2011 at 11:19 pm
Hi,
Try using:
option: hAxis.direction
value: -1
Refer this documentation
Alexander
July 7, 2011 at 3:08 am |
Alexander no i mean show numbers on the gridlines for the vertical axis (same as Line chart examples shown)
July 7, 2011 at 8:36 am
Hi,
Send me a screenshot of the chart and the configuration. You find my email here
Alexander
July 14, 2011 at 12:22 am |
[...] JavaScripts JavaScript tricks for SharePoint « Charting for SharePoint using Google Visualization API: Update 05.06.2011 Pull on-call information from calendar [...]
July 14, 2011 at 8:34 am |
Hi,
Could countries in map views be links to list views (with the country as a filter)? The same could be applied in other views as well. This would allow kind of a ‘drill through’.
July 14, 2011 at 8:37 am |
How can I attach javascript functions to mouse overs etc?
August 3, 2011 at 3:10 pm
Hi,
I think this is possible using th Google Visualization API, but I have not implemented it here. I will add this to the wish-list for future releases.
Alexander
July 21, 2011 at 11:59 pm |
If you have some instructions on how to get the motion chart type to function I would appreciate it greatly. According to Google’s instructions the data types required are not allowed together in the GUI interface you show here. I am uncertain as to exactly which information goes where in the interface. Thank you so much for this tool. It has helped immensely.
August 3, 2011 at 3:30 pm
Hi,
I have added an example to this post
Alexander
August 11, 2011 at 6:19 pm |
Hi. I seem to have a problem with 2 things after migrating to SP2010. The Gauge chart does not function any more. It just shows blank in the space I would have had a guage showing.
Second, for Bar and Column and Pie charts, I can only define one color choice. Anything I put in after the first one is ignored. Such as ["blue","green","orange","purple"], only blue is shown.
Any help would be greatly appreciated. Thanks for all of the great work.
August 11, 2011 at 7:46 pm
Hi,
The gauge chart have some issues in IE, try compatibility mode.
Regarding the colors, do you have multiple series in the chart? The colors is for the individual series and not for each column in a “one series chart”.
Alexander
August 12, 2011 at 8:31 am
Hi,
The Google Chart Tools team has pushed a new release candidate today that will fix the Gauge issue. Anticipated production release date is August 17.
Alexander
August 24, 2011 at 4:30 am |
I’ve used this tool since 2.6. with great results. I uploaded 2.9.2 (since 2.9.3 hung up) and it renders just fine except for one annoying new issue.
In org chart, in addition to the root node container, an (empty) container above the root node container shows. This wasn’t the case in previous versions I’ve used. Ideas?
August 24, 2011 at 8:39 am
Hi,
I have made a little change to avoid this in future release, but until then you must clear the value in the text box: “Axis title if series title column is empty” in the chart configuration.
Alexander