摘自:http://blog.csdn.net/a6225301/article/details/20003305
在上一篇《asp.net中javascript與后台c#交互》中實現了前端腳本javascript調用后台的數據庫的數據。但新的問題又出現了,由於地圖上有多個點,所以存放google maps的longitude和latitude有多個值,這就需要利用數組來存放經緯度,問題又演變成如何把后台的c#數組傳給前端的js。由於剛接觸asp.net和前端這塊,基本是零基礎,所以這個問題困擾了很久,上網查資料,后來在一篇文章中看到解決辦法,但文章中的方法處理的是定長數組,而我現在要處理的是不定長數組,由於用戶有可能會添加和刪除地圖上的位置,所以從數據庫里查詢的記錄數是未知的,所以我又在文章的基礎上修改了一下。自己親自的實踐了一下並應用在自己的程序中,果然解決了問題。現在結合大牛的文章和我自己的親身實踐來說明一下這個問題是如何解決的。
第一步:定義cs數組 cs文件里后台程序中要有數組,這個數組要定義成公共的數組。
public string[] lat = null; public string[] lng = null;
第二步:給cs數組賦值 cs數組的值一般都是從數據庫中取到的,相信大家也都會,且后邊的代碼中也會有描寫,這里就不做詳細的解釋。
第三步:將cs數組賦給前端的js數組 這個步驟是關鍵,我選用的方法就是<%=cs數組%>。這樣模糊的說法也是百度得到的,賦值會用到循環,即會一個元素一個元素的賦值。
后台cs代碼
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using System.Data.OleDb; using System.Data; using System.Collections; public partial class VideoSource : System.Web.UI.Page { public string[] lat = null;//存放緯度值 public string[] lng = null;//存放經度值 public int lng_len = 0;//用於獲得數組長度 public int k = 0;//用於賦值循環 protected void Page_Load(object sender, EventArgs e) { ArrayList lng_list = new ArrayList(); ArrayList lat_list = new ArrayList(); OleDbConnection con = new OleDbConnection(@"Provider=Microsoft.ACE.OLEDB.12.0;Data Source=" + Server.MapPath("App_Data/Database1.accdb")); con.Open(); string sql = "select * from tb_videos"; try { OleDbDataAdapter gh = new OleDbDataAdapter(sql, con); DataSet ds = new DataSet(); gh.Fill(ds); con.Close(); foreach (DataRow DR in ds.Tables[0].Rows) { lng_list.Add(DR[2].ToString()); lat_list.Add(DR[3].ToString()); } } catch { con.Dispose(); } lng = (string[])lng_list.ToArray(typeof(string)); lat = (string[])lat_list.ToArray(typeof(string)); lng_len = lng_list.Count; }
aspx代碼
<script type="text/javascript"> var jingdu = new Array(); var weidu = new Array(); <% for(int k=0;k<lng_len;k++){ %> jingdu.push("<%=lng[k]%>"); weidu.push("<%=lat[k]%>"); <% } %> var latlng=[]; for(var i=0;i<jingdu.length;i++){ latlng.push(new google.maps.LatLng(jingdu[i],weidu[i])); } </script>
上述代碼即為我解決問題所用代碼,均已試驗通過。
上述代碼即為我解決問題所用代碼,均已試驗通過。