GWT Highcharts / Discussion / General Discussion: Probleme with HighCHarts

Adil - 2012-07-19

hello ,

i tried to add a chart to TabSet , but i get this error :

com.google.gwt.core.client.JavaScriptException: (TypeError): $wnd.Highcharts is undefined

please some one have an idea how to fix this ??

thanks

If you would like to refer to this comment somewhere else in this project, copy and paste the following link:

rob walker - 2012-07-19

That sounds pretty fundamental. Are you sure you've included the necessary JS libs in your HTML page and added the modules to your .gwt.xml?

If you would like to refer to this comment somewhere else in this project, copy and paste the following link:

Adil - 2012-07-19

yeah i add the JS libs in Html and also in XML file ...but i don't know why it's not working

If you would like to refer to this comment somewhere else in this project, copy and paste the following link:

Shawn Quinn - 2012-07-19

Yeah, that looks like the "highcharts.js" file hasn't been included in your main page. Note that both highcharts.js (or highstock.js) as well as some DOM wrapper (e.g. jquery) are required to be included in your page in order for Highcharts (and GWT Highcharts) to work. More details here:

http://www.moxiegroup.com/moxieapps/gwt-highcharts/userguide.jsp#installation

Keep us posted on how it goes.

If you would like to refer to this comment somewhere else in this project, copy and paste the following link:

hello ,

i add the "script" to my Html page , but i still have the same problem.

this is my code of HTML file :

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="/js/highcharts.js"></script>

And my code of onModuleLoad

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.RootPanel;
import com.smartgwt.client.widgets.Canvas;
import com.smartgwt.client.widgets.tab.TabSet;
import com.smartgwt.client.widgets.tab.Tab;
import com.project.com.client.ui.DrawCharts;

public class MonitoringApplication implements EntryPoint {

public void onModuleLoad() {

    TabSet tabSet = new TabSet();
    tabSet.setSize("1124px", "782px");
    Tab Cpu = new Tab("Cpu");
    TabSet CpuChart = new TabSet();
    Tab CpuIdle = new Tab("CpuIdle");
    DrawCharts  dc = new DrawCharts();
    Canvas wind= new Canvas();
    wind.setHeight("323px");
    wind.setTitle("CpuIdleWindow");
    CpuIdle.setPane(wind);
    wind.addChild(dc.getChart());
    CpuChart.addTab(CpuIdle);

    Tab CpuSystem = new Tab("CpuSystem");
    CpuChart.addTab(CpuSystem);
    Tab CpuUser = new Tab("CpuUser");

    CpuChart.addTab(CpuUser);
    Cpu.setPane(CpuChart);
    tabSet.addTab(Cpu);

    Tab MemoryRam = new Tab("MemoryRam");
    tabSet.addTab(MemoryRam);

    Tab DisqueUsage = new Tab("DisqueUsage");
    tabSet.addTab(DisqueUsage);
    RootPanel.get().add(tabSet);
}

}

Last edit: Adil 2012-07-20

Adil - 2012-07-20

and as Warning i get this :

[WARN] 404 - GET /js/highcharts.js (127.0.0.1) 1402 bytes
Request headers
Host: 127.0.0.1:8888
Connection: keep-alive
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/536.11 (KHTML, like Gecko) Chrome/20.0.1132.57 Safari/536.11
Accept: /
Referer: http://127.0.0.1:8888/MonitoringApplication.html?gwt.codesvr=127.0.0.1:9997
Accept-Encoding: gzip,deflate,sdch
Accept-Language: fr-FR,fr;q=0.8,en-US;q=0.6,en;q=0.4
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.3
Response headers
Content-Type: text/html; charset=iso-8859-1
Content-Length: 1402

If you would like to refer to this comment somewhere else in this project, copy and paste the following link:

Shawn Quinn - 2012-07-20

Looks like you haven't included the "highcharts.js" file in your application. Here's a simple sample of how your HTML file should roughly look:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title>TestGWT Application</title> </head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"> </script> <script type="text/javascript" src="js/highcharts.js"></script> <script type="text/javascript" language="javascript" src="org.moxieapps.gwt.highcharts.test.GWTTest/org.moxieapps.gwt.highcharts.test.GWTTest.nocache.js"></script> <body> <div id="container" style="height: 500px"></div> </body> </html>

But, in order for that to work you'll need to have first unzipped the Highcharts library distribution into your application's "/js" folder. You can get the Highcharts library from either of the following locations:

http://www.moxiegroup.com/moxieapps/gwt-highcharts/download.jsp

http://www.highcharts.com/download
If you would like to refer to this comment somewhere else in this project, copy and paste the following link:

Adil - 2012-07-23

thanks you Shawn , i did all that you told me , but it's not working ..i'm disappointed

best regards

If you would like to refer to this comment somewhere else in this project, copy and paste the following link:

Adil - 2012-07-24

i add the Highcharts library to the "WAR" folder , and i now did not have the message of " .Highcharts is undefined " , but now i have an other message Error that is :

om.google.gwt.core.client.JavaScriptException: (TypeError): Cannot call method 'create' of undefined

Any assistance would be greatly appreciated!
thanks

If you would like to refer to this comment somewhere else in this project, copy and paste the following link:

Adil - 2012-07-24

Ok , it's working now i was working with SmartGWT 2.4 and when i move to SmartGWT 3.0 it works very well .

thanks god

If you would like to refer to this comment somewhere else in this project, copy and paste the following link:

Shawn Quinn - 2012-07-25

Glad you're up and running! In case others run across this thread, note that we use SmartGWT 2.4 and GWT Highcharts together here with success. But, I'm looking forward to giving SmartGWT 3.0 a try.

If you would like to refer to this comment somewhere else in this project, copy and paste the following link:

Adil - 2012-07-25

thanks Shawn for your reply . i still have a small problem with the chart that i drew .

when I pass the mouse over the chart that I draw, it gives me this Error :

Uncaught JavaScript exception [Uncaught TypeError: Cannot read property 'undefined' of undefined] in http://127.0.0.1:8888/js/highcharts.js, line 183

please , do you have an idea wy i'm getting this strange error !!!
is there a forum for SmartGWT 3.0 ?

thanks
best regards

If you would like to refer to this comment somewhere else in this project, copy and paste the following link:

dely - 2012-08-01

Just want to add that I also ran into this error when hovering the mouse over a series. Seems like the error is coming from the tooltipFormatter function. Works fine with highcharts 2.1.9 but getting the error with v2.2.0 and later. The function used to take in a boolean as a parameter, but now takes a pointFormat. Tested with both gwt-highcharts 1.1.3 and 1.4.0.

If you would like to refer to this comment somewhere else in this project, copy and paste the following link:

Probleme with HighCHarts

Forums

Help

Probleme with HighCHarts

this is my code of HTML file :

Probleme with HighCHarts

Forums

Help

Probleme with HighCHarts document.SUBSCRIPTION_OPTIONS = { "thing": "topic", "subscribed": false, "url": "subscribe", "icon": { "css": "fa fa-envelope-o" } };

this is my code of HTML file :

Probleme with HighCHarts