草庐IT

javascript - 谷歌缩放以适合该页面上的所有标记

coder 2024-07-27 原文

我很难弄清楚这一点,我在这里和互联网上查看了示例,但仍然无法让它工作。我有一张 Google v3 map ,上面显示了英国各地的许多标记。我希望能够设置缩放级别以覆盖所选区域中的所有标记,例如。伦敦可能有 50 个标记,格拉斯哥可能有 2 个...如果两者具有相同的缩放级别,在格拉斯哥页面上看起来会有些奇怪。我已经阅读了一些关于 getBounds() 方法的内容,但我不确定在我的脚本中在哪里以及如何实现它。任何帮助,将不胜感激。到目前为止,这是我的代码。

var gmarkers=[];
var map=null;

function initialize(){

var myOptions={

    zoom:10,<!--would this still be needed-->
    center:new google.maps.LatLng(parseFloat(gmapcentrelat),parseFloat(gmapcentrelong)),                                            mapTypeControl:true,
    mapTypeControlOptions:{style:google.maps.MapTypeControlStyle.DROPDOWN_MENU},
    navigationControl:true,
    mapTypeId:google.maps.MapTypeId.ROADMAP
};
        map=new google.maps.Map(document.getElementById("map_canvas"),
                                        myOptions);


        google.maps.event.addListener(map, 'click', function() {
        infowindow.close()

    });

        // Read the data from example.xml
        downloadUrl(gmapfile,function(doc){
        var xmlDoc=xmlParse(doc);
        var markers=xmlDoc.documentElement.getElementsByTagName("hotel");
        for(var i=0;i<markers.length;i++){

        // obtain the attribues of each marker
        var lat=parseFloat(markers[i].getAttribute("lat"));
        var long=parseFloat(markers[i].getAttribute("long"));
        var point=new google.maps.LatLng(lat,long);
        var star=(markers[i].getAttribute("star"));

        var star_html='';

        if(star>1)
                {star_html='<img src="" alt="star" /><br />'}

                var hotel_id=(markers[i].getAttribute("id"));
                var hotel_name=(markers[i].getElementsByTagName("given_name")[0].firstChild.nodeValue);
                var country=(markers[i].getAttribute("country_id"));
                var city=(markers[i].getAttribute("city_id"));
                var location=(markers[i].getAttribute("location"));
                var filetxt=(markers[i].getAttribute("file_name"));
                var countrytxt=(markers[i].getAttribute("country_name"));
                    countrytxt=countrytxt.toLowerCase();
                    countrytxt=countrytxt.replace(" ","_");
                var citytxt=(markers[i].getAttribute("city_name"));
                    citytxt=citytxt.toLowerCase();
                    citytxt=citytxt.replace(" ","_");

                var html='';

        // create the marker        
        var marker=createMarker(point,html,star,hotel_id)

    }
})
};

    var infowindow=new google.maps.InfoWindow(
{
        size:new google.maps.Size(150,50)
});

function myclick(i){
        google.maps.event.trigger(gmarkers[i],"click")
};

function createMarker(latlng,html,star,hotel_id){
    var contentString=html;
    var marker=new google.maps.Marker({
        position:latlng,
        map:map,

        icon:'http://'+servername+'hotels/graphics/red_'+star+'_star.png',
        zIndex:Math.round(latlng.lat()*-100000)<<5
        });

        google.maps.event.addListener(marker,'click',function(){
        infowindow.setContent(contentString);
        infowindow.open(map,marker)});
        gmarkers[hotel_id]=marker};

最佳答案

利用LatLngBounds .extend() 和 Map .fitBounds()。下面,fullBounds 矩形将增长以包含您创建的标记。然后,当您完成标记创建后,只需将 map 适合该矩形即可。

var fullBounds = new google.maps.LatLngBounds();

for(var i=0;i<markers.length;i++){
  var lat=parseFloat(markers[i].getAttribute("lat"));
  var long=parseFloat(markers[i].getAttribute("long"));
  var point=new google.maps.LatLng(lat,long);

  fullBounds.extend(point);

  ...

}

map.fitBounds(fullBounds);

关于javascript - 谷歌缩放以适合该页面上的所有标记,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6691668/

