Fixed Map Geolonia Plugin
Fixed Map Geolonia Plugin は、 Geolonia Embed API のプラグインとして動作します。 以下のように Embed API と一緒にスクリプトを読み込んでください。
<body>
<div class="geolonia"></div>
<script src="https://cdn.geolonia.com/v1/embed?geolonia-api-key=YOUR-API-KEY" />
<script src="https://cdn.geolonia.com/v1/fixed-map-plugin@latest" />
</body>
画面のスクロールによって地図が隠れると、固定表示に切り替わります。
このままドキュメントをスクロールしてみてください。
ここまでスクロールした方は、地図が右下に固定されているのが見えるはずです。
カスタマイズ
fixed
クラス、または geolonia-map-fixed
クラスを使って CSS を上書きすることで、固定マップのスタイルを変更できます。/* 固定位置を左上に変更 */
.geolonia.fixed {
left: 10px;
top: 10px;
}
/* 固定位置を右上に変更 */
.geolonia.geolonia-map-fixed {
right: 10px;
top: 10px;
}
コントリビューション
Issue、プルリクエストはいつでも歓迎します。
以下のコマンドで開発用サーバーを立ち上げることができます。
$ git clone git@github.com:geolonia/fixed-map-plugin.git
$ cd fixed-map-plugin
$ yarn # または npm install
$ npm start