Map not visible

[yoankrumov]

After following the instructions, I have created a new sample mvc project, but the map is not visible. It must be something wrong on my side since it is just a sample project - https://www.dropbox.com/s/5ylgkocz59jbnk9/WebApplication1.zip?dl=0

Do you have any suggestions?

[jmelosegui]

I think the problem is your html layout (you are nesting two class="row" elements).

If you push your sample to github I can clone it and send you a pull request fixing it.

But basically replacing your Index.cshtml with the following code should work.

@using Jmelosegui.Mvc.GoogleMap

@{
    ViewBag.Title = "Home Page";
}
<div class="jumbotron">
    <h1>ASP.NET</h1>
    <p class="lead">ASP.NET is a free web framework for building great Web sites and Web applications using HTML, CSS and JavaScript.</p>
    <p><a href="http://asp.net" class="btn btn-primary btn-lg">Learn more &raquo;</a></p>
</div>

<div class="row">
    <div class="col-md-4">
        <h2>Getting started</h2>
        <p>
            ASP.NET MVC gives you a powerful, patterns-based way to build dynamic websites that
            enables a clean separation of concerns and gives you full control over markup
            for enjoyable, agile development.
        </p>
        <p><a class="btn btn-default" href="http://go.microsoft.com/fwlink/?LinkId=301865">Learn more &raquo;</a></p>
    </div>
    <div class="col-md-4">
        <h2>Get more libraries</h2>
        <p>NuGet is a free Visual Studio extension that makes it easy to add, remove, and update libraries and tools in Visual Studio projects.</p>
        <p><a class="btn btn-default" href="http://go.microsoft.com/fwlink/?LinkId=301866">Learn more &raquo;</a></p>
    </div>
    <div class="col-md-4">
        <h2>Web Hosting</h2>
        <p>You can easily find a web hosting company that offers the right mix of features and price for your applications.</p>
        <p><a class="btn btn-default" href="http://go.microsoft.com/fwlink/?LinkId=301867">Learn more &raquo;</a></p>
    </div>

</div>
<div class="row">
    <div class="col-md-12">
        @(Html.GoogleMap()
              .Name("map")
              .Height(500)
              )
    </div>
</div>
@section scripts {
    @(Html.GoogleMap().ScriptRegistrar())
}

let me know if you need something else.

[yoankrumov]

Great! It works :)

I will give this a try.

Thank you very much for the fast reply.