гугл карты в asp.net c # mvc 3 - PullRequest
Новая
       22

гугл карты в asp.net c # mvc 3

1 голос
/ 07 ноября 2011

Так что я могу просматривать карту Google, если у меня нет макета.Когда я вставляю свой CSS-дизайн, он больше не работает.

Это код для моего взгляда 

@{ 
    ViewBag.Title = "MVC 3 and Google Maps"; 
}

@section Scripts { 
    <script type="text/javascript"  src="http://maps.google.com/maps/api/js?sensor=false"></script>
}

@section Styles { 
    html { height: 80% } 
    body { height: 80%; margin: 0px; padding: 0px } 
    #map_canvas { height: 80% } 
}

<h2>Hello, Google Maps</h2>

<div id="map_canvas" style="width:80%; height:80%"></div>

<script type="text/javascript">

    function initialize() {
        var latlng = new google.maps.LatLng(40.716948, -74.003563);
        var options = { zoom: 14, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP };
        var map = new google.maps.Map(document.getElementById("map_canvas"), options);
    }

    $(function () {
        initialize();
    }); 

</script>

Вот код для моего _Layout.cshtml 

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8" />
        <title>@ViewBag.Title</title>
        <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
        <script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
        <script src="@Url.Content("~/Scripts/modernizr-1.7.min.js")" type="text/javascript"></script>
        @RenderSection("Scripts", false)
        @*<style type="text/css"> 
            @RenderSection("Styles", false) 
        </style>*@
    </head>


    <body>
        @RenderBody()
        <style type="text/css"> @RenderSection("Styles", false)</style>

    </body>
    </html>

Ответы [ 2 ]

1 голос
/ 07 ноября 2011

У меня была похожая проблема, и вам просто нужно отлаживать по одному CSS-атрибуту за раз.Моя причина была в том, что div изначально был скрыт, что означало, что размеры не были установлены правильно, когда я его отображал.Подобные проблемы с отображением можно решить, вызвав изменение размера карты Google: 

    google.maps.event.trigger(myMap, 'resize');

Причиной моей проблемы было то, что карта Google отображалась раньше некоторых других элементов и использовала их значения по умолчанию, чтобы определить свои собственныевизуальные характеристики.Запуск события изменения размера заставил его пересчитать доступное пространство.Просто идея.

0 голосов
/ 07 ноября 2011

Используйте FireBug , IE Developer Tools или Chrome Inspector и отключайте стили, пока не сможете определить, какой из них вызывает его подавление. Ручной подход заключается в комментировании стилей вашего сайта, пока вы не определите, где проблема. Метод проб и ошибок здесь. Пожалуйста, напишите, если вы найдете виновника.

...