Gwt-highcharts-environment-setup
GWTハイチャート-環境設定
このチュートリアルでは、HighchartsとGWT Frameworkで作業を開始するための開発環境を準備する方法について説明します。 このチュートリアルでは、GWT Frameworkをセットアップする前に、マシンでJDK、Tomcat、Eclipseをセットアップする方法も説明します-
システム要件
GWTはJDK 1.6以降を必要とするため、最初の要件はJDKをマシンにインストールすることです。
JDK | 1.6 or above. |
Memory | no minimum requirement. |
Disk Space | no minimum requirement. |
Operating System | no minimum requirement. |
所定の手順に従って環境をセットアップし、GWTアプリケーション開発を開始します。
ステップ1-マシンでのJavaインストールの検証
コンソールを開き、次のjavaコマンドを実行します。
OS | Task | Command |
---|---|---|
Windows | Open Command Console | c:\> java -version |
Linux | Open Command Terminal | $ java -version |
*Mac * | Open Terminal | machine:~ joseph$ java -version |
すべてのオペレーティングシステムの出力を確認しましょう
Sr.No. | OS & Generated Output |
---|---|
1 |
Javaバージョン "1.6.0_21" Java(TM)SEランタイム環境(ビルド1.6.0_21-b07) Java HotSpot(TM)Client VM(ビルド17.0-b17、混合モード、共有) |
2 |
Linux Javaバージョン "1.6.0_21" Java(TM)SEランタイム環境(ビルド1.6.0_21-b07) ava HotSpot(TM)Client VM(ビルド17.0-b17、混合モード、共有) |
3 |
Mac Javaバージョン "1.6.0_21" Java(TM)SEランタイム環境(ビルド1.6.0_21-b07) Java HotSpot(TM)64ビットサーバーVM(ビルド17.0-b17、混合モード、共有) |
ステップ2-Java Development Kit(JDK)のセットアップ
Javaがインストールされていない場合は、OracleのJavaサイト(https://www.oracle.com/technetwork/java/javase/downloads/indexl[Java SEダウンロード])からJavaソフトウェア開発キット(SDK)をインストールできます。 ダウンロードしたファイルにJDKをインストールする手順があります。指定された手順に従ってセットアップをインストールおよび構成します。 最後に、PATHおよびJAVA_HOME環境変数を設定して、javaおよびjavacを含むディレクトリ(通常はそれぞれjava_install_dir/binおよびjava_install_dir)を参照します。
*JAVA_HOME* 環境変数を設定して、Javaがマシンにインストールされているベースディレクトリの場所を指すようにします。 例えば
Sr.No. | OS & Output |
---|---|
1 |
Windows 環境変数JAVA_HOMEをC:\ Program Files \ Java \ jdk1.6.0_21に設定します |
2 |
Linux export JAVA_HOME =/usr/local/java-current |
3 |
Mac export JAVA_HOME =/Library/Java/Home |
Javaコンパイラの場所をシステムパスに追加します。
Sr.No. | OS & Output |
---|---|
1 |
Windows 文字列;%JAVA_HOME%\ binをシステム変数Pathの最後に追加します。 |
2 |
Linux export PATH = $ PATH:$ JAVA_HOME/bin/ |
3 |
Mac 不要 |
または、Borland JBuilder、Eclipse、IntelliJ IDEA、Sun ONE Studioなどの統合開発環境(IDE)を使用する場合は、単純なプログラムをコンパイルおよび実行して、IDEがJavaをインストールした場所を認識していることを確認します。 IDEの。
ステップ3-Eclipse IDEのセットアップ
このチュートリアルのすべての例は、Eclipse IDEを使用して作成されています。 そのため、オペレーティングシステムに基づいて、最新バージョンのEclipseをマシンにインストールすることをお勧めします。
Eclipse IDEをインストールするには、https://www.eclipse.org/downloads/から最新のEclipseバイナリをダウンロードします。 インストールをダウンロードしたら、バイナリ配布物を便利な場所に解凍します。 たとえば、WindowsのC:\ eclipse、またはLinux/Unixの/usr/local/eclipseで、最後にPATH変数を適切に設定します。
Eclipseは、Windowsマシンで次のコマンドを実行することで起動できます。または、eclipse.exeをダブルクリックするだけで起動できます
%C:\eclipse\eclipse.exe
Eclipseは、Unix(Solaris、Linuxなど)マシンで次のコマンドを実行することで起動できます-
$/usr/local/eclipse/eclipse
正常に起動した後、すべてが正常であれば、次の結果が表示されます-
ステップ4:GWT SDKとEclipse用プラグインをインストールする
リンクhttps://developers.google.com/web-toolkit/download[Plugin for Eclipse(incl。 SDK)]]を選択して、マシンにインストールされているGWT SDKおよびプラグインfor Eclipseバージョンをインストールします。
GWTプラグインのセットアップが正常に完了した後、すべてが正常であれば、以下に示すように赤い四角形でマークされた* Googleアイコン*で次の画面を表示する必要があります-
ステップ5:Highchartsをインストールする
http://www.moxiegroup.com/moxieapps/gwt-highcharts/download.jsp [ダウンロード]ページから最新のHighcharts jarをダウンロードし、プロジェクトのクラスパスに追加します。
<project-name> .gwt.xmlファイルに次のエントリを追加します
<inherits name="org.moxieapps.gwt.highcharts.Highcharts"/>
<project-name> lファイルに次のエントリを追加します
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"/>
<script src = "https://code.highcharts.com/highcharts.js"/>
<script type="text/javascript" src="https://code.highcharts.com/highcharts-3d.js"/>
<script type="text/javascript" src="https://code.highcharts.com/highcharts-more.js"/>
<script src = "https://code.highcharts.com/modules/heatmap.js"/>
<script src = "https://code.highcharts.com/modules/treemap.js"/>