Skip to content

Instantly share code, notes, and snippets.

@wf9a5m75
Created April 17, 2014 23:03
Show Gist options
  • Save wf9a5m75/11016303 to your computer and use it in GitHub Desktop.
Save wf9a5m75/11016303 to your computer and use it in GitHub Desktop.
イベントを活用する ref: http://qiita.com/wf9a5m75/items/516c3ff1f8adf9938310
var button = document.getElementById("button");
button.addEventListener("click", function() {
console.log("ボタンがクリックされた");
});
button.addEventListener("click", function() {
alert("ボタンがクリックされた");
});
var map = plugin.google.maps.getMap();
map.addEventListener(plugin.google.maps.event.MAP_READY, function(map) {
console.log("Mapの準備が完了");
});
map.addEventListener("MY_EVENT", function() {
alert("MY_EVENT が発生した");
});
map.trigger("MY_EVENT");
map.addEventListener("MY_EVENT", function(map, data) {
alert("MY_EVENT (" + data + ")が発生した");
});
map.trigger("MY_EVENT", "DATA1");
map.trigger("MY_EVENT", "DATA2");
//マーカーを保持するための配列
var all_markers = [];
//位置の定義
const GOOGLE = new plugin.google.maps.LatLng(37.422858, -122.085065);
const GOOGLE_TOKYO = new plugin.google.maps.LatLng(35.660556,139.729167);
const GOOGLE_SYDNEY = new plugin.google.maps.LatLng(-33.867487,151.20699);
const GOOGLE_NY = new plugin.google.maps.LatLng(40.740658,-74.002089);
//マーカーを追加する
var GOOGLES = [GOOGLE, GOOGLE_TOKYO, GOOGLE_SYDNEY, GOOGLE_NY];
GOOGLES.forEach(function(latLng) {
map.addMarker({
'position': latLng
}, function(marker) {
//配列にマーカーを追加
all_markers.push(marker);
});
});
//ボタンがクリックされたら、マーカーを削除する
var button = document.getElementById("button");
button.addEventListener("click", function() {
//全てのマーカーをここで削除する
all_markers.forEach(function(marker) {
marker.remove();
});
});
//位置の定義
const GOOGLE = new plugin.google.maps.LatLng(37.422858, -122.085065);
const GOOGLE_TOKYO = new plugin.google.maps.LatLng(35.660556,139.729167);
const GOOGLE_SYDNEY = new plugin.google.maps.LatLng(-33.867487,151.20699);
const GOOGLE_NY = new plugin.google.maps.LatLng(40.740658,-74.002089);
//マーカーを追加する
var GOOGLES = [GOOGLE, GOOGLE_TOKYO, GOOGLE_SYDNEY, GOOGLE_NY];
GOOGLES.forEach(function(latLng) {
map.addMarker({
'position': latLng
}, function(marker) {
// MARKER_REMOVEイベントが発行されたら、マーカーを削除する
map.addEventListener("MARKER_REMOVE", function() {
marker.remove();
});
});
});
//ボタンがクリックされたら、マーカーを削除する
var button = document.getElementById("button");
button.addEventListener("click", function() {
// MARKER_REMOVEイベントを発行する
map.trigger("MARKER_REMOVE");
});
map.addEventListener(plugin.google.maps.event.MAP_CLOSE, function() {
alert("地図が閉じられた");
});
function onMapReady(map) {
/**
* ボタン1が押されたら、地図を表示して、マーカーを追加する
*/
var button1 = document.getElementById("button1");
button1.addEventListener("click", function() {
map.showDialog();
/**
* マーカーの追加
*/
const GOOGLE = new plugin.google.maps.LatLng(37.422858, -122.085065);
const GOOGLE_TOKYO = new plugin.google.maps.LatLng(35.660556,139.729167);
const GOOGLE_SYDNEY = new plugin.google.maps.LatLng(-33.867487,151.20699);
const GOOGLE_NY = new plugin.google.maps.LatLng(40.740658,-74.002089);
var GOOGLES = [GOOGLE, GOOGLE_TOKYO, GOOGLE_SYDNEY, GOOGLE_NY];
GOOGLES.forEach(function(latLng) {
map.addMarker({
'position': latLng
}, function(marker) {
// MARKER_REMOVEイベントが発行されたら、マーカーを削除する
map.addEventListenerOnce("MARKER_REMOVE", function() {
marker.remove();
});
});
});
// マーカーが画面に収まるようにカメラの位置を合わせる
map.moveCamera({
'target': GOOGLES
});
});
/**
* 地図ダイアログが閉じられた時、MARKER_REMOVEイベントを発行する
*/
map.addEventListener(plugin.google.maps.event.MAP_CLOSE, function() {
map.trigger("MARKER_REMOVE");
});
/**
* 確認のために、ボタン2を押したら地図ダイアログを表示する
*/
var button2 = document.getElementById("button2");
button2.addEventListener("click", function() {
map.showDialog();
}, false);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment