jjzjj

javascript - 在浏览器打印上居中 Google map (V3)

coder 2024-07-24 原文

我将 map 设置为页面宽度的 100%。 map 有一个标记,并以该标记为中心。当我打印浏览器时,我希望 map 保持在标记的中心。这是我为此编写的代码:

var lastPos = map.getCenter();
google.maps.event.addListener(map, "idle", function() {
  lastPos = map.getCenter();
  console.log(lastPos.toString());
});      

google.maps.event.addDomListener(window, "resize", function() {
  google.maps.event.trigger(map, "resize"); 
  map.setCenter(lastPos);
  console.log("Re-center on " + lastPos.toString());
});

这在我调整浏览器大小时有效,但在打印前浏览器自行调整大小时不起作用。如果我的浏览器超过一定宽度,则在打印 map 时标记将完全移出页面(向右)。

这是我的测试用例:http://www-sf.talispoint.com/testmapprint.html

最佳答案

您需要添加一个 @media 打印并在打印时指定 map 的大小,然后您可以执行下面说明的操作。

打印 map 时,会保留左上角并调整 map 以适应 @media 打印尺寸。

如果您希望中心保持不变,您需要手动更改 map 的中心。 http://jsbin.com/owiwox/33是一个关于如何解决这个问题的例子。

它为正在应用的打印媒体事件使用一个监听器,并使用 map 更改(变小)的比率调整 map 的中心

你必须注意的一件事是你可能必须使这个浏览器有针对性地让它在所有浏览器上工作(这个解决方案在 Chrome 中运行良好) 使其跨浏览器工作的一个很好的资源是: http://tjvantoll.com/2012/06/15/detecting-print-requests-with-javascript/

上面示例中的 js 代码监听打印请求并移动 map ,以便左上角与大 map 具有相同的中心。

简而言之,这就是它的工作原理

  1. 您需要输入 map 与打印 map 的比例(或者通过从 JS 中检查它来获取尺寸) 您将其分配给: var 宽度比率 = 2; var heightRatio = 3;

  2. 您监听正在应用的打印媒体并移动中心以使其不变

  3. 完成打印后,您恢复更改。

仍然存在 map 的一部分会被剪切的问题,但是这里没有好的解决方案,因为缩放级别 -1 的图 block 可能不会被缓存,所以当您缩小以适应边界时,您可能会得到没有瓷砖。

关于javascript - 在浏览器打印上居中 Google map (V3),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9419945/

