1

我正在构建一个 asp.net MVC 3 应用程序。我有一个 SQL Server 数据库，其中存储了我的数据，并且我正在使用实体框架中的模式优先模型。我知道如何从数据库中获取我的数据，但是虽然我对 MVC 还很陌生，但我不知道从存储在我的数据库中的坐标向地图添加图钉的人。任何人都可以通过展示一个例子来帮助我。

先感谢您

4

1 回答 1

2

首先，您需要一些服务器端代码从 SqlServer 加载您的 pin 数据。

在后面的 c# 代码中，您可以Page_Load在 javacsript 端填充一些 pin 纬度/经度变量以传递以使用。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.Script.Serialization;
public partial class _Default : System.Web.UI.Page
{
    protected string[] pinLat;
    protected string[] pinLong;

    public static class JavaScript
    {
        public static string Serialize(object o)
        {
            JavaScriptSerializer js = new JavaScriptSerializer();
            return js.Serialize(o);
        }
    }

    protected void Page_Load(object sender, EventArgs e)
    {
        // Populate your latiude and longitude from SQL Server into our arrays to be used in javascript
        pinLat = new string[3] { "55.342575", "15.342575", "25.342575" };
        pinLong = new string[3] { "-55.342570", "-55.342570", "-55.342570" };
    }
}

使用由Brian提供的 JavaScript.Serialize将 c# 数组转换为 javascript 数组，然后循环遍历每个数组并将它们固定到地图上。

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
    CodeFile="Default.aspx.cs" Inherits="_Default" %>

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">

<script type="text/javascript" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0"></script>
<script type="text/javascript" language="javascript">

    // Serialize our c# array into javascript array
    var pinLatitude = <%=JavaScript.Serialize(this.pinLat) %>;
    var pinLogitude = <%=JavaScript.Serialize(this.pinLong) %>;


      function loadPins() {
              try {
                  for (var i = 0; i < pinLatitude.length; i++) {

                      var pushpin = new Microsoft.Maps.Pushpin(new Microsoft.Maps.Location(pinLatitude[i], pinLogitude[i]),{ draggable: true });
                      pushpin.setOptions({ visible: true });
                      map.entities.push(pushpin);

                  }
              }
              catch (err) {
                alert(err)
              }
          }

     function GetMap() {
              // Initialize the map
              try {
                  map = new Microsoft.Maps.Map(document.getElementById("mapDiv"), { credentials: 'heyhey', mapTypeId: Microsoft.Maps.MapTypeId.road });
                  loadPins();
              }
              catch (err) {
                  alert(err.message);
              }
          }


</script>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <body onload="GetMap();">
         <div id='mapDiv' style="position:relative; width:750px; height:500px;"></div>
    </body>
</asp:Content>
于 2013-08-21T16:39:19.473 回答