facebook twitter hatena line email

Google/Googlemap/js

提供: 初心者エンジニアの簡易メモ
2016年8月4日 (木) 17:22時点におけるAdmin (トーク | 投稿記録)による版

移動: 案内検索

googlemap貼り付けたい場所に

jsコード

body閉じるタグの直前に。

<script src="https://maps.googleapis.com/maps/api/js?key=[apikey]"></script>
<style>
#map-canvas {
   width: 700px;
   height: 400px;
}
</style>
<script type="text/javascript">
var map = new google.maps.Map(document.getElementById('map-canvas'), {
   center: new google.maps.LatLng(34.7019399, 135.51002519999997),
   zoom: 15
});
var marker = new google.maps.Marker({
   position: new google.maps.LatLng(34.7019399, 135.51002519999997),
   map: map
});
var infoWindow = new google.maps.InfoWindow({
content: '
大阪
'
});
marker.addListener('click', function() {
   infoWindow.open(map, marker);
});
var marker2 = new google.maps.Marker({
   position: new google.maps.LatLng(34.804618851, 135.345302589),
   map: map
});
infoWindow2 = new google.maps.InfoWindow({
content: '
兵庫
'
});
marker2.addListener('click', function() {
   infoWindow2.open(map, marker2);
});
</script>