SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

ComponentZine(ComponentOne)

データを直線ゲージで表示するASP.NET アプリケーションの作成

「LinearGauge for ASP.NET Wijmo」のC1LinearGaugeコントロールを使ったアプリケーションの作成

  • X ポスト
  • このエントリーをはてなブックマークに追加

 「LinearGauge for ASP.NET Wijmo」のC1LinearGaugeコントロールを使って、スライダコントロールまたは数値入力コントロールで入力したデータを直線ゲージで表示するWebページを作成してみます。

  • X ポスト
  • このエントリーをはてなブックマークに追加

はじめに

 データをどうやって視覚化するのか、Webページをデザインする際はいつも悩んでしまいます。例えばデータによっては、ある範囲の中でどの位置にデータがあるのか、という形で表示したい場合があるかもしれません。

 「LinearGauge for ASP.NET Wijmo」(ComponentOne Studio for ASP.NET Wijmo 2012J)のC1LinearGaugeコントロールは、データの範囲と現在の値を直線ゲージで表示する機能を提供するコントロールです。

 値の変化に合わせてポインタと呼ばれる"針"が動き、範囲の中で現在の値がどこにあるのかが一目で分かるようになっています。

 今回は、スライダコントロールおよび数値入力コントロールと組み合わせ、データを直線ゲージで表示するWebページを作成してみました。

スライダを動かすと、ゲージの針がゆっくりと動作するアニメーションで移動する。
スライダを動かすと、ゲージの針がゆっくりと動作するアニメーションで移動する。
数値入力ボックスに数値を入力すると、ゲージの針が終点でバウンドするアニメーションで移動する。
数値入力ボックスに数値を入力すると、ゲージの針が終点でバウンドするアニメーションで移動する。

対象読者

 Visual Basic 2010、またはVisual C# 2010を使ってプログラムを作ったことがある人。

必要な環境

 Visual Basic 2010、Visual C# 2010、Visual Studio 2010でプログラムが作れる環境。

 対応ブラウザについては、グレープシティ社Webサイトの「クロスブラウザ対応」ページでご確認ください。

 なお、本プログラムは次の環境で開発・動作確認を行っています。

  • OS: Windows 7
  • 開発Tool: Visual Studio 2010、.NET Framework 4
  • ブラウザ: Microsoft Internet Explorer 9

サンプルプログラム実行時の注意事項

[1] Visual StudioでサンプルWebサイトを開く

 Visual Studioをお持ちであれば、「ComponentOne Studio for ASP.NET Wijmo 2012J」トライアル版をインストールし、ソースコード圧縮ファイル「LinearGauge_ASP_vb_src.zip」または「LinearGauge_ASP_cs_src.zip」を解凍すると作成されるプロジェクトファイルを、Visual Studioで開き実行してください。

[2] Visual Studioを使わずにサンプルWebサイトを開く

 Visual Studioを使わずに、サンプルWebサイトを直接IISなどのWebサーバで開く場合は、ソースコード圧縮ファイル「LinearGauge_ASP_vb_src.zip」または「LinearGauge_ASP_cs_src.zip」を解凍すると作成されるプロジェクトファイルを、フォルダ構成を変えずにWebサーバにインストール・登録してください。

 以下は、Microsoft IISサーバにインストールする場合の手順です。

  1. プロジェクトファイルのフォルダを、そのままWebサーバーへ配置します(例:「\Inetpub\wwwroot」直下へ配置)。
  2. サーバーに配置したアプリケーションフォルダに対して、「アプリケーションへの変換」を実行します。
  3. 「アプリケーションの追加」ダイアログで、「アプリケーションプール」を「Classic .NET AppPool」に設定します。
  4. クライアントのWebブラウザで、Default.aspxファイルを開きます(例:「http://localhost/mysplit_vb/Default.aspx」)。
注意事項

 Windows Vistaで製品のサンプルをコンパイルしようとするとエラーが発生する場合があります。これは、Windows VistaのUAC(ユーザーアカウント制御)により、製品サンプルがインストールされているフォルダに書き込みができないため、コンパイル時にエラーが発生するという現象です。Visual Studioを管理者権限で実行するか、サンプルプロジェクト一式をアクセス権のあるフォルダに移動してからコンパイルを行うようにしてください。 また、Webブラウザでaspxファイルを実行する際にIISサーバでエラーになる場合は、Web.configファイルに以下の1行を追加してください。

 <identity impersonate="false" />

次のページ
コンポーネントのインストール

この記事は参考になりましたか?

  • X ポスト
  • このエントリーをはてなブックマークに追加
ComponentZine(ComponentOne)連載記事一覧

もっと読む

この記事の著者

瀬戸 遥(セト ハルカ)

8ビットコンピュータの時代からBASICを使い、C言語を独習で学びWindows 3.1のフリーソフトを作成、NiftyServeのフォーラムなどで配布。Excel VBAとVisual Basic関連の解説書を中心に現在まで40冊以上の書籍を出版。近著に、「ExcelユーザーのためのAccess再...

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

この記事は参考になりましたか?

この記事をシェア

  • X ポスト
  • このエントリーをはてなブックマークに追加
CodeZine(コードジン)
https://codezine.jp/article/detail/7052 2013/03/21 14:00

おすすめ

アクセスランキング

アクセスランキング

イベント

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー

アクセスランキング

アクセスランキング