0

ユーザーがダブルクリックでマーカーのタイトルを入力できるようにしようとしています。私はそれを機能させることができないようです。

シングルクリックではなくダブルクリックでプロンプトウィンドウを表示するにはどうすればよいですか?

これは HTML5/Javascript で可能ですか? 私たちはまだ jQuery を学んでいません。

    <!DOCTYPE html>
<html>
<head>
<title>Boca Raton Map</title>
<meta charset="UTF-8">
<style>
header {font-family:Georgia,"Times New Roman",serif;
    font-size:20px;
    display:block;

}
</style>
<script type="text/javascript" charset="UTF-8" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" charset="UTF-8">
var locations = [
    [26.3583333, -80.0833333, "Boca Raton, FL"],
        ]
function init() 
{
 makemap(locations[0][0],locations[0][1]);
 document.getElementById("header").innerHTML = "Base location is "+locations[0][2];
}

var listener;
var map;
var markersArray =[];
var blatlng; 
var myOptions; 

function makemap(mylat,mylong) 
{

 blatlng = new google.maps.LatLng(mylat,mylong);
 // alert("latlng is "+latlng);
 myOptions = {
      zoom: 14,
      center: blatlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
    };
 map = new google.maps.Map(document.getElementById("place"), myOptions);

 listener = google.maps.event.addListener(map, 'click', function(event){
            checkit(event.latLng);                                   
            }); 
}

//function disp_prompt()
 //{
  //var mTitle=prompt("Please enter a marker title:", "Marker Title");
 //}

function checkit(clatlng) 
{
    var mTitle=prompt("Please enter a marker title:", "Marker Title")
    var distance = dist(clatlng,blatlng);
    distance = Math.floor((distance+.005)*100)/100;
    var distanceString = String(distance)+" miles";
    marker = new google.maps.Marker({
                                     position: clatlng,
                                     title: mTitle,
                                     map: map });
    //markersArray.push(marker);
    //--
    //document.getElementById("answer").innerHTML  = 
    // "The distance from base to most recent marker is "+String(distance) +" miles.";
}

function dist(point1, point2) 
{
      //spherical law of cosines
      //var R = 6371; // km
      var R =  3959; // miles
      var lat1 = point1.lat()*Math.PI/180;
      var lat2 = point2.lat()*Math.PI/180 ;
      var lon1 = point1.lng()*Math.PI/180;
      var lon2 = point2.lng()*Math.PI/180;

        var d = Math.acos(Math.sin(lat1)*Math.sin(lat2) + 
                  Math.cos(lat1)*Math.cos(lat2) *
                  Math.cos(lon2-lon1)) * R;
    return d;     
}


//--
</script>
</head>
<body onLoad="init();" onclick="disp_prompt()">
<header id="header">Base location is your current geolocation.</header>
<div id="place" style="width:600px; height:400px"></div>
<div id="answer"></div>
</form>
</body>
</html>
4

0 に答える 0