如何以编程方式在Google地图中添加多个标记?

时间:2016-03-30 13:39:23

标签: javascript c# asp.net google-maps google-maps-api-3

我在ASPX页面中有这个代码:

markers: [{
    address: "riyadh, saudi arabia",
    html: '<div style="width: 300px;"><h4 style="margin-bottom: 8px;">Hi, we\'re <span>Envato</span></h4><p class="nobottommargin">Our mission is to help people to <strong>earn</strong> and to <strong>learn</strong> online. We operate <strong>marketplaces</strong> where hundreds of thousands of people buy and sell digital goods every day, and a network of educational blogs where millions learn <strong>creative skills</strong>.</p></div>',
    icon: {
        image: "images/icons/map-icon-red.png",
        iconsize: [32, 39],
        iconanchor: [13, 39]
    }
}, {
    address: "Al Uyaynah العيينة",
    html: '<div style="width: 300px;"><h4 style="margin-bottom: 8px;">Hi, we\'re <span>Envato</span></h4><p class="nobottommargin">Ring Road, Al Abageyah, Qism El-KhalifaOur mission is to help people to <strong>earn</strong> and to <strong>learn</strong> online. We operate <strong>marketplaces</strong> where hundreds of thousands of people buy and sell digital goods every day, and a network of educational blogs where millions learn <strong>creative skills</strong>.</p></div>',
    icon: {
        image: "images/icons/map-icon-red.png",
        iconsize: [32, 39],
        iconanchor: [13, 39]
    }
}, {
    address: "Riyadh Province, Saudi Arabia",
    html: '<div style="width: 300px;"><h4 style="margin-bottom: 8px;">Hi, we\'re <span>Envato</span></h4><p class="nobottommargin">Ring Road, Al Abageyah, Qism El-KhalifaOur mission is to help people to <strong>earn</strong> and to <strong>learn</strong> online. We operate <strong>marketplaces</strong> where hundreds of thousands of people buy and sell digital goods every day, and a network of educational blogs where millions learn <strong>creative skills</strong>.</p></div>',
    icon: {
        image: "images/icons/map-icon-red.png",
        iconsize: [32, 39],
        iconanchor: [13, 39]
    }
}]

我应该从数据库加载地图标记。如何使用C#更改以下代码?

awk '{ print substr($0, index($0,$column_id)) }' 1.txt

1 个答案:

答案 0 :(得分:0)

关于第二个问题,您应该使用Web服务并将数据表转换为JSON格式,然后您就可以在JavaScript中使用JSON。

WEB服务

[WebMethod]
[System.Web.Script.Services.ScriptMethod(ResponseFormat = System.Web.Script.Services.ResponseFormat.Json)]
public void GetMaps(string mapId)
{
    DataTable dt = new DataTable();

   dt = dataClass.data.get(mapId);

    string jsonString = string.Empty;
    jsonString = JsonConvert.SerializeObject(dt);
    Context.Response.Clear();
    Context.Response.ContentType = "application/json";
    Context.Response.Flush();
    Context.Response.Write(jsonString);

}

通过以下代码,您可以从webservice获取JSON格式

            var senderData = { mapId: "1" }

            $.ajax({
                type: "POST",
                url: "/webservice.asmx/GetMaps",
                processData: false,
                contentType: "application/json; charset=utf-8",
                data: JSON.stringify(senderData),

                success: function (response) {

                    //JSON format is in items
                    var items = eval(response.d);


                },
                error: function (error) {
                    console.log(error);
                }


            });