自定义的谷歌地图标记图标未显示在局部视图中

时间:2012-03-27 15:16:25

标签: javascript asp.net-mvc google-maps razor google-maps-api-3

奇怪的事情(至少对我而言)正在发生。我有部分视图显示了几个谷歌地图标记。但是,只要我拒绝显示,我就会使用自己的自定义图标。但是当我在global.asax.cs的RegisterRoutes函数中给出我的路径时,例如

   routes.MapRoute(
                "Default", // Route name
                "{controller}/{action}/{id}", // URL with parameters
                new { controller = "Home", action = "Index", id = UrlParameter.Optional } // Parameter defaults
            );

如果我的部分视图是在索引视图中,那么由于我不知道的原因决定显示自己? 这是为什么以及如何解决这个问题?

更新(代码): 这是我在部分视图中的代码,称为MapResults。

<script type="text/javascript">

    var geocoder;
    var map;
    function initialize() {
        geocoder = new google.maps.Geocoder();
        var latlng = new google.maps.LatLng(-34.397, 150.644);
        var myOptions = {
            zoom: 8,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

        collectingData();
        google.maps.event.addListener(map, 'click', function() {

        });      
   } 

    function codeAddress(location, name, contract) {
        var address = location;
        var infowindow;
        var image;
        geocoder.geocode({ 'address': address }, function (results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                    map.setCenter(results[0].geometry.location);

                     var image = new google.maps.MarkerImage(returnImage(contract),
                      // This marker is 20 pixels wide by 32 pixels tall.
                      new google.maps.Size(30, 42),
                      // The origin for this image is 0,0.
                      new google.maps.Point(40,45),
                      // The anchor for this image is the base of the flagpole at 0,32.
                      new google.maps.Point(0, 32));

                    var marker = new google.maps.Marker({
                    map: map,
                  //  icon: image,   only showing when registered in global asax
                    position: results[0].geometry.location,            
                });

          infowindow = new InfoBox(infoboxOptions(boxText(name, contract)));
                     google.maps.event.addListener(marker, 'click', function() {
                    infowindow.open(map, marker);
                     });
            } else {
                alert("Geocode was not successful for the following reason: " + status);
            }   
        });               
    }

这些是我最重要的功能。

这是一个使用我的局部视图的视图

@model IPagedList<HospitalSearch.Models.Buildings>

@{
   ViewBag.Title = "Map";

}
         <div>     
            @Html.Partial("MapResults")
        </div>

  @foreach (var item in Model) {
        <input id="adres" type="hidden" value=@Html.DisplayFor(modelItem => item.StreetBuilding) @Html.DisplayFor(modelItem => item.NumberBuilding) />  
  }

  </body>
<div class="pager">
    @Html.Pager(Model.PageSize, Model.PageNumber, Model.TotalItemCount)
</div>

将它显示在RegisterRoutes中将显示为想要的,否则它将不会。 更新: 事实证明,RegisterRoutes以某种方式获得了我的图像的“正确”网址。如果我使用直接路径说http://localhost:8080/Content/image.png那么一切都很好。 但是“Content / image.png”不起作用。如果我弄清楚到底发生了什么,我当然会更新。

1 个答案:

答案 0 :(得分:0)

当您处于局部视图时,自定义标记的图像路径可能不再有效。你是如何引用你的形象的?最好使用Url.Content帮助器方法来获取路径。

如果这不能解决问题,您可以发布更多代码吗? HTML和地图javascript?感谢。