2012-11-20 134 views
0

我正在使用谷歌地圖api v3的JavaScript。我正在嘗試使圓角地圖顯示。我能找到的唯一方法就是從幾年前開始將infowindow變成信息框。谷歌地圖api V3與圓角

有沒有更好的方式來做到這一點,現在與CSS?

回答

1

創建一個包含谷歌地圖javascrip,谷歌地圖3和最新的jQuery的HTML。
不要忘記添加infobubble js將要做的伎倆。
添加下面的jQuery代碼到HTML文件

 


$('#homepage_map').gmap3 
      (
       { 
        action:'init', 
        options: 
        { 
         center:[response.locations.latitude, response.locations.longitude], 
         zoom: 8, 
         mapTypeId: google.maps.MapTypeId.ROADMAP, 
         mapTypeControl: true, 
         navigationControl: true, 
         scrollwheel: true, 
         mapTypeControlOptions: 
         { 
          mapTypeIds: ['Map'] 
         }, 
         streetViewControl: true 
        } 
       }, 
       { 
        action:'clear' 
       }, 
       { 
        action: 'addMarkers', 
        markers:MarkerOBJ, 
        marker: 
        { 
         options: 
         { 
          draggable: false, 
          icon: HOST+'img/icons/google_marker.png', 
          animation: google.maps.Animation.DROP 
         }, 
         events: 
         { 
          click: function(marker, event, data) 
          { 
           var map = $(this).gmap3('get'); 
           infoBubble = new InfoBubble({ 
            maxWidth: 395, 
            shadowStyle: 1, 
            padding: 5, 
            borderRadius: 10, 
            arrowSize: 20, 
            borderWidth: 5, 
            borderColor: '#CCC', 
            disableAutoPan: true, 
            hideCloseButton: false, 
            arrowPosition: 50, 
            arrowStyle: 0 
           }); 
           infoBubble.close(); 
           infoBubble.setContent(data); 
           infoBubble.open(map, marker); 
          } 
         } 
        } 
       } 
      ); 

 

現在你需要做的是隻要你想infobubble顯示添加樣式表。 infoBubble.setContent(data);其中數據將是您需要根據需要設置的infobubble的html。