使用ASP.NET精确定位谷歌地图上的位置

时间:2013-05-02 09:59:26

标签: javascript asp.net google-maps geolocation bing-maps

我正在尝试查明谷歌(或bing)地图上的位置,而我两者都无法做到这一点。两者的代码结构相似,我提出谷歌地图尝试:

目标:我有一个对象的链接列表,每个对象都包含纬度和经度,所有这些都必须精确定位。

完整ASP:http://pastie.org/7752124(转发器将显示搜索结果)

相关(头部):

<script type="text/javascript">
    var map = null;
    function initialize() {
        var mapOptions = {
            center: new google.maps.LatLng(40.42, -98.737),
            zoom: 4,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        map = new google.maps.Map(document.getElementById("map-canvas"),
        mapOptions);
        //pushPin(25, 80);
    }
    function pushPin(lat, lon) {
        alert(lat + " " + lon);
        var myLatlng = new google.maps.LatLng(lat, lon);
        var marker = new google.maps.Marker({
            position: myLatlng,
            map: map,
            title: "Hello World!"
        });
    }
    google.maps.event.addDomListener(window, 'load', initialize);
</script>

代码隐藏: 用户单击搜索按钮时激活:

protected void Button1_Click(object sender, EventArgs e)
    {
        List<Results> rlist = getResults(query);
        String Locations = "";
        foreach (Results res in rlist)
        {
            Page.ClientScript.RegisterStartupScript(
                GetType(),
                "MyKey",
                "pushPin("+res.latitude+","+res.longitude+");",
                true);
        }
        this.rptREsults.DataSource = rlist;
        this.rptREsults.DataBind();
    }

public class Results
{
    public string filename { get; set; }
    public string asciiname { get; set; }
    public string latitude { get; set; }
    public string longitude { get; set; }
}

结果是正确的并且包含纬度和经度,当我在pushPin方法中发出警报时,只有一个警告框出现,但没有创建精确定位。是否有更好的方法来存储和查明纬度和经度列表?

当我从另一个javascript方法调用它时,pushPin方法有效。

1 个答案:

答案 0 :(得分:0)

我倾向于这样做,这是我在其他网站上使用的一些代码的缩减版本/示例,但应该足以让你有所作为:

var markers = new Array();
var markerLatLongs = new Array();
var sites = // JSON formatted version of your Results object(s)

function initialize() {
    var mapOptions = {
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById('map'),
        mapOptions);


    createMarkers();
}

function createMarkers() {
    for (var j = 0; j < sites.length; j++)
    {
        markerLatLongs[j] = new google.maps.LatLng(sites.latitude ,sites.longitude )
        markers[j] = new google.maps.Marker({
            position: markerLatLongs[j],
            map: map,
            title: sites[j].siteName
        });    
    }
}

为了解决时间问题,在另一个函数中调用pushPin,然后在初始化内部添加对函数包装器的调用:

protected void Button1_Click(object sender, EventArgs e)
    {
        List<Results> rlist = getResults(query);
        String Locations = "";
        StringBuilder pushPinCalls = new StringBuilder();
        foreach (Results res in rlist)
        {
          pushPinCalls.AppendFormat("pushPin({0},{1});",res.latitude,res.longitude);
        }
            Page.ClientScript.RegisterStartupScript(
                GetType(),
                "MyKey",
                string.Format("function pushPinManager() {{0}}",pushPinCalls.ToString());,
                true);
        this.rptREsults.DataSource = rlist;
        this.rptREsults.DataBind();
    }

并在js:

function initialize() {
    var mapOptions = {
        center: new google.maps.LatLng(40.42, -98.737),
        zoom: 4,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById("map-canvas"),
    mapOptions);
    pushPinManager();
}