次の方法で共有

JavaScript および C++ での Windows ストア アプリ (Bing Maps Trip Optimizer) の開発

  • [アーティクル]

ドキュメントのこの部分の記事では、JavaScript および Visual C++ を使用して、Bing マップ トリップ オプティマイザーという名前の Windows ストア アプリを作成する方法について説明します。 ウェブサイトとは異なり、JavaScript を使用する Windows ストア アプリは Web サーバーからページごとには配置されません。 代わりに、ユーザーによってコンピューターにインストールされます。 他の Windows アプリと同様、JavaScript の Windows ストア アプリは、基になるプラットフォームに直接アクセスでき、その他のアプリと情報を共有できます。

JavaScript の Windows ストア アプリで C++ を使用して、コンピューターの機能を十分に発揮できます。 Bing マップ トリップ オプティマイザーは、JavaScript を使用して Windows ランタイム C++ コンポーネントの UI と並列パターン ライブラリ (PPL) を定義し、使用できるすべての CPU で負荷の大きいアルゴリズムを並列に計算して全体的なパフォーマンスを向上させます。 また、C++ Accelerated Massive Parallelism (C++ AMP) などのライブラリを使用して、グラフィックス処理装置 (GPU) で負荷の大きい計算を実行することもできます。

注意

Bing マップ トリップ オプティマイザー ソース コードの Windows ストア バージョンをダウンロードするには、「Bing Maps trip optimizer sample (Bing マップ トリップ オプティマイザー サンプル)」を参照してください。

Bing マップ トリップ オプティマイザーのアプリケーションは、バックグラウンド操作を実行するために UI と C++ ActiveX コントロールを定義する HTML および JavaScript を使用した既存のコードに基づいています。 ドキュメントのこの部分では、アプリの ActiveX バージョンをどのように Windows ストア アプリに移行したか、また既存の JavaScript および ActiveX コードを Windows ストア アプリ コードに移行したときの考慮事項についても取り上げています。 ソース コードの ActiveX バージョンをダウンロードするには、「Bing Maps Trip Optimizer (Bing マップ トリップ オプティマイザー)」を参照してください。

ヒント

Bing マップ トリップ オプティマイザーの ActiveX バージョンを Windows ストア アプリに変換したとき、JavaScript および C++ を引き続き使用しました。ただし、このアプリケーションをゼロから作成する場合は、他の言語を使用することもできます。たとえば、XAML を使用して、ルートの計算を実行するために UI と .NET Framework を定義できます。アプリのために適切な言語とテクノロジを選択する方法の詳細については、「Windows ストア アプリの紹介」を参照してください。

また、JavaScript および .NET Framework を使用する混合言語アプリを作成することもできます。この種類のアプリケーションの詳細については、「C++ および Visual Basic での Windows ランタイム コンポーネントの作成」を参照してください。

Bing マップ トリップ オプティマイザーのデザイン パターンは、JavaScript および C++ を使用して Windows ストア アプリを作成するベスト プラクティスと言えますが、ご自分の作業方法や開発中のアプリの特徴に応じて実装の詳細を調整できます。 たとえば、アプリの C++ 部分は、IXMLHTTPRequest2 インターフェイスを使用して HTTP 要求を処理します。 この同じパターンをアプリケーションで使用することができます。 Bing マップ トリップ オプティマイザーの実装でアプリケーション開発の成功に不可欠な部分がある場合は、このドキュメントでそのことを強調します。

この記事の内容

  • Bing マップ トリップ オプティマイザーの紹介

  • 必要条件

  • このドキュメントの対象読者

  • このドキュメントの内容

  • このドキュメントで扱われていない内容

  • 次の手順

  • 関連記事

Bing マップ トリップ オプティマイザーの紹介

Bing マップ トリップ オプティマイザーは、いくつかの場所について最短の道順を計算します (この古典的な計算問題は、巡回セールスマン問題としても知られます)。 巡回セールスマンの問題は、従来、片っ端から試す方法を使用して解決されていました。つまり、すべての実行可能なルートの距離を計算し、最短の道順を選択します。 この問題は、場所の数を増やすと指数関数的に難しくなります。 力づくの計算では大きな問題を適度な時間内に解決することができないため、Bing マップ トリップ オプティマイザーでは、アリの巣の最適化アルゴリズムというテクニックを使用して最短ルートをすばやく効率的に計算するようにしています。

Bing マップ トリップ オプティマイザーの UI は、HTML および JavaScript で記述されています。 UI は、ユーザーから場所を収集し、Bing マップ AJAX コントロールのすべての場所で近道を表示します。 最短ルートの計算と、Bing マップ Representational State Transfer (REST) API とのやり取りは C++ で記述されています。 言語間のスムーズな相互運用性は、各言語の優れた機能を 1 つのアプリケーションに統合できるため、Windows ランタイム では重要です。 Bing マップ トリップ オプティマイザーの場合、HTML および JavaScript は UI を定義し、C++ はより負荷の高い計算を実行します。

Bing Maps トリップ オプティマイザー

多くの Windows ストア アプリでは、モバイル デバイスのバッテリを長持ちさせるために暗い色の表示テーマを使っていますが、ここでは Bing マップ ウェブサイトにマッチする明るい色の表示を使っています。 明るい色のテーマを使うことによって、アプリの Windows ストア バージョンと ActiveX バージョンとの違いを容易に比較することができます。

