AzureでのChart(グラフィック）表示の方法

Question

はじめまして。AzureでのChart(グラフィック）表示の方法をさがしています。

現在わかっているのは、ＰＨＰ（extension=php_gd2.dllのオプション追加）では、グラフィックを自分で書くことはできることです（Azureでの動作はＵＰして確認済みです）。但し、chartの自力での実現は大変そうです。

iPadなどの、クロスプラットホームでのＷｅｂ表示を考えています。今、悩んでいるのはＡＳＰ．ＮＥＴ４のchartがクロスプラットホームで動くかの検証ができないことです。ＥＸＥ環境でのＡＳＰ．ＮＥＴ４の経験もなく、いきなり、Azureでchartを使おうというのが間違っていそうですが。

このあたりの経験のある方、情報があれば教えていただきたいのですが？よろしくお願い致します。

Answer 1

こんにちは。

ipad等のクロスプラットフォームを検討されるのであれば、asp.netで画面描画まで行うのではなく、WCFを使用してWeb APIの提供元としてAzureを使うのはいかがでしょうか？

ある程度クライアント側での実装に描画を任せてしまって、Azure側は元となるデータの提供元として動作させましょうという感じです。

 

自分はChartをやるためにクライアント側にSilverlightを使用して、SilverlightのChartコントロールを使用しましたが、単に描画させるだけでしたらすぐに実装できました。

ASP.net4のチャートコントロールは、時間がなかったということもありちょっとトラぶったので自分は挫折しました。

Answer 2

おはようございます。お返事ありがとうございます。

＞WCFを使用してWeb APIの提供元としてAzureを使うのはいかがでしょうか？　…　データ連携のサービス化は、機能の分離に有効と思います。　ただ、今回は、表示機能のプログラムをＷｅｂブラウザで複数作りたくないことでの調査なのです。

グラフィック関係では、最近、Unity 3d(http://unity3d.com/unity/)の話題がWeb上にＵＰされはじめていて、Ｗｅｂブラウザを選ばないプログラムの将来はここかと思ったりしています。（ゲーム開発環境ですが、ＭＡＣ　Ｗｉｎｄｏｕｓ　Ｗｉｉ　iPad XBox360 など、端末を選びません。米では、Unity 3dのプログラムの３割は、ビジネス系とのこと。日本語化も始まっているようです）

話はそれましたが、このような状況で、Azureの位置づけが、データ＆ビジネスロジックのサーバーとなっていれば、ＰＨＰでのプログラム作成を考えようと思っています。　現在、ＡｚｕｒｅのＷｅｂロールの機能がどこまでなのかが見えなくて困っているのです。

＞クライアント側にSilverlightを使用して　…　Azureは、日々進化しているようなので、期待しているのですが、iPadの出現で、MAC系のＷｅｂブラウザでの表示もできる動作環境が求められ始めています。　SilverlightはiPadで動かないと考えていますので（Mono プロジェクトがあるのは知っていますが、動作性能・日本語環境などであまり使われていないと思っています。）ASP.net4のチャートコントロールがサーバーサイドでイメージ処理しているかが知りたいのです。

＞ASP.net4のチャートコントロールは、時間がなかったということもありちょっとトラぶったので自分は挫折しました。　…　私も、何回かトライしていますが、うまくいきません。　Ａｚｕｒｅのサンプルプログラムに、使用例があればうれしいのですが、まだ見つかっていません。

マイクロソフトの担当者の方、お返事お願いします。

Answer 3

解決しました。　本件、解決するとは思いますが、保証をするものではありません。（約束事です）

以下に手順を、Chart コントロール使用方法の複写します。　おまじないが必要です。

手順
================
1. Windows Azure / Web Role プロジェクトを作成します。
2. Web Role プロジェクトの適当なページに Chart コントロールを配置します。
3. web.config を以下の通り変更します。
3.1 削除項目1
Chart コントロールを追加すると web.config 中に以下のアプリケーション設定が追加されます。

<appSettings>
<add key="ChartImageHandler" value="storage=file;timeout=20;dir=C:\TempImages\;"/>
</appSettings>

Windows Azure の場合、アプリケーションから特定のフォルダにアクセスすることはできません。
そのため、"dir=C:\TempImages\;" の記載を取り除きます。

<appSettings>
<add key="ChartImageHandler" value="storage=file;timeout=20;"/>
</appSettings>

3.2 追加項目2

web.config 中の <system.webServer> タグに以下のような <validation> タグを追加します。

<system.webServer>
<validation validateIntegratedModeConfiguration="false"/>
<handlers>
...
</system.webServer>

4. Chart コントロールのグラフの種類および系列の追加をします。
Chart コントロールを配置している ASPX ファイルのデザイン画面にて、コントロールの
右側に表示される ">" 印をクリックします。[グラフの種類] から Line を選択します。

Chart コントロールに複数の系列を追加したい場合には、Chart コントロールのプロパティから、
Series を選択し、"(コレクション)" の箇所に表示される [...] ボタンをクリックします。
表示される "Series コレクション エディター" から、表示するグラフの系列を追加できます。

追加した系列は、Series プロパティから、ChartType を Line にすることで、折れ線グラフを
指定することが可能です。

5. 各グラフの系列 (Series) をプログラム中で変更します。
各グラフの系列のアクセスは Chart1.Series[0] の形式でアクセスが可能です。
Chart コントロールに Chart1 という名前がついており、系列 0 番目のグラフに新しいポイントを
追加する場合には以下の方法で追加可能です。

　Chart1.Series[0].Points.AddXY(0, 100);

系列 1 番目のグラフの場合は Series のインデックス番号を変えることでアクセスができます。

　Chart1.Series[1].Points.AddXY(0, 100);

系列に保存されているデータをクリアしたい場合には、Clear メソッドが利用できます。

　Chart1.Series[0].Points.Clear();

ご参考
================
参考程度ではございますが、Chart コントロールに対してサンプルコードも用意しております。

　Samples Environment for .NET Framework 4 Chart Controls Released!
　http://code.msdn.microsoft.com/mschart

いくつかのチャートのサンプルがございますので、上記サンプルとともにこちらもご参考として
確認いただければ幸いです。

Chart コントロールの各メソッドについては、下記の MSDN ドキュメントに記載がございます。
必要に応じて、ご参照をいただければと存じます。

　.NET Framework クラス ライブラリ - Chart クラス
　http://msdn.microsoft.com/ja-jp/library/system.web.ui.datavisualization.charting.chart.aspx

※ Windows Azure で Chart コントロールを使う場合
.NET Framework 4 の利用とともに、Windows Azure はカスタマイズされた ASP.NET ホストアプリケーションで
動作しておりますため、上記手順の項目 3 (web.config の変更) が必要になります。

ご参考いただければ幸いでございます。

補足
================
サンプルは、本回答の説明の為の部分コードであり、弊社にてその動作を保証するものではございません。
ご使用の際には、御社システムに合わせて修正して頂き、十分なテストを実施して頂きます様お願い致します。
サンプル内で使用しておりますAPI などの詳細な情報に関しては、MSDN ドキュメントなどをご参照ください。