如何在Google Maps API中編輯信息窗口？

我想使信息窗口可編輯，當我點擊它。如何在Google Maps API中編輯信息窗口？

這是我的代碼：

<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" > 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
     <meta name="viewport" content="width=device-width,minimum-scale=0.3,maximum-scale=5.0,user-scalable=yes"> 

    </head> 
<body onload="initialize()" onunload="GUnload()"> 

<style type="text/css"> 
*{ 
    margin:0; 
    padding:0; 
} 
</style> 

<div id="map_canvas" style="width: 500px; height: 300px;"></div> 

<div class=b style="width: 20px; height: 20px;background:red;position:absolute;left:700px;top:200px;"></div> 
<div class=b style="width: 20px; height: 20px;background:red;position:absolute;left:700px;top:200px;"></div> 

<script src="jquery-1.4.2.js" type="text/javascript"></script> 
<script src="jquery-ui-1.8rc3.custom.min.js" type="text/javascript"></script> 
<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAA-7cuV3vqp7w6zUNiN_F4uBRi_j0U6kJrkFvY4-OX2XYmEAa76BSNz0ifabgugotzJgrxyodPDmheRA&sensor=false"type="text/javascript"></script> 

<script type="text/javascript"> 
var aFn; 
//********** 
function initialize() { 
    if (GBrowserIsCompatible()) { 
     var map = new GMap2(document.getElementById("map_canvas")); 
     var center=new GLatLng(39.9493, 116.3975); 
     map.setCenter(center, 13); 

     aFn=function(x,y) { 
     var point =new GPoint(x,y) 
     point = map.fromContainerPixelToLatLng(point); 
     var marker = new GMarker(point,{draggable:true}); 

     GEvent.addListener(marker, "click", function() { 
      marker.openInfoWindowHtml("<b>wwww</b>"); 
     }); 

     map.addOverlay(marker); 

     $(".b").draggable({ 
      revert: true, 
      revertDuration: 0 
     }); 

     $("#map_canvas").droppable({ 
      drop: function(event,ui) { 
      aFn(event.pageX-$("#map_canvas").offset().left,event.pageY-$("#map_canvas").offset().top); 
      } 
     }); 
     } 
    } 
</script> 
</body> 
</html>

來源

2010-03-14 zjm1126

你可能要檢查出contentEditable財產如下面的例子：

function initialize() { 
    if (GBrowserIsCompatible()) { 
     var map = new GMap2(document.getElementById("map_canvas")); 
     var center = new GLatLng(39.9493, 116.3975); 
     map.setCenter(center, 13); 

     var marker = new GMarker(new GLatLng(39.9493, 116.3975),{draggable:true}); 

     GEvent.addListener(marker, 'click', function() { 
     marker.openInfoWindowHtml('<div contentEditable="true" ' + 
            'style="height: 100px; overflow: auto;">' + 
            'wwww</div>'); 
     }); 

     map.addOverlay(marker); 
    } 
}

這應該在所有的現代瀏覽器。

contentEditable Example

來源

2010-03-14 09:34:47

如何在Google Maps API中編輯信息窗口？

回答

相關問題