注意

Bing マップ トリップ オプティマイザーの主な目的は、JavaScript と C++ の間で相互運用する方法を示すことです。また、Windows ストア アプリで使用するために既存のコードを改変する方法についても考慮します。そのため、優れた Windows ストア アプリに欠かせないユーザー エクスペリエンス (UX) ガイドラインに UI がすべて合致しているとは限りません。Web サイトを進化させて優れたユーザー エクスペリエンスを提供する方法については、「Design case study: Website to Windows Store app (デザイン ケース スタディ: ウェブサイトから Windows ストア アプリへ)」参照してください。

[このページのトップへ]

必要条件

Windows ストア アプリで JavaScript を使用する方法については、「Windows ストア アプリの開発 (JavaScript)」を参照してください。 ここでは、JavaScript で完全かつ基本的な Windows ストア アプリを作成するための手順が示されています。

JavaScript Web アプリと、Windows ランタイム用に記述された JavaScript Windows ストア アプリとの相違点の詳細については、「JavaScript を使った Windows ストア アプリと従来の Web アプリ」を参照してください。

[このページのトップへ]

このドキュメントの対象読者

このサンプルとドキュメントは、JavaScript で Windows ストア アプリを記述し、次の目的のために C++ も使用する場合に役立ちます。

  • パフォーマンスを向上させる、または負荷の大きい計算を実行する。

  • 現在のバージョンでは Windows ランタイムを通してアクセスできない Windows オペレーティング システム サービスにアクセスする。

  • 既に記述されテストされている既存のコードを再利用する。

このドキュメントの原則と手法を使って、C++ を使用した JavaScript の Windows ストア アプリを独自に作成できます。 C++ の背景知識または強い関心があるなら、このドキュメントから最大の益を得ることができます。 C++ の経験がない場合でも、同様のプログラミング言語または .NET Framework の使用経験があるならある程度の益を得られます。

JavaScript で構築した Windows ストア アプリから呼び出すことのできる Windows ランタイム コンポーネントを C++ で作成する方法の簡単な概要については、「C++ での Windows ランタイム コンポーネントの作成」を参照してください。

[このページのトップへ]

このドキュメントの内容

ドキュメントのこの部分の記事では、次の方法を説明します。

  • Visual Studio を使用して、C++ の Windows ランタイム コンポーネントを参照する JavaScript の Windows ストア アプリを作成する。

  • Web コンポーネントと Windows ランタイム コンポーネントを参照するモジュールに JavaScript コードを分離する。

  • 負荷の大きい計算を実行できる C++ の Windows ランタイム コンポーネントを作成する。

  • JavaScript と C++ で相互運用する。

  • コードを移行して Windows ストア アプリで使用する。たとえば、既存の COM コードなど。

[このページのトップへ]

このドキュメントで扱われていない内容

このドキュメントでは、Windows ストア アプリ開発の次の側面は扱いません。

  • アプリケーション デザインの原則。

  • C++ または JavaScript プログラミングの基本。

  • アリの巣の最適化アルゴリズムについての詳細。

  • アプリケーションの動作やパフォーマンスの問題をトラブルシューティングする方法。

  • 他のロケールでの使用に備えてアプリケーションを準備する方法。

  • アプリケーションを検証して Windows ストア に公開する方法。

このアプリケーションの焦点は JavaScript と C++ との相互運用性です。 そのため、優れた Windows ストア アプリに不可欠なすべての機能を実装したわけではありません。 実装されていない 1 つの重要な機能は、ユーザーがアプリケーションを閉じてから (再起動の後など) それを再実行したときに、アプリケーションの状態を復元する機能です。 この機能を示す例については、「App activation and suspension sample (アプリのアクティベーションとサスペンションのサンプル)」を参照してください。

以下のリソースは、Windows ストア アプリの開発を理解するために役立ちます。

[このページのトップへ]

次の手順

プロジェクトの読み込みと実行の方法およびアプリケーション全体の流れについては、「Bing Maps Trip Optimizer のサンプルの概要」を参照することをお勧めします。 次の表は、ドキュメントのこの部分で説明した記事を簡単に参照できるように説明しています。

[このページのトップへ]

関連記事

タイトル

説明

Bing Maps Trip Optimizer のサンプルの概要

Bing マップ トリップ オプティマイザー プロジェクトの基本的な特性 (同プロジェクトの作成方法と構造体、ビルド方法など) について説明します。

Bing Maps Trip Optimizer のサンプルでの JavaScript の使用

アプリケーションの JavaScript の部分がどのように整理されているか、およびローカル コンテキストと Web コンテキストがどのように互いに通信するかを示します。

Bing Maps Trip Optimizer のサンプルでの C++ の使用

Bing マップ トリップ オプティマイザーの C++ コンポーネントについて説明します。

Bing Maps Trip Optimizer のサンプルでの JavaScript と C++ 間の相互運用

Bing マップ トリップ オプティマイザー サンプルの JavaScript および C++ の部分がどのように相互運用するかを説明します。

Bing Maps Trip Optimizer のサンプルでの既存のコードの移行

Bing マップ トリップ オプティマイザーの ActiveX バージョンから Windows ストア アプリに移行したときに準拠した主要なガイドラインの一部をまとめています。

[このページのトップへ]

参照

概念

Windows ランタイム コンポーネントの作成

その他の技術情報

Roadmap for Windows Store apps using C++