有关javascript - 谷歌缩放以适合该页面上的所有标记的更多相关文章

  1. ruby - 如何以所有可能的方式将字符串拆分为长度最多为 3 的连续子字符串? - 2

    我试图获取一个长度在1到10之间的字符串,并输出将字符串分解为大小为1、2或3的连续子字符串的所有可能方式。例如:输入:123456将整数分割成单个字符,然后继续查找组合。该代码将返回以下所有数组。[1,2,3,4,5,6][12,3,4,5,6][1,23,4,5,6][1,2,34,5,6][1,2,3,45,6][1,2,3,4,56][12,34,5,6][12,3,45,6][12,3,4,56][1,23,45,6][1,2,34,56][1,23,4,56][12,34,56][123,4,5,6][1,234,5,6][1,2,345,6][1,2,3,456][123

  2. ruby-on-rails - 跳过状态机方法的所有验证 - 2

    当我的预订模型通过rake任务在状态机上转换时,我试图找出如何跳过对ActiveRecord对象的特定实例的验证。我想在reservation.close时跳过所有验证!叫做。希望调用reservation.close!(:validate=>false)之类的东西。仅供引用,我们正在使用https://github.com/pluginaweek/state_machine用于状态机。这是我的预订模型的示例。classReservation["requested","negotiating","approved"])}state_machine:initial=>'requested

  3. ruby - Nokogiri 剥离所有属性 - 2

    我有这个html标记:我想得到这个:我如何使用Nokogiri做到这一点? 最佳答案 require'nokogiri'doc=Nokogiri::HTML('')您可以通过xpath删除所有属性:doc.xpath('//@*').remove或者,如果您需要做一些更复杂的事情,有时使用以下方法遍历所有元素会更容易:doc.traversedo|node|node.keys.eachdo|attribute|node.deleteattributeendend 关于ruby-Nokog

  4. ruby - 获取模块中定义的所有常量的值 - 2

    我想获取模块中定义的所有常量的值:moduleLettersA='apple'.freezeB='boy'.freezeendconstants给了我常量的名字:Letters.constants(false)#=>[:A,:B]如何获取它们的值的数组,即["apple","boy"]? 最佳答案 为了做到这一点,请使用mapLetters.constants(false).map&Letters.method(:const_get)这将返回["a","b"]第二种方式:Letters.constants(false).map{|c

  5. ruby - 在 ASP 页面上 Mechanize 中断 - 2

    require'mechanize'agent=Mechanize.newlogin=agent.get('http://www.schoolnet.ch/DE/HomeDE.htm')agent.clicklogin.link_withtext:/Login/然后我得到Mechanize::UnsupportedSchemeError。 最佳答案 Mechanize不支持javascript但您可以将搜索字段添加到表单并为其分配搜索词并使用mechanize提交表单form=page.forms.firstform.add_fie

  6. ruby - 如何遍历 Ruby 中所有正则表达式匹配的字符串? - 2

    我们有一个字符串:“”这个正则表达式://i如何从当前字符串中获取所有匹配项? 最佳答案 "".scan(//)参见scan在ruby​​-docs上 关于ruby-如何遍历Ruby中所有正则表达式匹配的字符串?,我们在StackOverflow上找到一个类似的问题: https://stackoverflow.com/questions/6857852/

  7. ruby-on-rails - 在所有延迟的作业之前 Hook - 2

    是否可以在所有delayed_job任务之前运行一个方法?基本上,我们试图确保每个运行delayed_job的服务器都有我们代码的最新实例,所以我们想运行一个方法来在每个作业运行之前检查它。(我们已经有了“check”方法并在别处使用它。问题只是关于如何从delayed_job中调用它。) 最佳答案 现在有一种官方方法可以通过插件来做到这一点。这篇博文通过示例清楚地描述了如何执行此操作http://www.salsify.com/blog/delayed-jobs-callbacks-and-hooks-in-rails(本文中描述

  8. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法? - 2

    我遇到了一个非常奇怪的问题,我很难解决。在我看来,我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时,我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性,其中包括href和data-method。再次单击此链接后,我的服务器收到了对新href的请求,但使用的是旧的data-method,即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是,如果我刷新页面,HTML与"new"HTML相同(随返回的JS发生变化),但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  9. ruby - 如何捕获 ruby​​ 中的所有异常? - 2

    我们如何捕获或/和处理ruby​​中所有未处理的异常?例如,这样做的动机可能是将某种异常记录到不同的文件或发送电子邮件给系统管理。在Java中我们会做Thread.setDefaultUncaughtExceptionHandler(UncaughtExceptionHandlerex);在Node.js中process.on('uncaughtException',function(error){/*code*/});在PHP中register_shutdown_function('errorHandler');functionerrorHandler(){$error=error_

  10. ruby-on-rails - prawnto 显示新页面时不会中断的表格 - 2

    我有可变数量的表格和可变数量的行,我想让它们一个接一个地显示,但如果表格不适合当前页面,请将其放在下一页,然后继续。我已将表格放入事务中,以便我可以回滚然后打印它(如果高度适合当前页面),但我如何获得表格高度?我现在有这段代码pdf.transactiondopdf.table@data,:font_size=>12,:border_style=>:grid,:horizontal_padding=>10,:vertical_padding=>3,:border_width=>2,:position=>:left,:row_colors=>["FFFFFF","DDDDDD"]pdf.

随机推荐