Browse by Tags

All Tags » チャート
  • UltraChart 折れ線グラフの色を指定する

    UltraChart ではグラフに自動的に色を切り替えて配色するようになっていますが、状況に応じて配色を変更したい状況があります。ここでは UltraChart の折れ線グラフ(合成チャート)の色を指定する方法をご紹介します。 実装方法 各折れ線グラフ(NumericSeries)の PaintElement コレクション(PEs)に、色情報を加えます。 C# //シリーズの生成 NumericSeries lineSeries1 = this.GetSeriesABound(''Series A''); // ラインの色指定 lineSeries1.PEs.Add(new PaintElement(Color.FromArgb(116, 70, ...
    Posted to Yuki Mita (Weblog) by ymita on February 14, 2017
  • UltraChart null を非表示にする方法

    年度別のウェブサイトアクセス数をラインチャートで表示するアプリケーションを考えてみましょう。緑のラインが 2016 年、青のラインが 2017 年の実績を示しています。   データは DataTable 形式で、月ごとのアクセス数を保持しています。 C# DataTable dt = new DataTable(); dt.Columns.Add(''月'', typeof(string)); dt.Columns.Add(''2016 年'', typeof(decimal)); dt.Columns.Add(''2017 年'', typeof(decimal)); dt.Rows.Add(''1 月'', 30000, ...
    Posted to Yuki Mita (Weblog) by ymita on February 13, 2017
  • XamDataChart のデータ値をドラッグアンドドロップして変更する

    この記事では弊社のドラッグアンドドロップフレームワークとシリーズのマーカーを利用し、 ドラッグアンドドロップでマーカーの位置を動かしてグラフの値を変更することができるチャートの実装をご紹介いたします。   ■実装 まずデザイン画面で XamDataChart を追加します。 また、ドラッグアンドドロップフレームワーク利用のため必要な dll を参照追加します。   チャート部分の xaml は下記の様になります。 <ig:XamDataChart Name=''xdc1''> <ig:DragDropManager.DropTarget> ...
    Posted to Hyung Kim (Weblog) by hkim on December 1, 2016
  • igDataChart 積層グラフ(DataChartModel)

    igDataChart の積層型シリーズを用いたグラフを作成します。ここでは DataChartModel を利用して、Controller 側で igDataChart を生成していきます。 DataChartModel で生成したオブジェクトは、クライアントに JavaScript として返されます。このため JavaScript の代わりに C# や VB.NET を利用して実装することができます。   データモデル public class CarData { public int Year { get; set; } public int BMW { get; set; } public int Audi { get; ...
    Posted to Yuki Mita (Weblog) by ymita on November 10, 2016
  • igDataChart - 条件によるスタイリングの変更

    棒グラフに表示されているデータのうち、特定の条件にあるデータポイントの色を変えてみます。 ここでは売上データのうち、売上が一定値を下回るデータポイントに赤色を配色することで、 初見でも注目すべきデータが強調されます。 手順 1.assigningCategoryStyle イベント発生の有効化 assigningCategoryStyle イベント内でスタイリングのロジックを実装しますが、デフォルトでは assigningCategoryStyle イベントは発生しないようになっています。isCustomCategoryStyleAllowed オプションに true を設定してこのイベントが発生するようにします。 series: [ { ...
    Posted to Yuki Mita (Weblog) by ymita on July 11, 2016
  • xamDataGrid と xamDataChart で簡易 BI アプリケーションを作る

    先日の記事では xamDataGrid にテンプレート列を作成する方法を紹介致しました。この記事で利用した xamDataGrid に、xamDataChart を加えて簡易な BI アプリケーションを作ってみます。 xamDataChart の定義 <ig:XamDataChart Name=''xamDataChart1'' Title=''Personal Score''> <ig:XamDataChart.Axes> <ig:CategoryXAxis x:Name=''xmXAxis'' ItemsSource=''{Binding Path=., ...
    Posted to Yuki Mita (Weblog) by ymita on August 14, 2014
  • Ignite UI igDataChart のデータバインドとデータフォーマット

    Ignite UI で提供しているチャートコントロール、igDataChart を取り上げます。今回はデータのバインド方法や軸の設定など基本的なプロパティの利用方法と、よくお問い合わせのある X 軸のフォーマット、更にツールチップのカスタマイズ方法をご紹介します。 1.データバインド 1-1.データの準備 まずはバインドするデータを用意します。jQuery でよく利用される JSON 形式データに monthlyAccess と accessDate という2つのメンバを用意します。 var data = [ { ''monthlyAccess'':900, ''accessDate'': new Date(2014, 05, 01) }, { ...
    Posted to Yuki Mita (Weblog) by ymita on May 19, 2014
  • [jQuery]+[ASP.NET MVC] Chart + Grid の Excel出力

    以前、[ASP.NET]チャート+グリッドのExcel出力という記事を書きましたが、今回はそれの jQuery 版を書きます。弊社では Ignite UI という jQuery コントロールが提供しておりますが、今回はそれにMVCヘルパーを使ってチャートとグリッドを1ページ内に表示し、サーバ処理でそのチャート画像とグリッドの内容を Excel 出力する方法をご紹介します。   概要 本ポストでは、Ignite UIの基本的な使用方法やチャートとグリッドの表示方法についての詳しい説明は割愛させていただき、以下の点にフォーカスしたいと思います。 ・チャート(Canvasタグ)の画像化とサーバへの送信 ・グリッドの Excel ...
    Posted to Satoru Yamaguchi - 山口 慧 (Weblog) by Satoru Yamaguchi on April 15, 2014
  • [ASP.NET] チャート + グリッドのExcel出力

    上の図のような「チャート+グリッド」といった画面構成はよくあるパターンかと思いますが、本ポストではこの「チャート+グリッド」をこのイメージのままエクセルへ出力する方法について書きたいと思います。 この「チャート+グリッド」イメージは弊社コントロールの UltraChart と WebDataGrid を利用していますが、それぞれの実装方法については割愛させていただきます。※実装コードを確認したい方は 添付サンプル をご参照下さいませ。 [各コントロールのオンラインサンプル] WebDataGrid: ...
    Posted to Satoru Yamaguchi - 山口 慧 (Weblog) by Satoru Yamaguchi on January 17, 2014
  • CTP情報その1 / NetAdvantage Silverlight 2010 Data Visualization (CTP)

    つい先日、NetAdvantage Silverlight for Data Visualization 2009 Volume.2 のリリース情報をブログしたばかりの気もするのですが、はやくも次バージョンのCTPの準備ができてしまいました(笑) 今回のCTPには、NetAdvantageのSilverlightコントロールの両方のラインナップ、つまり NetAdvantage Silverlight LOB と NetAdvantage Silverlight for Data Visualization ...
    Posted to Tatsuya Yamada's blog (Weblog) by Tatsuya Yamada on December 14, 2009
Powered by Community Server (Commercial Edition), by Telligent Systems