JS - leafletでピンを後から追加することは可能か

Question

前提

小生、Pythonista
Javascriptは見よう見まねでコチョコチョする程度

やりたいこと

leafletを使い、あとから座標のピンを追加していきたい

//地図描画
var loc = [35,135]; //座標
var map = L.map('map').setView(loc, 19);
var mapLink = '<a href="http://openstreetmap.org">OpenStreetMap</a>';
L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
          	{
          		attribution: 'Map data &copy; ' + mapLink,
          		maxZoom: 20
          	}
            ).addTo(map);
var marker = L.marker(loc).addTo(map);

<div id="map"></div>

ここで、セットした地図にあとから座標[36,135]を追加するようなことは可能でしょうか？

websocket等試して見ましたが、リアルタイムに更新するようなことはできませんでした。

どなたか
・可能かどうか
・方法があればヒント

をご存知の方いらっしゃいましたら、ご教授ください・・・。

Answer 1

当該のライブラリは利用したことがありません。
ただ、以下は公式のページかと思いますが
http://leafletjs.com/

L.marker([51.5, -5]).addTo(map)
    .bindPopup('A pretty CSS3 popup.<br> Easily customizable.')
    .openPopup();

こんな感じで追加できるみたいですよ。公式サイトでConsole開いて上記コマンド叩いたら
追加できたので出来るのではないでしょうか。

Answer 2

・可能かどうか

可能。

・方法があればヒント

どなたのかわかりませんが、下記URLに「クリックしたらポップアップ付きマーカーが表示される」コードがありました。

【Leaflet demo - JSFiddle】
http://jsfiddle.net/kedar2a/LnzN2/2/

公式のドキュメントを見るのも良いと思います。

【Documentation - Leaflet - a JavaScript library for interactive maps】
http://leafletjs.com/reference-1.0.3.html

Comments

[starrow1103]

ありがとうございます！

いろいろなことが可能なんですね。

お恥ずかしい。
もう少し検索能力の向上に努めます・・・。