Leafletでマップに追加したマーカーを消す方法
onMapMoved = function(e) {
map.removeLayer(markerList);
var url = "https://api.twitter.com/1.1/search/tweets.json";
var searchKeywords = get_search_keywords();
if (searchKeywords.length > 0) {
searchKeywords.forEach(function output(searchKeywords) {
since_id = null;
getTwitter(url, searchKeywords);
});
}
};
地図上に追加されたマーカーを消す実装をonMapMoved関数に追加したいと考えているのですが、どなたかその方法を知っている方、回答お願い致します。
(get_search_keywords関数はウェブページで検索したいキーワードを選択させたものを解釈して配列に、その配列に入っているキーワード分getTwitter関数に渡して実際にツイートを検索しています。getした情報を基に違う関数で地図に緯度経度情報を持つものだけマーカープロットしている状況です。)
地図にプロットしている関数のコードはこちら
function update(data) { // 引数(data)に取得したデータが入ってくる
var bounds, distance1, distance2, r, southWest;
var bounds = map.getBounds();
var center = bounds.getCenter();
var southWest = bounds.getSouthWest();
var distance1 = bounds.getNorthWest().distanceTo(southWest) / 1000;
var distance2 = bounds.getSouthEast().distanceTo(southWest) / 1000;
var r = distance1 < distance2 ? distance1 : distance2;
r *= 0.5;
r = Math.floor(r * 10) / 10;
$("#tweetDisplay").empty(); // 表示エリアを空にする
$("#tweetDisplay").append('<br>');
var geoFlag = 0;
$("#tweetDisplay").append("<p style='border: medium solid'>Twitter (地図中央から半径" + r + "km)</p>");
var result = data.statuses; // 取得したデータから、メソッドチェーンで必要なものを取得
// TwitterからGeoタグを保有しているTweetだった場合のみ緯度経度を取得して、地図にマーカープロット
for (var i = 0; i < result.length; i++) {
var name = result[i].user.name; // ツイートした人の名前
var account = result[i].user.screen_name; // ツイートした人のアカウント名
var imgsrc = result[i].user.profile_image_url; // ツイートした人のプロフィール画像
// var content = result[i].text; // ツイートの内容
var contents = AutoLink(result[i].text); // ツイート内にURLがあればリンクへ飛ぶ
var updated = result[i].created_at; // ツイートした時間
var tweet;
// Tweet表示エリアに取得したデータを追加していく
tweet = "<a href='https://twitter.com/" + account + "'><img src='"
+ imgsrc + "'></a>" + "<p>" + 'ID: ' + name + ' @' + account
+ "<br>" + contents + "<br>";
if (result[i].coordinates) {
geoFlag = 1;
var coordinates = result[i].coordinates.coordinates; // ツイートの緯度経度情報
tweet += '緯度: ' + coordinates[1] + ', 経度: ' + coordinates[0]
+ "<br>" + 'Time: ' + updated + "<br></p>";
$("#tweetDisplay").append(tweet);
var icon = L.icon({
iconUrl : imgsrc,
iconSize : [ 20, 22 ]
});
marker = L.marker([ coordinates[1], coordinates[0] ], {
icon : icon
}).addTo(map);
markerList.push(marker);
} else {
tweet += 'Time: ' + updated + "<br></p>";
$("#tweetDisplay").append(tweet);
}
if (i != count - 1) {
$("#tweetDisplay").append("</p><hr noshade size='7'>");
}
}
if (geoFlag === 0) {
alert('Geoタグ付きツイートは検出されませんでした。');
}
}