レス数:1 / 状態:未解決 / No:25 / ATOM
1
名前:タカノユ
日付:2017/12/07(木)13:05:51
ID:ydeBiUNqFk+v
下のソースはプログラムの一部抜粋したもので、前のページから情報を配列で渡してそれをマップ表示させるものです これに現在地情報を取得して、
同じマップに現在地のピンを置くようにするにはどうしたらよいでしょうか?ネットで探してきて組み込んでみても元のマップすら表示されなくなったりして困っています 初心者なので、できたらソースコードを書いていただけると助かります よろしくお願いいたします(サイトURLだけの回答は止めてほしいです)
<script src="https://maps.google.com/maps/api/js?key= My Key "></script>
<script type="text/javascript">
var currentWindow=null;
var map_list=JSON.parse('<?php echo $map_list; ?>');
console.log(map_list);
var maplist = new Array();
var cnt = 0;
function initialize() {
var myOptions = {
zoom: 14,
center: new google.maps.LatLng(map_list[0][1], map_list[0][2]),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"),myOptions);
var markers = map_list;
for (var i = 0; i < markers.length; i++) {
var name = markers[i][0];
var latlng = new google.maps.LatLng(markers[i][1],markers[i][2]);
var icons = 'http://www.google.com/mapfiles/marker.png';
createMarker(name,latlng,icons,map);
}
}
function createMarker(name,latlng,icons,map){
var infoWindow = new google.maps.InfoWindow();
var marker = new google.maps.Marker({position: latlng,icon:icons,map: map});
google.maps.event.addListener(marker, 'click', function() {
if(currentWindow){
currentWindow.close();
}
infoWindow.setContent(name);
infoWindow.open(map,marker);
currentWindow = infoWindow;
});
maplist[cnt++] = marker;
}
$(function(){
$('#mapList li').click(function(){
var no = $('#mapList li').index(this);
google.maps.event.trigger(maplist[no], "click");
});
});
google.maps.event.addDomListener(window, 'load', initialize);
</script>
<div id="map_canvas" style="width:600px; height:480px"></div>
同じマップに現在地のピンを置くようにするにはどうしたらよいでしょうか?ネットで探してきて組み込んでみても元のマップすら表示されなくなったりして困っています 初心者なので、できたらソースコードを書いていただけると助かります よろしくお願いいたします(サイトURLだけの回答は止めてほしいです)
<script src="https://maps.google.com/maps/api/js?key= My Key "></script>
<script type="text/javascript">
var currentWindow=null;
var map_list=JSON.parse('<?php echo $map_list; ?>');
console.log(map_list);
var maplist = new Array();
var cnt = 0;
function initialize() {
var myOptions = {
zoom: 14,
center: new google.maps.LatLng(map_list[0][1], map_list[0][2]),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"),myOptions);
var markers = map_list;
for (var i = 0; i < markers.length; i++) {
var name = markers[i][0];
var latlng = new google.maps.LatLng(markers[i][1],markers[i][2]);
var icons = 'http://www.google.com/mapfiles/marker.png';
createMarker(name,latlng,icons,map);
}
}
function createMarker(name,latlng,icons,map){
var infoWindow = new google.maps.InfoWindow();
var marker = new google.maps.Marker({position: latlng,icon:icons,map: map});
google.maps.event.addListener(marker, 'click', function() {
if(currentWindow){
currentWindow.close();
}
infoWindow.setContent(name);
infoWindow.open(map,marker);
currentWindow = infoWindow;
});
maplist[cnt++] = marker;
}
$(function(){
$('#mapList li').click(function(){
var no = $('#mapList li').index(this);
google.maps.event.trigger(maplist[no], "click");
});
});
google.maps.event.addDomListener(window, 'load', initialize);
</script>
<div id="map_canvas" style="width:600px; height:480px"></div>
このスレッドについて
質問の状態 : | 未解決 |
投稿開始日 : | 2017/12/07(木)13:05:51 |
投稿終了日 : | 2017/12/14(木)13:05:59 |
投稿者 : | タカノユ |
レス総数 : | 1 |
スレッド番号 : | 25 |