見出し画像

マップコンポーネントの限界 【Adalo Tips】

■今回のTips : 

マップコンポーネントで、下記の機能を実装したかった。

・マップの初期表示範囲を固定する

・表示するデータ(今回は店舗)の状態によって、アイコンの色を変える

(結果)断念。恐らく実装不可。

■試したこと

・マップの初期表示範囲を固定する

Adaloのマップコンポーネントでは、表示するデータの位置関係によって、マップの初期表示範囲が自動的に決まります。

例1:表示するデータが、全て東京都内にある→マップの初期表示範囲は東京に収まる範囲

例2:表示するデータが、北海道と沖縄にある→マップの初期表示範囲は日本全体

この機能があるために、マップを開いた時、表示するデータが広範囲になるほど、マップは広く表示されてしまいます。

そのため、ユーザーは現在地付近に縮尺を合わせる作業を行う必要が出てきます。

システム的には欠陥ではありませんが、これは無くせるなら無くしたい動作ですよね。

そこで、マップの初期表示範囲を固定できないか情報を集め、色々試してみました。

結果、無理でした。

おそらく、マップコンポーネントはその様に弄ることが出来ません。

マップコンポーネントのエディタ画面に、Javaのコードを追加できる項目があり、もしやと思ったのですが無理でした。

このJavaコード追加可能な部分、マップのスタイル(色合いとかピンのアイコン変更とか)に関わる部分であって、表示範囲を変えるコードを書いても意味が無いようです。

具体的には、下記画像のようなイメージです。

マップの表示範囲をいじるのは不可能

と、言うことで、マップの初期表示範囲固定は断念。

・表示するデータ(今回は店舗)の状態によって、アイコンの色を変える

Javaのコード追加できるとこで、ピンのアイコンを変更できる事が分かりました。

なので、コードかけば、表示するデータによってピンアイコンの色変えられるじゃん!と思っていたのですが、そう上手くは行きませんでした。

ピンアイコンの色を変えることは可能なのですが、条件分岐(データが状態Aの時は赤いピン、状態Bの時は緑のピンとか)を受け付けてくれません。

これも上記画像の通り、追加分のコードを書いてる場所が、そもそも条件分岐のコードを書く場所じゃないからなのでしょう。

以上、ダメだった理由を長々と書きました。

Adaloには、Javascriptを用いた、コンポーネントの開発も可能なようなので、そちらでどうにかできないかも検証していきたいと思っています。

同じことを試みようとしている方の、手間と時間を救える記事になったら幸いです。

また、「それ間違ってるよ」や「こうすればできるよ」(←この意見待ってます!)があれば、コメントなどで教えてもらえるととても嬉しいです。

この記事が気に入ったらサポートをしてみませんか?