Google charts

Forum to discuss the Web client version of Servoy.

Google charts

Postby udrescu_bogdan » Fri Jul 22, 2011 4:46 pm

Hi,

I'm trying to add the google charts in our solution. I manage to add before a javascript calendar and now it works pretty well. But now I just don't see what I'm doing wrong.

This is the code of my form. I have a HTML_AREA field bound to the html variable. I took the example from the google website. The funny thing is that I don't see the google script in the source page. I happens sometimes to be there, but then, the execution of the javascript from the onShow method stops at the google.load("visualization", "1", {"packages":["corechart"]});
Code: Select all
/**
* @properties={typeid:35,uuid:"BC264074-2947-4D37-89D6-3712A13157FE"}
*/
var html = "";

/**
* Callback method when form is (re)loaded.
*
* @param {JSEvent} event the event that triggered the action
*
* @properties={typeid:24,uuid:"79DFAD57-524C-43E9-B9CF-BBF9D65D44B5"}
*/
function onLoad(event) {

   html = ' \
<html> \
   <head> \
       <script src="https://www.google.com/jsapi" type="text/javascript" charset="utf-8"></script> \
   </head> \
\
   <body> \
      <div id="chart_div"></div> \
   </body> \
</html>';
}

/**
* Callback method for when form is shown.
*
* @param {Boolean} firstShow form is shown first time after load
* @param {JSEvent} event the event that triggered the action
*
* @properties={typeid:24,uuid:"43648DA7-8E98-4F46-BAF5-85749E5BBBDB"}
*/
function onShow(firstShow, event) {
   var js = ' \
      alert("Hi 1");\
      google.load("visualization", "1", {"packages":["corechart"]}); \
\
      alert("Hi 2");\
      google.setOnLoadCallback(function() { \
            \
            alert("Hi inside 1");\
            var data = new google.visualization.DataTable(); \
            data.addColumn("string", "Topping"); \
            data.addColumn("number", "Slices"); \
            data.addRows([ \
            ["Mushrooms", 3], \
            ["Onions", 1], \
            ["Olives", 1],  \
            ["Zucchini", 1], \
            ["Pepperoni", 2] \
            ]); \
\
            alert("Hi inside 2");\
            var chart = new google.visualization.PieChart(document.getElementById("chart_div")); \
            chart.draw(data, {width: 400, height: 240}); \
      }); \
\
      alert("Hi");\
';

   plugins.WebClientUtils.executeClientSideJS(js);
}

udrescu_bogdan
 
Posts: 336
Joined: Fri Jun 18, 2010 3:27 pm
Location: Craiova, Romania

Re: Google charts

Postby lvostinar » Mon Jul 25, 2011 4:32 pm

check for javascript errors (firefox, error console), use firebug to debug(see if something is created in that div)
Laurian Vostinar
Servoy
lvostinar
 
Posts: 1062
Joined: Tue Feb 19, 2008 10:53 am

Re: Google charts

Postby ptalbot » Mon Jul 25, 2011 10:56 pm

You can also use the VelocityReport which helps building charts in plain Servoy JavaScript (using Google Charts or Eastwood).
-my 2 cents ;)
Patrick Talbot
Freelance - Open Source - Servoy Valued Professional
https://www.servoyforge.net
Velocity rules! If you don't use it, you don't know what you're missing!
User avatar
ptalbot
 
Posts: 1654
Joined: Wed Mar 11, 2009 5:13 am
Location: Montreal, QC

Re: Google charts

Postby jcarlos » Tue Jul 26, 2011 12:13 am

ptalbot wrote:You can also use the VelocityReport which helps building charts in plain Servoy JavaScript (using Google Charts or Eastwood).
-my 2 cents ;)


You can get the VelocityReport from ServoyForge at:
https://www.servoyforge.net/projects/velocity-report

JC
jcarlos
 
Posts: 578
Joined: Thu May 04, 2006 8:55 pm
Location: Palo Alto, California USA


Return to Servoy Web Client

Who is online

Users browsing this forum: No registered users and 3 guests