如何在ASP MVC中整合Google地图 [英] How to integerate Google maps in ASP MVC

问题描述

我正在学习ASP MVC，我希望在我注意到联系页面中的地址时显示显示位置的Google地图。



我有什么试过：

I am learning ASP MVC and I want to include Google Maps showing the location when I notice the adress in the Contact Page.

What I have tried:

@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
<link href="~/Content/Site.css" rel="stylesheet" />
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?
 sensor=false"></script>


<script type="text/javascript">

    function initialize() {

        var canvas = $("#map_canvas");

        var latitude = 35.78334;
        var longitude = 51.42511;

        var latlng = new google.maps.LatLng(latitude, longitude);
        var options = {
            zoom: 8,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var map = new google.maps.Map(canvas[0], options);

        var marker = new google.maps.Marker({
            position: new google.maps.LatLng(latitude, longitude),
            map: map
        });
    }

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

  </script>

并且在视图中：

and in the view :

<div style="width: 100%; height: 100%">
    <div id="map_canvas" style="width:100%; height:100%; margin-left:   100px"></div>
 </div>

推荐答案

（＃map_canvas）;

var latitude = 35.78334;
var longitude = 51.42511;

var latlng = new google.maps.LatLng（纬度，经度）;
var options = {
zoom：8，
center：latlng，
mapTypeId：google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map（canvas [0]，options）;

var marker = new google.maps.Marker（{
position：new google.maps.LatLng（纬度，经度），
map：map
}） ;
}

("#map_canvas"); var latitude = 35.78334; var longitude = 51.42511; var latlng = new google.maps.LatLng(latitude, longitude); var options = { zoom: 8, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map(canvas[0], options); var marker = new google.maps.Marker({ position: new google.maps.LatLng(latitude, longitude), map: map }); }

（function（）{
initialize（）;
}）;

< / script>

(function () { initialize(); }); </script>

并且在视图中：

and in the view :

<div style="width: 100%; height: 100%">
    <div id="map_canvas" style="width:100%; height:100%; margin-left:   100px"></div>
 </div>

看看 Easy GIS .NET

Easy GIS .NET - 面向.NET开发人员的GIS和映射控件 [ ^ ]



对于WinForms：

GMap .NET GitHub - radioman / greatmaps：GMap.NET - 适用于Windows窗体的优秀地图&演示 [ ^ ]



GMap.NET初学者教程：地图，标记，多边形和&路径[针对Visual Studio 2015和GMap.NET 1.7更新] |独立软件 [ ^ ]

Take a look at Easy GIS .NET
Easy GIS .NET - GIS and Mapping Controls for .NET developers[^]

For WinForms:
GMap.NETGitHub - radioman/greatmaps: GMap.NET - Great Maps for Windows Forms & Presentation[^]

GMap.NET Beginners Tutorial: Maps, markers, polygons & routes [updated for Visual Studio 2015 and GMap.NET 1.7] | Independent Software[^]

这篇关于如何在ASP MVC中整合Google地图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！