有关javascript - 在浏览器打印上居中 Google map (V3)的更多相关文章

  1. ruby-on-rails - 如何在我的 Rails 应用程序 View 中打印 ruby​​ 变量的内容? - 2

    我是一个Rails初学者,但我想从我的RailsView(html.haml文件)中查看Ruby变量的内容。我试图在ruby​​中打印出变量(认为它会在终端中出现),但没有得到任何结果。有什么建议吗?我知道Rails调试器,但更喜欢使用inspect来打印我的变量。 最佳答案 您可以在View中使用puts方法将信息输出到服务器控制台。您应该能够在View中的任何位置使用Haml执行以下操作:-puts@my_variable.inspect 关于ruby-on-rails-如何在我的R

  2. ruby - 在 Ruby 中用键盘诅咒数组浏览 - 2

    我正在尝试在Ruby中制作一个cli应用程序,它接受一个给定的数组,然后将其显示为一个列表,我可以使用箭头键浏览它。我觉得我已经在Ruby中看到一个库已经这样做了,但我记不起它的名字了。我正在尝试对soundcloud2000中的代码进行逆向工程做类似的事情,但他的代码与SoundcloudAPI的使用紧密耦合。我知道cursesgem,我正在考虑更抽象的东西。广告有没有人见过可以做到这一点的库或一些概念证明的Ruby代码可以做到这一点? 最佳答案 我不知道这是否是您正在寻找的,但也许您可以使用我的想法。由于我没有关于您要完成的工作

  3. ruby-on-rails - 浏览 Ruby 源代码 - 2

    我的主要目标是能够完全理解我正在使用的库/gem。我尝试在Github上从头到尾阅读源代码,但这真的很难。我认为更有趣、更温和的踏脚石就是在使用时阅读每个库/gem方法的源代码。例如,我想知道RubyonRails中的redirect_to方法是如何工作的:如何查找redirect_to方法的源代码?我知道在pry中我可以执行类似show-methodmethod的操作,但我如何才能对Rails框架中的方法执行此操作?您对我如何更好地理解Gem及其API有什么建议吗?仅仅阅读源代码似乎真的很难,尤其是对于框架。谢谢! 最佳答案 Ru

  4. 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发生变化),但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  5. ruby - 如何打印 ruby​​ 对象的实例变量 - 2

    classPacketdefinitialize(name,age,number,array)@name=name@age=age@number=number@neighbors=arrayendendp1=Packet.new("n1",5,2,[1,2,3,4])putsp1.name我有上面的代码,但是每当我执行puts语句时,我都会收到nameisnotamethod的错误。我不知道任何其他方式来打印p1的名称。如何打印姓名? 最佳答案 这里的问题是,虽然您拥有实例变量,但您并未使它们可访问。attr_reader:vari

  6. ruby - 如何打印出 Mechanized 存储的 cookie? - 2

    我正在使用mechanize登录网站,然后检索页面。我遇到了一些问题,我怀疑这是由于cookie中的某些值造成的。当Mechanize登录网站时,我假设它存储了cookie。如何通过Mechanize打印出存储在cookie中的所有数据? 最佳答案 代理有一个cookie方法。agent=Mechanize.newpage=agent.get("http://www.google.com/")agent.cookiesagent.cookies.to_scookie返回一个Mechanize::Cookiesobject

  7. ruby - 强制浏览器下载文件而不是打开文件 - 2

    我要下载http://foobar.com/song.mp3作为song.mp3,而不是让Chrome在其native中打开它浏览器中的播放器。我怎样才能做到这一点? 最佳答案 您只需要确保发送这些header:Content-Disposition:attachment;filename=song.mp3;Content-Type:application/octet-streamContent-Transfer-Encoding:binarysend_file方法为您完成:get'/:file'do|file|file=File.

  8. ruby - 如何以表格格式快速打印 Ruby 哈希值? - 2

    有没有办法快速将表格格式的ruby​​哈希打印到文件中?如:keyAkeyBkeyC...1232343451253474456...其中散列的值是不同大小的数组。还是使用双循环是唯一的方法?谢谢 最佳答案 试试我写的这个gem(在表中打印散列、ruby对象、ActiveRecord对象):http://github.com/arches/table_print 关于ruby-如何以表格格式快速打印Ruby哈希值?,我们在StackOverflow上找到一个类似的问题:

  9. ruby - 404 未找到,但可以从网络浏览器正常访问 - 2

    我在这方面尝试了很多URL,在我遇到这个特定的之前,它们似乎都很好:require'rubygems'require'nokogiri'require'open-uri'doc=Nokogiri::HTML(open("http://www.moxyst.com/fashion/men-clothing/underwear.html"))putsdoc这是结果:/Users/macbookair/.rvm/rubies/ruby-2.0.0-p481/lib/ruby/2.0.0/open-uri.rb:353:in`open_http':404NotFound(OpenURI::HT

  10. ruby - 如何在 watir 测试套件结束时关闭浏览器? - 2

    使用ruby​​的watir测试网络应用程序时,浏览器最后会保持打开状态。网上的一些建议是,要进行真正的单元测试,您应该在每次测试时(在拆卸调用中)打开和关闭浏览器,但这很慢而且毫无意义。或者他们做这样的事情:defself.suites=superdefs.afterClass#Closebrowserenddefs.run(*args)superafterClassendsend但这会导致摘要输出不再显示(诸如“100次测试、100次断言、0次失败、0次错误”之类的内容仍应显示)。我怎样才能让ruby​​或watir在我的测试结束时关闭浏览器? 最佳答案

随机推荐