Question

我使用php和javascript在谷歌地图中呈现一些矩形。如果我只创造一个它是完美的。如果我使用更多Chrome，那么速度会慢下来，以至于我无法加载地图。

以下是一些代码：

<?php
foreach($matrix as $rect)
{
    print"<script>

    var rectangle;
    var map;
    var infoWindow;

    function initialize() {
        var mapOptions = {
            center: new google.maps.LatLng(". $rect[0][0].", ". $rect[0][1]."),
            zoom: 20
        };
        map = new google.maps.Map(document.getElementById('map-canvas'),
            mapOptions);

        var bounds = new google.maps.LatLngBounds(
            new google.maps.LatLng(". $rect[2][0].", ". $rect[2][1]."),
            new google.maps.LatLng(". $rect[1][0].", ". $rect[1][1].")
        );

        rectangle = new google.maps.Rectangle({
            bounds: bounds//,
            //editable: true//,
            //draggable: true
        });

        rectangle.setMap(map);

        // Add an event listener on the rectangle.
        google.maps.event.addListener(rectangle, 'bounds_changed', showNewRect);

        // Define an info window on the map.
        infoWindow = new google.maps.InfoWindow();
    }

    function showNewRect(event) {
        var ne = rectangle.getBounds().getNorthEast();
        var sw = rectangle.getBounds().getSouthWest();

        var contentString = '<b>Rectangle moved.</b><br>' +
            'New north-east corner: ' + ne.lat() + ', ' + ne.lng() + '<br>' +
            'New south-west corner: ' + sw.lat() + ', ' + sw.lng();

        // Set the info window's content and position.
        infoWindow.setContent(contentString);
        infoWindow.setPosition(ne);

        infoWindow.open(map);
    }

    google.maps.event.addDomListener(window, 'load', initialize)

    </script>"; 
?>

我不认为我的代码是错误的。所以问题是：我可以在同一张地图上展示多个矩形，还是必须使用很多地图？

此处的代码：https://developers.google.com/maps/documentation/javascript/examples/rectangle-event

提前致谢！

Answer 1

演示如何渲染多个Rectangle对象的修改示例

＆＃13;

html, body, #map-canvas {
   height: 100%;
   margin: 0px;
   padding: 0px;
}

＆＃13;

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true"></script>
<div id="map-canvas"></div>

＆＃13;

 connectionString="Data Source=(localdb)\v11.0; 
                   Initial Catalog=FormsContext; 
                   Integrated Security=True; 
                   MultipleActiveResultSets=True;
                   AttachDbFilename=|DataDirectory|Forms.mdf"
 providerName="System.Data.SqlClient"

＆＃13;

在谷歌地图中创建矩形

1 个答案: