谷歌地图fitBounds到特定区域 [英] Google Maps fitBounds into specific area

查看:82
本文介绍了谷歌地图fitBounds到特定区域的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想实现以下目标:将可能分布在大范围纬度的标记数组放入fitbounds方法中,将fitbounds放置在自定义矩形内。



下面的图片应该阐明我想要达到的目标。基本上我有一组标记,我想确保它们始终适合我的页面右侧的一个小框。



白色框包含一些有关的信息对于始终存在的标记,所以我不希望任何标记隐藏在白盒后面,如果我能够定义它们在黑盒子中生存,我很乐意。 (请注意,黑盒只是这个问题的一个可视化参考)。



解决方案

您可以使用containsLocation确保一个点位于一个多边形。请参阅此处



当您穿过阵列中的每个坐标对时,请确认位置在多边形区域内,然后相应地添加到地图中。您也可以为这些点设置一个属性,以定义它们的范围。

  var latlng = new google.maps .latLng(阵列[N]); 
if(google.maps.geometry.poly.containsLocation(latlng,polygon)){
marker = new google.maps.Marker({
position:latlng,
map:地图
});
marker.dataset.box ='blackbox';
} else {
alert('Not in black box');



$ b如果您使用的是HTML5,则可以将数据集属性添加到标记是在多边形内。

  marker.dataset.box ='blackbox'; 

如果不是,您可以使用setAttribute。

  marker.setAttribute('data-box','blackbox'); 


I want to achieve the following: "Place an array of markers that may be distributed across a large range of lat, lng into a fitbounds method that places the fitbounds inside a custom rectangle."

The image below should clarify what I'm trying to achieve. Basically I have an array of markers that I want to make sure always fits within a small box on the right hand side of my page.

The white box contains some information pertaining to the markers, which will always be present, so I don't want any markers hidden behind the white box, and I'd love if I could define that they live within the black box. (Note the black box is just a visual reference for this question).

解决方案

You can use the containsLocation to ensure a point is inside of a polygon. See here.

As you go through each coordinate pair in your array, verify the location is within the polygon area, then add to the map accordingly. You can also set an attribute to those points to "define" what extent they are in.

var latlng = new google.maps.latLng(array[n]);
if (google.maps.geometry.poly.containsLocation(latlng, polygon)){  
     marker = new google.maps.Marker({
         position: latlng,
         map: map
     });
     marker.dataset.box = 'blackbox';
} else {  
     alert('Not inside black box');
}

If you're using HTML5, you can add a dataset attribute to markers that are within the polygon.

marker.dataset.box = 'blackbox';

If not, you can use setAttribute.

marker.setAttribute('data-box', 'blackbox');

这篇关于谷歌地图fitBounds到特定区域的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