Browse by Tags

All Tags » UI
Showing page 1 of 3 (69 total posts)
  • チャートと時間サイクル – Part 1

    原文 - Tim Brock - Charts and Cycles of Time - Part 1 チャートと時間サイクル - 前編 私たちの日々の生活はすべて時間に対する予測に依存しています。朝の準備にかかる時間を予測し、アラームを設定します。歩いているときは道路の反対側まで歩くにはどれぐらいの時間がかかるかを判断するとともに、近づいてくる車が横断地点に到達するまでの時間も考えます。このように、さまざまな場面が考えられます。 「道路を渡るのに車の半分の時間がかかる」など、予測は実際には相対的で、「朝の支度に 45 ...
    Posted to World Tech Talk in Japanese (Weblog) by Daizen Ikehara on October 20, 2016
  • ASP.NET Web API & AngularJS ステップバイステップ ガイド

    原文 - A Step-by-Step Guide to Working with the ASP.NET Web API and AngularJS このブログでは、AngularJS と ASP.NET Web API を使用する方法を手順に従ってご説明します。ここでは AngularJS および Web API の基礎知識が必要となります。以下を使用してハンズオン形式でデータベースからデータをフェッチし、AngularJS アプリケーションに表示します。 SQL Server のデータベース Entity Framework データベース - ファーストアプローチのデータ モデル ASP.NET の Web API アプリケーションに Web ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on August 30, 2016
  • AngularJS でルーティング(Routing) を簡単に行う方法

    原文 - Simplifying Routing in AngularJS 通常、AngularJS は複数のビューを持つシングル ページ アプリケーションの作成に使用されます。ただし、ルーティングを使用し AngularJS ベースのシングル ページ アプリケーションに複数のビューを作成することもできます。このブログではその方法を説明していきます。 ルーティングについて ルーティングは、アプリケーションを非同期に読み込まれる複数の論理ビューに分割できます。シングルページの製品アプリケーションを見てみましょう。以下のようにこの製品で実行するさまざまなタスクを個々の論理のビューに分けることができます。 製品を追加するビュー 製品を削除するビュー ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on August 28, 2016
  • AngularJS アプリケーションに依存性 (Dependency) を注入 (Injection) するさまざまな方法

    原文 - Different ways of injecting dependency in an AngularJS Application AngularJS の特徴について読まれた方は、依存性の注入 (Dependency Injection, DI) という用語をご存じだと思います。これはアプリケーションに必要となる依存関係が AngularJS に注入されるという前提によるものです。開発者としての仕事はモジュールに依存を渡すことだけです。その他すべては AngularJS が処理します。 コントローラーを作成するにはモジュールのコントローラー機能に $scope オブジェクトおよび他の依存を渡します。たとえば、ProductController の作成には $scope ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on August 24, 2016
  • Angular JS フォームでユーザー入力を検証

    原文 - Validating User Input on a Form in Angular JS AngularJS のシングルページアプリケーションでのユーザー入力の検証はエントリ レベルの開発者には少々難しいかもしれません。そこで、このブログでは AngularJS の検証について簡単にご説明します! 以下の例を見てみましょう。以下の制限がある 3 つのフィールドから構成された登録フォームです。 名前: 必須項目。 メール: 必須項目。メール アドレス。 パスワード: 必須項目。最小 6 文字のパスワード。 上記の条件をクライアント側で検証します。AngularJS ベースのシングル ページ ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on August 22, 2016
  • データセットの側面 - パート 2

    原文 - Aspects of Datasets - Part 2 このブログはデータセットのキーとなる側面について詳しく紹介するブログのパート 2 となります。前回、関連性、正確性、精度についてお話ししましたが、ここでは一貫性、完成度、そしてサイズについて考察していきます。 一貫性 1999 年 9 月 23 日、NASA のマーズ・クライメイト・オービターが火星大気に入った直後に燃え尽きてしまいました。この 1億 2 千 5 百ドルの過ちは、サテライトを制御するソフトウェアの 2 つの異なる部分で使用する単位の不一致が原因でした。 マーズ・クライメイト・オービターは、単位を混乱した例 (もう 1 つは "Gimli Glider") ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on August 21, 2016
  • Angular の “Controller as” 構文と vm 変数

    原文 - Exploring Angular’s “Controller as” Syntax and the vm Variable 「controller as syntax って何ですか?」あるいは「コントローラーの作成で $scope object アプローチとの違いは何ですか?」といった開発者の質問をよく耳にします。本ブログでは controller as syntax をご紹介し、$scope オブジェクトのコントローラー作成方法と比較していきます。 コントローラー コードの作成をより読みやすくする controller as syntax は AngularJS 1.2 で導入されました。ここでは 2 つの方法を実例で紹介します。 $scope object ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on August 18, 2016
  • スロープグラフへの入門 - 後編

    原文 - An Introduction to Slopegraphs - Part 2 前編では、スロープグラフを用いて時間的推移を表す方法について説明しました。G20 先進国のうち 13 か国の 1960 年と 2013 年の人口の推移をデータを例に説明しました。スロープグラフは、カテゴリー タイプの変数の差異を表すためにも用いられています。同じように、13 ヶ国の人口データを使用して、2012 年の平均寿命を示しています (スロープグラフは、R で作成しましたが Excel ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on August 17, 2016
  • データセットの側面 - パート 1

    原文 - Aspects of Datasets - Part 1 コンパイルするデータセットが自分のデータであるか他人のデータであるかに関わらず、データが目的に合わなかった場合、時間とお金を無駄にする可能性が非常に高くなります。このブログはシリーズ最初の記事です。パート 1 では、関連度、正確度、精度、パート 2 ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on August 16, 2016
  • ポイントを繋ぐ

    原文 - Connect the Dots 通常の散布図についてはすでにご存じだと思いますが、各 x 座標がある変数および各 y 座標が別の変数によって決定される、ポイントの選択です。以下は、その簡単な例です。1896 年アテネから 2012 年ロンドンで開催されたすべてのサマー オリンピック試合の総メダル数と 1 個以上のメダルを獲得した国の数です。データは Wikipedia のオリンピック メダル受賞数一覧 (1896 年オリンピック) の記事を基に作られています。 ご覧のとおり、メダル数とメダルを獲得した国の間の正の相関関係がわかります (ちなみに、相関係数は 0.95 ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on July 20, 2016
  • AngularJS の provider() とは?

    原文 - What is a Provider () in AngularJS? provider() 関数は、provider() によって作成されたサービスでアプリケーション固有の入力を設定する構成可能なサービスの作成を許可します。たとえば、アプリケーションレベルでサービスにアクセスするための API キーを設定する必要がある場合、キーを module.config に設定し、$provide サービスを使用して入力を provider に渡します。サービスを作成するその他の方法は内部に $provide サービスを使用します。 module.config で $provide サービスを使用したサービスの作成 provider() ...
    Posted to World Tech Talk in Japanese (Weblog) by Daizen Ikehara on July 19, 2016
  • AngularJS アプリケーションで Ignite UI チャートを使用する方法

    原文 - How to work with the Ignite UI Chart in an AngularJS application AngularJS アプリケーションで Ignite UI チャートを使用する方法を学びましょう!データベースからデータをプルするために ASP.NET Web API を使用しますが、AngularJS アプリケーションでは REST サービスや Ignite UI チャートのスタックで作成される Web API も使用できます。 このブログは 2 つのセクションで構成されています。 セクション 1 : コード ファースト アプローチで ASP.NET Web API を作成 セクション 2 : AngularJS ...
    Posted to World Tech Talk in Japanese (Weblog) by Daizen Ikehara on July 18, 2016
  • 注釈を使ったデータ可視化のテクニック

    原文: Tim Brock » How to Improve Your Data Visualizations with Annotations Merriam Webster は、注釈 をテキスト、本、描画などにコメントや説明を追加するためのメモであると定義しています。チャートの注釈は、追加情報、重要な点の強調、あるいは明確化を目的に使用されます。ただし、グラフィックスを注釈で埋めるのはデータそのものの視覚的特徴に対する注意を妨げる可能性があります。チャートタイトル、軸ラベル、軸タイトルが注釈ではなく構造的なコンポーネントである場合、多くのチャートに注釈は必要ないということになります。 構造的な要素と注釈の間の線をまたぐのは、線とマーカー ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on March 8, 2016
  • スロープグラフへの入門 - 前編

    原文: Tim Brock » An Introduction to Slopegraphs - Part 1 スロープグラフの起源を語る際に、一般的に Edward Tufte 氏の 「The Visual Display of Quantitative Information」 がまず取り上げられます。Tufte 氏は 159 ページ (第二版) に、チャート、あるいは「表グラフィックス」を新しく紹介しています。そこでは、「垂直方向に、1970 年、そして 1979 年に徴収された税金を 15 か国でランキングで表示しています。国名はその金額のパーセンテージに応じた間隔で配置されています」。 ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on March 1, 2016
  • ASP.NET MVC の ViewData、ViewBag および TempData

    原文:Dhananjay Kumar » What are ViewData, ViewBag, and TempData in ASP.NET MVC? ASP.NET MVC の ViewData、ViewBag および TempData の使い分けはエントリ レベルの開発者には難しい場合がよくあると思います。インターネット上には、このトピックに関する数多くの記事やブログ投稿がありますが、ここではわかりやすく説明してみようと思います。 ViewData、ViewBag および TempData の 3 つのオブジェクトは、状況によってデータを保持または渡すための ASP.NET MVC のオブジェクトです。以下場合にデータを渡すための要件があります: ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on February 25, 2016
  • データ密度に関する考察

    原文:Tim Brock » Some Thoughts on Data Density 以前、私のブログであるデータ可視化の 7 つのヒント を公開しましたが、そのブログで最初にご紹介した注意事項は、棒チャートを利用して「説明が十分に可能であればチャートは使用しない」というものでした。 ブログで述べたように、上記の棒チャートは、読者の理解を妨げずに、「製品 B を好む人はたった 112 人であるのに対し、237 人が製品 A を好むと回答しました。」などのシンプルな文で置き換えられます。 棒が 2 本だけの棒チャートをよく見かけますが、ポイントが 2 点しかない散布プロットはめったに見ることがありません。可能性の 1 ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on February 23, 2016
  • サンプル サイズに基づいたビジュアルの探究

    原文: Tim Brock » Visual Explorations of Sample Size 小さなサンプルに基づいて結果を導くと問題になる可能性が明らかに高いです。その一方でビッグ データが有名になることによって、組織が分析に実際どれぐらいのデータが必要かを論理的に考えるより、ランダムに可能な限りのデータを収集すようになるかどうかは疑問です。私はデータが足りないよりも必要なデータ量より少し多めのデータを使用する方を好みます。統計を使用してどれだけのデータが本当に必要なのかを判断できます。最近、サンプルサイズを増加させる効果をどのようにビジュアル化できるのかを考えてみました。 シンプルさを保持するために、正規分布の特定のインスタンスから random variates ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on February 16, 2016
  • ASP.NET Web API を使用して jQuery igGrid で CRUD 操作を実行する方法

    原文: Dhananjay Kumar - How to perform a CRUD operation on the jQuery igGrid with the ASP.NET Web API このブログでは、ASP.NET Web API を使用して igGrid に CRUD 操作を実行する方法をご紹介します。具体的に、以下の点を取り上げたいと考えています: Entity Framework Database First アプローチを使用した ASP.NET Web API の作成 jQuery アプリケーションの igGrid への CRUD 操作の実行 最終的に City エンティティの CRUD 操作のための Web API を作成し、CRUD 操作を ...
    Posted to World Tech Talk in Japanese (Weblog) by Daizen Ikehara on January 12, 2016
  • Firebase および jQuery で Azure ベースのリアルタイム チャット アプリケーションを作成する方法

    原文: Dhananjay Kumar - How to create an Azure-based real time Chat Application using Firebase and jQuery このブログでは、グループ チャットのようなグループ内で複数の人がいつでもメッセージを読んだり、送ったりしするチャットアプリケーションを作成する方法をわかりやすく説明します。今回は以下のテクノロジーを使用します: Firebase HTML Bootstrap jQuery アプリケーションを開発には Visual Studio IDE を使用し、Microsoft Azure ウェブサイトでホストします。 ここで作成するリアルタイムのチャット ...
    Posted to World Tech Talk in Japanese (Weblog) by Daizen Ikehara on January 5, 2016
  • 折れ線 チャート: どこから始めるか?

    原文: Tim Brock - Line Charts: Where to Start? 棒チャートの棒が 0 から始まることの重要さを以前のブログでご説明しました。その理由は簡単です。値を比べる際に相対的な長さの棒を使用するからです。そのため棒を 0 から始めると誤った判断を招きます。一方、折れ線チャートはどうでしょうか。 以下は A、B および C の 3 つのデータセットの折れ線チャートです。これらのチャートから判断できることは: すべての年にわたって各線が 0 以上です; A は大体フラットです; B は 1980 年代の急上昇以外は下向きです; C は上向きです; 上記 1 番目の項目以外は y 軸が 0 ...
    Posted to World Tech Talk in Japanese (Weblog) by Daizen Ikehara on December 21, 2015
  • ビッグ データ: オーバープロットの対処

    原文 - Tim Brock - Too Big Data: Coping with Overplotting 散布プロットは 2 変量データの (明白な) 関係を簡単に示すことができます。テーブルで大きいデータブロックの見えにくいパターンやクラスターが、すぐにページや画面でよく見えるようになります。最近はビッグ データが誇大宣伝されているため、多量のデータを持つことに利点があると考えるのは当然でしょう。ただし、散布プロットにデータポイントを追加すればする程、そのパターンとクラスターが見えにくくなります。この問題は、以下のアニメーションのようなオーバープロットが原因です。 上記のアニメーションのデータは、一組のシンプルな 2 ...
    Posted to World Tech Talk in Japanese (Weblog) by Daizen Ikehara on December 8, 2015
  • ASP.NET MVC およびエンティティ フレームワークで AngularJS を使用する方法

    原文: Dhananjay Kumar - How to use AngularJS in ASP.NET MVC and Entity Framework 最近、AngularJS と ASP.NET MVC がとても人気のようです。このブログではそれぞれの長所を生かしながら ASP.NET MVC で AngularJS を使用する方法をご説明します。また、最初のアプローチとしてエンティティ フレームワーク データベースでデータへアクセスする方法をご説明します。更に AngularJS でデータへアクセスし、コントローラーでビューへ渡す方法もご紹介します。このブログは以下のテーマに基づいて進めます: ASP.NET MVC に AngularJS ライブラリを追加 ...
    Posted to World Tech Talk in Japanese (Weblog) by Daizen Ikehara on November 24, 2015
  • AngularJS を使用してコントローラー間でデータを共有する方法

    原文: Dhananjay Kumar - How to share data between controllers in AngularJS 私の AngularJS 講義でよく聞かれる質問は「AngularJS ではどのようにコントローラー間でデータを共有できますか?」というものです。インターネット上で数多くの答えが見つかりますが、私が推奨する方法は本ブログで説明する Shared Data Service メソッドです。 はじめにコントローラー間で Product オブジェクトを共有するとしましょう。以下のコード スニペットは SharedDataService という AngularJS サービスを示します。 ...
    Posted to World Tech Talk in Japanese (Weblog) by Daizen Ikehara on November 17, 2015
  • 棒チャートとドットプロットの比較

    原文 - Tim Brock - Bar Charts versus Dot Plots 棒チャートを領域または角度調整が必要となるチャート形式と比べた場合、棒チャートには明白な利点があります。これは棒チャートを理解するために必要となるシンプルな知覚タスクを人間が得意とするためです。ただし、ドットプロットでもスケールにある位置を判断してデータを読み取ることができます。ではどちらを選んだらよいのでしょうか。 実際のデータセットを使用しているドットプロットと棒チャートを作成してみましょう。データは、世界保健機関 (WHO) の各国の平均寿命です。1990年、2000年、2012年の各年の出生時における男女を合わせた平均寿命を表します。データは一番近い年に反映しています。 1990 年から ...
    Posted to World Tech Talk in Japanese (Weblog) by Daizen Ikehara on November 11, 2015
  • DataVis における慣例の役割

    原文 - Tim Brock - The Role of Convention in Dataviz 「サイエンスと知覚についての研究が効果的な可視化にいかに貢献できるか」ということが私の関心事であることを私の他のブログを読まれた方はご存じだと思います。読み手はすばやく重要なパターンを見出し、誤った加工データによって判断を誤ることはありません。ただし、だからといって可視化のデザインで完全に知覚に依存すべきではありません。外見上は恣意的な慣例を忘れてはいけません。以下の例を見てみましょう。 時間の慣例 ...
    Posted to World Tech Talk in Japanese (Weblog) by Daizen Ikehara on September 29, 2015
1 2 3 Next >
Powered by Community Server (Commercial Edition), by Telligent Systems