0

我正在使用 Mapbox Javascript API ( http://www.mapbox.com/mapbox.js/api/v1.3.1/ )，并且遇到了如何在回发时加载地图的问题。第一次加载页面时，我希望地图以我定义的一组坐标为中心，但是当用户在文本框中输入邮政编码时，我希望地图以这些坐标为中心。在我修改代码之前，我最初的问题是地图会加载到准备好的文档上，并且地图不会设置用户在回发时定义的新视图，但现在我遇到了地图没有的问题加载准备好的文档，但是当用户输入邮政编码时，它可以正常工作。

这是我的 document.ready 函数：

$( document ).ready(function() {
        var map = L.mapbox.map('map');
        var oldZoom = map.zoomControl;
        oldZoom.removeFrom(map);
        new L.Control.Zoom({ position: 'topright' }).addTo(map);
        map.addLayer(L.tileLayer('http://{s}.tile.stamen.com/toner/{z}/{x}/{y}.png'));
        map.setView([53.503355, -2.827564], 6); // this runs on document ready, but also sets the view on postback
        function _doPostBack() {
            updateMap();
        } // this is my attempt at a fix
        var markerLayer = L.mapbox.markerLayer()
        .addTo(map);
    });

这是我的 updateMap() 函数，我只想在用户导致回发时触发：

function updateMap()
    {
        map.setView([<asp:Literal runat='server' id='currentLatSetView'/>,<asp:Literal runat='server' id='currentLongSetView'/>], <asp:Literal runat='server' id='theZoomScale'/>);
    }

这是相关的按钮代码：

<asp:button runat="server" ID="submitPostcode" class="btn btn-default" OnClientClick="updateMap()" OnClick="submitPostcode_Click" Text="Go!"/>

所以我的问题是，如何在我的 javascript 中添加检查 1. 第一次加载页面时将地图居中在一组坐标上，以及 2. 如何防止 document.ready() 中的 setView()触发，而是触发具有不同用户定义坐标的不同 setView()。

4

1 回答 1

1

您可以定义隐藏字段以获取坐标值。

<asp:HiddenField runat="sever" ID="hdnXAxis"  Vlaue="Your Default Value" />
<asp:HiddenField runat="sever" ID="hdnYAxis"  Vlaue="Your Default Value" />

回发时：

hdnXAxis.Value= txtXAxis.Text;
hdnYAxis.Value= txtYAxis.Text;

JS：

$( document ).ready(function() {
var xAxis = $('#<%= hdnXAxis.Client%>').val();
var yAxis = $('#<%= hdnYAxis.Client%>').val();
        var map = L.mapbox.map('map');
        var oldZoom = map.zoomControl;
        oldZoom.removeFrom(map);
        new L.Control.Zoom({ position: 'topright' }).addTo(map);
        map.addLayer(L.tileLayer('http://{s}.tile.stamen.com/toner/{z}/{x}/{y}.png'));
        map.setView([xAxis, yAxis], 6); // this runs on document ready, but also sets 
        var markerLayer = L.mapbox.markerLayer()
        .addTo(map);
    });

这未经测试，但这样的事情可能会解决您的问题。

于 2013-09-23T14:04:29.200 回答