Multiple markers event binding
by essoduke chang
HTML
<script src="//maps.google.com/maps/api/js?sensor=false&language=zh-TW&libraries=geometry"></script>
<script src="http://app.essoduke.org/tinyMap/jquery.tinyMap-3.1.4.min.js?ver=3.1.4"></script>
<div id="map"></div>
<p id="info"></p>
CSS
#map{width:100%;height:300px}
JavaScript
// markers
var loc = [
['25.04151536540612', '121.56354904174805']
['25.041282077030896', '121.56741142272949'],
['25.0383270525352', '121.57045841217041'],
['25.034516521123315','121.56496524810791'],
['25.037627167884715', '121.56732559204102'],
['25.039726809855434', '121.55633926391602'],
['25.037160575899154', '121.55350685119629'],
['25.035877438787317', '121.55715465545654'],
['25.033972149830436', '121.56063079833984'],
['25.031794640503858', '121.56414985656738'],
['25.035255306871402', '121.56998634338379'],
['25.033855498524844', '121.5686559677124'],
['25.036927279240775', '121.57376289367676'],
['25.041593128099265', '121.5723466873169'],
['25.04485911668452', '121.56917095184326'],
['25.04536455952624', '121.56402111053467'],
['25.04380934412532', '121.55998706817627'],
['25.041904178378704', '121.55848503112793'],
['25.038521464229383', '121.55900001525879']
];
var marker = [];
var map = $('#map');
// Loop 綁定事件
for (var i = 0; i < loc.length; i++) {
marker.push({
'addr': loc[i],
'event': function () {
$('#info').html(this.position.lat() + ', ' + this.position.lng());
}
});
}
map.tinyMap({
'center': ['25.033972149830436', '121.56063079833984'],
'zoom': 13,
'marker': marker
});