jQuery UI Map显示街道和城市名称

时间:2014-07-06 13:49:24

标签: jquery jquery-ui google-maps kml jquery-ui-map

在谷歌地图中,​​在地图和卫星视图选择器的下方,有一个勾选框,您可以在其中打开或关闭标签。这可以在代码中完成吗?这是我在jsFiddle http://jsfiddle.net/nbauers/2Dnwa/1/

上的工作代码

是否像使用“mapTypeId”一样简单:google.maps.MapTypeId.HYBRID?我想我可能已回答了我自己的问题。

<!DOCTYPE HTML>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>jQuery Google Maps KML Import</title>
  <script src="http://maps.google.com/maps/api/js?sensor=true"></script>
  <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <script src="../jq/jquery.ui.map.full.min.js"></script>
  <script src="test07.js"></script>
</head>
<body>
  <h1>jQuery Google Maps KML Import</h1>
  <div style="margin:4px;" id="map_canvas"></div>
</body>
</html>

// ==== test07.js ====
$( document ).ready(function(){
    var $map_canvas = $( "#map_canvas" ),
        yourStartLatLng = new google.maps.LatLng(41.6, 2.6);

    $map_canvas.css( "width", $( window ).width() - 24 );
    $map_canvas.css( "height", $( window ).height() / 2 );

    $map_canvas.gmap( {
      "center": yourStartLatLng,
      "mapTypeId": google.maps.MapTypeId.SATELLITE });
    $map_canvas.gmap( "option", "zoom", 5 );    // Bigger zoom numbers zoom in.

    $map_canvas.gmap().bind( "init", function( ev, map ) {
        // ======================================================
        // ==== Import the KML
        // ======================================================
        var kmlLayer = new google.maps.KmlLayer({
            url: "http://nbest.co.uk/jsAQAsim/jsTests/test07f.kml",
            preserveViewport: true,
            suppressInfoWindows: false,
            map: map });
        // ======================================================
    });
});

0 个答案:

没有答案