ロケーター+ページのマップのスタイル設定
ロケーター+ページのマップの色を変更する方法を説明します
Table of Contents
この記事では、ロケーター+ページのマップの色を変更する手順の概要を説明します。
ロケーターのマップスタイル
ロケーター+ページのデフォルトのスタイルは、Google マップのデフォルトテーマに基づいています。ロケーター+ページをウェブサイトに組み込む際は、ウェブサイトのブランディングに合わせてマップの色を調整するとよいでしょう。
デフォルト:

デフォルトのスタイルは、ほぼあらゆる構成に変更できます。スタイルはお客様にご用意いただく必要がありますが、ご相談やサポートにも喜んで対応いたします。
Google スタイリングウィザード
まず、Google のスタイリングウィザードを使用して、マップスタイルの構成を含む JSON ファイルを作成します。
| Google のスタイリングウィザードでは、道路、ランドマーク、ラベルの密度を調整できます。また、6 種類のプリセットからテーマを選択することもできます。 さらにマップをカスタマイズするオプションが必要な場合は、「MORE OPTIONS」ボタンから詳細な設定を行えます。 「FINISH」をクリックするとウィンドウが開き、ロケーターにテーマを適用するために必要な JSON ファイルが表示されます。 「COPY JSON」をクリックします。 |
![]() |
Uberall ロケーターにマップスタイルを適用する
Uberall ロケーターにマップスタイルを適用するには、次の 2 つの方法があります:
ロケーター設定ツール
フロントエンドのロケータービルダーで、カスタムマップスタイルを選択し、JSON データを入力できます。

ご注意ください:これは、HTML の一部としてロケーターウィジェットで data-attribute data-mainmapstyles='' を使用していない場合にのみ可能です!使用している場合は、以下をご確認ください。
HTML を更新する
HTML 内の Uberall ウィジェットの data-mainmapstyles='' 属性を更新します。コピーした JSON を 2 つのアポストロフィの間に貼り付けて実行します。
例:
| 変更前: |
変更後: |
![]() |
![]() |
| data-mainmapstyles='' |
data-mainmapstyles='PASTE_THIS_JSON_HERE' |
「COPY JSON」をクリックします。

