このドキュメントでは、Air Quality API を使用して、リッチな場所検索エクスペリエンスを構築する方法について説明します。大気質がファネルの最初から最後までユーザーにとって価値のあるシグナルとなる仕組みと、Air Quality API のデータを既存のエクスペリエンスに組み込む方法について説明します。
ユースケースと付加価値
Air Quality API のシグナルは、ユーザーが訪問する場所を探しているときなど、さまざまな検索エクスペリエンスに適合します。Air Quality API は以下を提供します。
- リアルタイム * と履歴データ - 現在の状態を表す最新の正確なデータと、30 日間の時間枠内の過去のデータを 1 時間単位で表示します。(* 屋外大気質の 1 時間ごとのスナップショット)
- グローバルおよびローカルのデータ - 100 以上の国で全域をカバーしつつ、高度にローカライズされた(最大 500 メートル)Air Quality API のデータは、ユーザーが最適な場所を比較して決定するための重要なシグナルを提供します。
大気質は、近隣の場所でも大きく異なる場合があります
サンプル チュートリアル
大気質データを早い段階で表示する
Air Quality API のデータを表示するには、主に次の 2 つの方法があります。
現在の状況 / 1 時間ごと: 各地域に対して表示する個々の値を取得します。
(セクション: 位置ピンに Air Quality API のデータを表示する に移動)ヒートマップ タイル: 現在の屋外の大気質を表す色付きのレイヤを地図の上に重ねて表示します。国別のレイヤ インデックスを利用できます。
(セクション: 地図に Air Quality API のヒートマップ レイヤを表示するに移動)
Air Quality API のデータを位置ピンに表示する
- 場所の指数を選択します。世界共通の AQI または地域の AQI(最大 70 種類の大気質指数(AQI)を利用可能)。大気質指数(AQI)は、特定の国(たとえば 米国 EPA)が、さまざまな計算方法、データソース、指定された目的に基づいて、さまざまな大気質レベルを分類する尺度です。
- 場所検索エクスペリエンスから、Air Quality API の主な値とカラーコードの可視化を開始します。
デフォルトの表示には、カラーコードのみを含めることができます。
ピンを選択したときに、Air Quality API の詳細情報を表示します。
- ユニバーサル AQI / ローカル AQI の意味。
- 汚染物質のレベル(空気中の粒子とガスの測定値): 主な汚染物質、濃度、発生源、影響。
- 健康に関する推奨事項: 現在の大気質に関する推奨される対応。
- デフォルトで表示される情報のレベルは、必要に応じて調整できます。ある地域のデータポイントは、他の地域と比較すると有用な場合が多いことに注意してください。
大気質セクションの表示例
{ "dateTime": "2023-08-09T10:00:00Z", "regionCode": "fr", "indexes": [ { "code": "uaqi", "displayName": "Universal AQI", "aqi": 76, "aqiDisplay": "76", "color": { "red": 0.4117647, "green": 0.77254903, "blue": 0.20392157 }, "category": "Good air quality", "dominantPollutant": "pm10" }, … ], "pollutants": [ { "code": "co", "displayName": "CO", "fullName": "Carbon monoxide", "concentration": { "value": 95.18, "units": "PARTS_PER_BILLION" }... }, … ], "healthRecommendations": -{ "generalPopulation": "With this level of air quality, you have no limitations. Enjoy the outdoors!", "elderly": "If you start to feel respiratory discomfort such as coughing or breathing difficulties, consider red ...", "lungDiseasePopulation": … } }
- または、位置情報とのインタラクションでのみ大気質データをクエリすることもできます。
- 大気質 API のインデックスを使用して、近くの場所をフィルタできます。たとえば、近隣の公園を探している場合、大気質の良い公園のみを表示できます。
大気質に関する回答
... "color":{ "red": 0.9490196, "green": 0.98039216, "blue": 0.019607844 } ...
var red = parseInt(colorResponse.red*255)|| 1; var green = parseInt(colorResponse.green*255)|| 1; var blue = parseInt(colorResponse.blue*255)|| 1; // --> output rgb(241,250,5)
地図上に Air Quality API のヒートマップ レイヤを表示する
ヒートマップの色分けされたタイルは、次のような場合に便利です。
- 広範囲の概要を表示します。
- このエリア内のニュアンスをすばやく表示します。
Maps JavaScript API と ImateMapType を使用して、Google マップのビューポート全体をカバーするために必要な個々のタイルを表示します。ユーザーが地図をパン、ズーム、または場所を変更すると、ヒートマップ タイルが更新されます。
使用できるズームレベルの値は最大 16 です。
局地的な検索で Air Quality API のヒートマップ タイルレイヤが表示されないことがある。
限られた一連の大気質指数の中から、ヒートマップのタイプを選択できます。
ユーザーが値とその色のランキングを理解できるように、カラースケールを必ず示してください。
- グラデーション スケール UAQI(0 ~ 100):
不良 / 優良
カラーパレットの CSS コード スニペット:
.gradient-scale { background: linear-gradient(to right, rgb(99, 20, 161) 0%, /* purple */ rgb(149, 0, 25) 20%, /* red */ rgb(248, 47, 21) 40%, /* orange */ rgb(255, 248, 35) 60%, /* yellow */ rgb(34,163,120) 80%, /* steelblue */ rgb(255,255,255) 100% /* white */ ); }
- UAQI(0 ~ 100)スケールのキーポイントを表す単色:
不良 / 良好
クエリ数と関連費用
- Maps JavaScript API: エクスペリエンスの読み込み時に 1 つの地図。
- Air Quality API:
- すべての場所に対して 1 回のクエリ(地図の読み込み時またはユーザーの選択時のみ)。
- ヒートマップ タイルレイヤ: 各タイル画像は 256×256 ピクセルで、モバイル デバイスやウェブで表示される標準的な地図をカバーするには 12 ~ 14 個のタイルが必要です。取得したタイルごとに 1 SKU ユニットとしてカウントされます。
- Nearby Search(新機能)API: 表示される 20 か所ごとに 1 件のクエリ。クエリ レスポンスの一部であるプレイス データに応じて異なる課金。
まとめ
Air Quality API は、ユーザーが訪れる場所を決めるうえで重要なデータポイントになることを示しました。そのため、検索結果に大気質データをできるだけ早く表示する必要があります。ただし、一度に表示する情報の量や表示方法には注意が必要です。
次のアクション
おすすめの参考資料:
寄稿者
この記事は Google が管理しています。このコンテンツは、以下の投稿者が作成しました。
主な執筆者:
Thomas Anglaret | ソリューション エンジニア