Tag: 谷歌 MAPS API 3

Google Maps API v3：单击DOM元素时关闭信息窗口: 我第一次玩谷歌地图，所以我看了一篇关于CSS技巧的精彩教程： http ： //css-tricks.com/google-maps-slider/我喜欢使用jQuery比纯JS更好，本教程提供了一种很好的方法来单击列表中的某个位置以在地图中显示标记。我喜欢这样，但我需要在标记处添加infowindows。我做了哪些，但当我点击列表上的某个地方并且地图平移时，信息窗保持打开状态！我认为这是因为我需要将infowindow.close（）附加到点击“#locations li”的事件上。这是我的代码，它在document.ready上运行： $(function() { var chicago = new google.maps.LatLng(41.924832, -87.697456), pointToMoveTo, first = true, curMarker = new google.maps.Marker({}), $el; var myOptions = { zoom: 10, center: chicago, mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map($(“#map_canvas”)[0], myOptions); $(“#locations li”).click(function() { $el = $(this); if (!$el.hasClass(“hover”)) { $(“#locations li”).removeClass(“hover”); $el.addClass(“hover”); […]

通过单击按钮和带有jQuery的单独JS文件，触发Google Map Marker上的单击事件: 我正在使用Google Map API v3和jQuery 1.11.0。我在以下div中有一个谷歌地图地图有4个标记，它的点击事件通过这种方式添加到JS- google.maps.event.addListener(marker, ‘click’, (function(marker, i) //Adding Click Function { return function() { //Add Your Customized Click Code Here alert(locations[i][3]); //End Add Your Customized Click Code Here } })(marker, i)); 现在我在html的另一部分（外部地图）中有一个按钮，如下所示 – Click Me 现在我想添加一个on click事件，它将触发索引为3的地图标记的click事件。所以，我有像这样的HTML格式的JavaScript- $(document).ready(function() { $(“#3”).click(function(){ google.maps.event.trigger(markers[3], ‘click’); }); }); 但它没有用。我认为它不能用jQuery选择标记。因为我之前选择了jQuery这样的地图 – […]

谷歌地图100％高度: 我正在使用此处的代码： http://jquery-ui-map.googlecode.com/svn/trunk/demos/jquery-mobile-example.html#basic_map 我唯一的问题是我找不到如何使地图100％高度。以前有人有这个问题吗？

单击地图时关闭信息框: 我正在使用Google Maps V3 API的Infobox插件（http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/docs/reference.html）当用户在地图上点击信息框外面时，信息框是否过于接近？

从选择下拉菜单更新谷歌地图: 我需要能够从html选择下拉菜单更新谷歌地图。 n00b的位，所以任何信息都将非常感激。我有以下JS / Google map api v3代码可以使用。使用选择下拉菜单，我需要能够使用bromley_route638.setMap(map);更新地图，即选择bromley_route638.setMap(map); 从下拉菜单中。谢谢！ // Mapping variables var global_strokeColor = “#FF0000”; var global_strokeOpacity = 1.0; var global_strokeWeight = 2; //BROMLEY BOROUGH var bromley_centrepoint = new google.maps.LatLng(51.408664,0.114405); var school_bromley_beaverwood = new google.maps.LatLng(51.41859298,0.089179345); var school_bromley_bishpjustus = new google.maps.LatLng(51.382522,0.045018); // Route 638 var bromley_route638 = new google.maps.Polyline({ path: [new google.maps.LatLng(51.408664,0.114405),new google.maps.LatLng(51.412973,0.114973),new […]

通过ajax（）请求获取Google Maps API的地址坐标: 我试图通过下一个示例http://jsbin.com/inepo3/7/edit获取Google Maps API的lng和lat坐标。我期待一个“成功”弹出窗口，但它会一直显示“错误”弹出窗口。谷歌地图请求提供了正确的json反馈（由firebug检查）。 $().ready(function() { $.fn.getCoordinates=function(address){ $.ajax( { type : “GET”, url: “http://maps.google.com/maps/api/geocode/json”, dataType: “jsonp”, data: { address: address, sensor: “true” }, success: function(data) { set = data; alert(set); }, error : function() { alert(“Error.”); } }); }; $().getCoordinates(“Amsterdam, Netherlands”); }); 有谁知道如何解决这个问题？此致，Guido Lemmens 编辑我在jQuery中使用Google Maps Javascript API找到了一个更好的解决方案： $().ready(function() { var user1Location […]

如何清除绑定到Google商家信息自动填充function的输入？: 以下是我的问题：我正在使用Google地方信息自动填充function从用户那里收集有关地点的信息。在事件“place_changed”上，我保存了这些信息。但是我希望为用户提供添加多个位置的可能性。所以在这个地方保存之后我想清除输入。但是，Google自动填充会自动替换输入字段中的最后一个条目。无论如何摆脱那个？细节： var inputDiv = $(‘#myinput’); var options = { types: [‘(cities)’] }; var autocomplete = new google.maps.places.Autocomplete(inputDiv[0], options); google.maps.event.addListener(autocomplete, ‘place_changed’, function() { var places = autocomplete.getPlace(); savePlaces(places); console.log(inputDiv.val()); // ‘Paris, France’ inputDiv.val(”); console.log(inputDiv.val()); // (an empty string) setTimeout(function() { console.log(inputDiv.val()); // ‘Paris, France’ (It’s back!) inputDiv.val(”); console.log(inputDiv.val()); // […]

Google地图根据窗口大小调整设置不同的缩放: 按照我之前的问题谷歌地图响应resize我想基于Windowsresize实现不同的缩放级别，所以如果浏览器窗口“少于”应用x数量的缩放，如果“major than”自动应用另一个缩放级别。以下代码完美地适用于在Windowsresize上重新定位地图，我需要将新的缩放级别应用于它： var map; function initialize() { var mapOptions = { center: new google.maps.LatLng(40.5472,12.282715), zoom: 6, mapTypeId: google.maps.MapTypeId.ROADMAP }; map = new google.maps.Map(document.getElementById(“map-canvas”), mapOptions); } google.maps.event.addDomListener(window, ‘load’, initialize); google.maps.event.addDomListener(window, “resize”, function() { var center = map.getCenter(); google.maps.event.trigger(map, “resize”); map.setCenter(center); map.setZoom(zoom level needs to be automatically set according to window size); });

谷歌地图API V3 – 点击标记显示更多信息内容作为叠加（如在谷歌地图）: 我们使用Google Map Api V3在HTML容器中加载谷歌地图。我们有一个位置搜索表单。提交后，我们将获取可用的位置并在地图中设置标记。加载标记后，点击每个标记我们需要显示标题，地址详细信息和设计，就像我们在谷歌地图中所拥有的那样。（在谷歌地图中 – 当点击红色标记时，我们可以看到更多信息覆盖框，其中包含其他详细信息，如星星，路线，附近搜索，保存到地图，更多..）我们是否内置了apifunction来加载上面的覆盖框。或者我们没有加载详细信息的function，就像我们目前在谷歌地图中所拥有的那样。当我在谷歌和地图文档中搜索时，我可以看到显示叠加窗口和在框内写入内容的选项。但我没有看到根据需要加载内容的选项。我已粘贴以下代码供参考。 var map = null; gmap_ready = function (){ var myLatlng = new google.maps.LatLng(43.834527,-103.564457); var myOptions = { zoom: 3, center: myLatlng, mapTypeId: google.maps.MapTypeId.ROADMAP } map = new google.maps.Map(document.getElementById(“map_canvas”), myOptions); } function fnLoadMarkers(){ var locations = [ [‘S Dakota’, 43.834527,-103.564457, 1], […]

在Google地图上的区域中绘制矩形: 我正在使用Geometry API在Google地图上绘制一个区域。我想知道是否可以在一个动态大小的区域上绘制重复元素？例如，如果我绘制我的区域看起来像这样：然后我希望能够点击“下一步”并看到这样的东西，在该区域绘制矩形，但只有它们适合。即，它们必须是“完整”矩形，而不是部分矩形：唯一的问题是，我不完全确定如何解决这个问题。我会使用HTML5 但不幸的是，这需要尽可能的浏览器友好，但如果它必须是那么就这样吧！