tyoshikawa1106のブログ

- Force.com Developer Blog -

Creating a Salesforce Lightning Map Componentを試してみました

Salesforce Developers BlogのCreating a Salesforce Lightning Map Componentを試してみました。Lightningで地図表示する機能のサンプルコードと確認手順がまとめられています。

f:id:tyoshikawa1106:20150412130026p:plain

Creating a Salesforce Lightning Map Component - Developer Relations

Step 1: Import Leaflet as a Static Resource

まずはLeafletライブラリをダウンロードして静的リソースにアップロードします。

f:id:tyoshikawa1106:20150412130522p:plain

Download - Leaflet - a JavaScript library for mobile-friendly maps

Download内容はこんな感じです。

f:id:tyoshikawa1106:20150412130942p:plain


静的リソースにアップします。

f:id:tyoshikawa1106:20150412131236p:plain

Step 2: Create the Component

1. Lightning Componentを作成します。

f:id:tyoshikawa1106:20150412133936p:plain

2. 右側のWorkPanelからController.jsを作成します。

f:id:tyoshikawa1106:20150412133943p:plain

3. 右側のWorkPanelからStyle.cssを作成します。

f:id:tyoshikawa1106:20150412133952p:plain


これでLightning Componentの準備完了です。設定からタブを作成してモバイルナビゲーションに追加すれば画面を表示できます。こんな感じです。

f:id:tyoshikawa1106:20150412133555p:plain

(なぜかこのとき自分の環境でSalesforce1の調子が良くなかったのでLightning Applicationを用意する方法で表示してみました。)