1

我正在尝试为我在 Sitefinity 中的活动生成 Google 地图。我正在使用嵌入式 Google iframe 代码,并且正在使用<%# Eval("Street") %>and<%# Eval("City") %><%# Eval("State") %>从我的 Sitefinity 事件自定义字段中提取事件的位置以输出 html。

所以我的代码如下所示:

<iframe width='500' height='240' frameborder='0' scrolling='no' marginheight='0' marginwidth='0' src='https://maps.google.com/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=<%# Eval("Street") %>+<%# Eval("City") %>+<%# Eval("State") %>&amp;aq=0&amp;oq=<%# Eval("Street") %>+<%# Eval("City") %>+<%# Eval("State") %>&amp;ie=UTF8&amp;hq=&amp;hnear=<%# Eval("Street") %>+<%# Eval("City") %>+<%# Eval("State") %>&amp;z=14&amp;output=embed&iwloc=near'></iframe>

现在地图正在为事件生成,一切正常,除了地图上的标记没有居中。我应该怎么做才能使标记居中?

4

1 回答 1

1

下面是一个包含三个地图的示例 HTML。通过检查开发人员工具中的 HTML,确保 Sitefinity 的参数返回您期望的内容。还要确保地址、城市和州之间有空格或逗号。此外,如果您使用的是 Sitefinity 6,他们现在已经内置了Google Maps 。

   <html>
    <head></head>
    <body>
    <iframe width='500' height='240' frameborder='0' scrolling='no' marginheight='0' marginwidth='0' src='https://maps.google.com/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=510 W Main St Fort Wayne IN&amp;aq=0&amp;oq=510 W Main St Fort Wayne IN&amp;ie=UTF8&amp;hq=&amp;hnear=510 W Main St Fort Wayne IN&amp;z=14&amp;output=embed&iwloc=near'></iframe>
    <iframe width='500' height='240' frameborder='0' scrolling='no' marginheight='0' marginwidth='0' src='https://maps.google.com/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=1770 Apple Glen Blvd Fort Wayne IN&amp;aq=0&amp;oq=1770 Apple Glen Blvd Fort Wayne IN&amp;ie=UTF8&amp;hq=&amp;hnear=1770 Apple Glen Blvd Fort Wayne IN&amp;z=14&amp;output=embed&iwloc=near'></iframe>
    <iframe width='500' height='240' frameborder='0' scrolling='no' marginheight='0' marginwidth='0' src='https://maps.google.com/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=1600 Amphitheatre Pkwy, Mountain View, CA&amp;aq=0&amp;oq=1600 Amphitheatre Pkwy, Mountain View, CA&amp;ie=UTF8&amp;hq=&amp;hnear=1600 Amphitheatre Pkwy, Mountain View, CA&amp;z=14&amp;output=embed&iwloc=near'></iframe>
    </body>
    </html>

使用谷歌地图 V3 API。将 javascript & map div 粘贴到 sitefiniy 的小部件中,使用您的 <%#Eval("address")%> 作为传递给 GetLatLong() 函数的字符串

<html html>
<head>
<script src="https://maps.googleapis.com/maps/api/js?key=YOURKEYHERE&sensor=false"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script>
    var geocoder = new google.maps.Geocoder();
    var marker;
    var map;
    $(document).ready(function(){
        initialize();
    });

    function initialize() {
          var mapOptions = {
            zoom: 10,
            center: new google.maps.LatLng(39.8282, -98.5795),//US Center as Default
            mapTypeId: google.maps.MapTypeId.ROADMAP
          };
          map = new google.maps.Map(document.getElementById('map-canvas'),
              mapOptions);
        GetLatLong("201 W Main St Fort Wayne IN");//Use your <%#Eval("Address")%> here Like
        //GetLatLong('<%#Eval("Street")%> <%#Eval("City")%> <%#Eval("State")%> ');
    }
    function GetLatLong(address){
        if (geocoder)
        {
            geocoder.geocode({ 'address': address }, function (results,status) {
                if (status == google.maps.GeocoderStatus.OK)
                {
                    var l = results[0].geometry.location;
                    map.setCenter(l);
                    var marker = new google.maps.Marker({
                            position: results[0].geometry.location,
                            map: map,
                            title: address
                            });
                }
                else
                {

                }
            });
        }
    }
</script>
</head>
<body>
    <div id="map-canvas" style="height:500px;width:500px;"></div>
</body>
</html>
于 2013-06-11T18:18:01.490 回答