Android グラフチャートライブラリ - Essence Chart(ｴｯｾﾝｽ ﾁｬｰﾄ)ライブラリの始め方

アプリを開発する際に、格好いいグラフやチャートを入れてみるのはいかかですか？

Android Essence Chart(ｴｯｾﾝｽ ﾁｬｰﾄ) ライブラリを使うと2D/3Dのグラフやチャートを簡単に作ることができます。

この文書は Essence Chart(ｴｯｾﾝｽ ﾁｬｰﾄ) というライブラリを始めて使う開発者が分かりやすく学べるように作成されたガイドです。

Essence Chart(ｴｯｾﾝｽ ﾁｬｰﾄ)の特徴は以下となります。

• Essence Chart ライブラリは様々なグラフやチャートをサポートしています.　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　サポートするグラフやチャートの種類は Essence Chart がサポートするグラフの種類 にて確認できます.
• Essence Chart ライブラリはファイルサイズが小さいです。
• Android用 ライブラリの場合、ファイルサイズは3MB位です。
• Essence Chart ライブラリは様々なOSを対応しております。
  現在 Android向けのみ提供しておりますが、今後、Window向け, iOS向けも提供する予定です。.
• Essence Chart ライブラリは無料で使えます.
  Essence Chart ライブラリのライセンスは Essence Chart(ｴｯｾﾝｽ ﾁｬｰﾄ) ライセンスにて 確認できます.

エッセンスチャートを始めるためには必ず Essence Chart SDKをインストールしなければなりません。
インストールは Essence Chart(エッセンスチャート) SDK インストールにて確認できます.

Android 始めよう – 1段階(Chartの生成)

Essence Chart ライブラはAndroidで使えるJAR(Java Archive)を提供します。
Androidで楽で簡単にChartを生成することができます。
現在、Androidでは以下のようにサポートされております。

• ·         SDKをインストールするプログラム
  ·         AndroidのJARファイルを提供
  ·         サポート Device : armebai-v7, armebai(armebaiは今後サポートされる予定)
  ·         SDK Demo APP 提供(Google Playに登録される予定)
  ·         Min SDK Version : Android 2.3.3(API 10)
  ·         動作が確認できた Device
  o    サムスン GALAXY S2(Android 4.1.2, Jelly bean)
  o    サムスン GALAXY S3(Android 4.1.2, Jelly bean)
  o    サムスン GALAXY Note 10.1(Android 4.1.2, Jelly bean)
  o    LGエレクトロニクス Optimus G pro (Android 4.1.2, Jelly bean)
  o    グーグル Nexus7(Android 4.2.2, Jelly bean)
  o    グーグル Nexus10(Android 4.2.2, Jelly bean)
  ·         一部のDeviceで正常に動作できない場合があります。
  o    現在armebai-v7のみサポートできます。
  o    Android OSのパージョンによって上手く起動できない場合があります。
  ·         お問い合わせはブログへコメントを残すことでお願いします。
  
  Androidを始める前に次の項目をご確認してください。
  ·         Eclipseのインストールを確認
  o    Eclipse Classic 3.7.2で始めようが作成されております。
  o    他のパージョン(上位バージョン)で開発するのもできますが、この文書は3.7.2を基準として説明されてますので、メニューや項目が異なる場合があります。
  o    Eclipse Classic 3.7.2のダウンロードはこちら
  o    Eclipseのインストールに関してはネット上にあるEclipseインストールしようなどのページをご参照してください。.
  ·         Android SDKのインストールを確認
  o    Androidを始めようはAndroidのSDKがインストールされていないと進めることができません。
  o    Androidの開発者のサイトでダウンロードできます。
  o    Android SDKに関してはネット上にあるAndroid SDKインストール関連サイトをご参照してインストールしてください。
  ·         Essence Chart のインストールを確認
  o    Androidを始めようはEssence Chart SDKがインストールされていないと進めることができません。
  o    Essence Chart(エッセンスチャート) SDKのインストール をご参照してインストールを確認してください。.
  
  下記のイメージで表記されたバージョンはアップデートによりバージョンが異なる場合があります。

Androidアプリを生成する

eclipse.exeを実行してEclipseを起動します。



File –> New –> Other を選択します。


Android –> Android Application Projectを選択し“Next” ボタンを押します。


Application Name, Project Name, Package Nameを入力します。
Minimum Required SDK 項目は API 9: Android 2.3(Gingerbread)を選択します。
Target SDK, Compile With, Themeは状況に合わせて選択します。
“Next” ボタンを押します。



Create custom launcher icon, Create activity, Create Project in Workspace項目にチェックをかける.
”Next” ボタンを押します。


アイコンのイメージの情報を設定する。.
”Next” ボタンを押します。


Create ActiveにチェックをかけBlankActivityを選択する。
”Next” ボタンを押します。


Activeity Name, Layout Name 項目の毎に値を入力する。
(始めようではデフォールト値を使うので、もし他の値を使うと項目名が異なる場合があります。)
”Finish”を押します.

Essence ChartのSDKをコピー

インストールしたEssence Chart SDKのフォルダでJARファイルlibraryフォルダをコピーする。

Windowsエクスプローラを実行し、 Essence Chart SDKフォルダへ移動する。
デフォルトインストールパスは以下になります。

·         Window 32bit : C:\Program Files\Essence Chart SDK\sdk\android

·         Window 64bit : C:\Program Files (x86)\Essence Chart SDK\sdk\android

“armebai-v7a” フォルダと“essence.chart.0.7.6.jar” ファイルをコピーする。 

コピーしたファイルをEclipseのChart Projcetのlibsというフォルダにコピーする。


コピーが終わったら、 libs ファルダに“armebai-v7a” ファルダと“essence.chart.0.7.6.jar” ファイルが子ぷーされたことを確認する。
 

Layoutにchartを追加する

Eclipse에서 res/layout/activity_main.xmlファイルを選択する。
(activity_main.xmlはProjcetを生成する時に指定したファイルである)


activeity_main.xmlのactivity_main.xmlのタブを選択する。
(Graphical Layoutの隣にあるactivity_main.xmlタブを選択)


TextViewの項目を次のように変更する。

変更の前		変更の後
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"     xmlns:tools="http://schemas.android.com/tools"     android:layout_width="match_parent"     android:layout_height="match_parent"     tools:context=".MainActivity" >     <TextView         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:layout_centerHorizontal="true"         android:layout_centerVertical="true"         android:text="@string/hello_world" /> </RelativeLayout>		<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"     xmlns:tools="http://schemas.android.com/tools"     android:layout_width="match_parent"     android:layout_height="match_parent"     tools:context=".MainActivity" >     <com.essence.chart.Chart         android:id="@+id/chart01"         android:layout_width="wrap_content"         android:layout_height="wrap_content" /> </RelativeLayout>

修正した内容を保存する。
メニューのProject->Cleanを押下し、Clean all projectsを選択する。

Chartのアプリを実行

保存されたProjectを実行し、Chartが正常的に生成が完了されたのか確認する。

EclipseのtoolbarのRunボタンを押します。
Run Asの窓が立ち上がると“Android Application”を選択後、“OK”ボタンを選択する。


正常的にビルドされたら Android Device Chooserが表示されます。.
Android Device Chooserで望むDeviceを選択し、“OK” ボタンを押します。

正常的に実行されたら Deviceに下記のようなChartアプリが実行されます。

·         サムスン GALAXYS2

• サムスン GALAXY Note 10.1

• Google Nexus7