Google Maps API 3 - 不支持缩放

2024-01-10

我正在尝试开发一个 HTML 页面,通过 Google 地图 API 显示 KML 文件。

页面链接:http://www.slocleanair.org/air/AQI_III/mapTest.html http://www.slocleanair.org/air/AQI_III/mapTest.html

我的问题是,当我用更新的缩放值替换文件时,缩放选项不被遵守。我认为这通常是网络的缓存问题,但 JavaScript 应该添加一个后缀,通过创建唯一的 urlSuffix 来破坏缓存。

var kmlPath = "http://www.slocleanair.org/air/AQI_III/AQI_2015_xx_xx.kml";
// Add unique number to this url - as with images - to avoid caching issues during development
var urlSuffix = (new Date).getTime().toString();
var layer = new google.maps.KmlLayer(kmlPath + '?' + urlSuffix );
layer.setMap(map);

这项技术是否应该允许我引用同名的文件而不从缓存中提取以前的版本?或者这是 Google 地图 API 问题?还是我的编码错误?

代码片段:

var mylocation = {
  'latitude': 35.3,
  'longitude': -120.3
};
var map;

function initialize() {
  var myLatlng = new google.maps.LatLng(mylocation.latitude, mylocation.longitude);
  var mapOptions = {
    zoom: 12,
    center: myLatlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
  // This needs to be the Full URL - not a relative URL
  var kmlPath = "http://www.slocleanair.org/air/AQI_III/AQI_2015_xx_xx.kml";
  // Add unique number to this url - as with images - to avoid caching issues during development
  var urlSuffix = (new Date).getTime().toString();
  var layer = new google.maps.KmlLayer(kmlPath + '?' + urlSuffix);
  layer.setMap(map);
}

google.maps.event.addDomListener(window, 'load', initialize);
#map_canvas {
  margin-left: auto;
  margin-right: auto;
  padding: 0;
  width: 260px;
  height: 180px;
}
<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map_canvas"></div>

如果您不希望地图缩放以适​​合 KmlLayer 内容,请将preserveViewport 选项设置为true。

工作代码片段:

  var mylocation = {'latitude':  35.3,'longitude':  -120.3};
  var map;
  function initialize() {
    var myLatlng = new google.maps.LatLng( mylocation.latitude, mylocation.longitude );
    var mapOptions = {zoom: 12,center: myLatlng,mapTypeId: google.maps.MapTypeId.ROADMAP};
    var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
    // This needs to be the Full URL - not a relative URL
    var kmlPath = "http://www.slocleanair.org/air/AQI_III/AQI_2015_xx_xx.kml";
    // Add unique number to this url - as with images - to avoid caching issues during development
    var urlSuffix = (new Date).getTime().toString();
    var layer = new google.maps.KmlLayer({url:kmlPath + '?' + urlSuffix, preserveViewport: true} );
    layer.setMap(map);
  }

  google.maps.event.addDomListener(window, 'load', initialize);
#map_canvas {margin-left: auto;margin-right: auto;padding: 0;width: 260px;height: 180px;}
<script src="http://maps.googleapis.com/maps/api/js"></script>
<div id="map_canvas"></div>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Google Maps API 3 - 不支持缩放 的相关文章

  • 使用material-ui@next 和 typescript 扩展主题

    创建我的主题时material ui我添加了两个新的调色板选项 为我提供了更好的明暗范围 我已经延长了Theme键入以表明这一点 import Theme from material ui styles import Palette fro
  • JSON字符串转JS对象

    我正在使用 JS 对象通过 Google 可视化创建图表 我正在尝试设计数据源 首先 我在客户端创建了一个 JS 对象 var JSONObject cols id date label Date type date id soldpenc
  • 如何保存 Tensorflow.js 模型?

    我想制作一个创建 保存和训练 tensorflow js 模型的用户界面 但我无法在创建模型后保存模型 我什至从tensorflow js文档复制了这段代码 但它不起作用 const model tf sequential layers t
  • 在带有融合图表的饼图中显示图例

    我想在饼图中显示图例及其值 我用谷歌搜索了很多 但没有得到任何解决方案 此外 融合图表中没有选项可以直接实现这一点 谁能建议我可以应用什么技巧来做到这一点 我想我需要修改库中的很多我不想要的东西 所以请帮助我 Refer below ima
  • PHP 中的 JS charCodeAt 等效项(具有完整的 unicode 和 emoji 兼容性)

    我在 JS 中有一个简单的代码 如果涉及特殊字符 我无法在 PHP 中复制它 这是 JS 代码 参见JSFiddle https jsfiddle net h8oca3qg 5 用于输出 var str t char t and speci
  • 为什么我必须将所有脚本放入 jquery mobile 中的index.html

    我在我的phonegap jquerymobile 项目中使用 mobile changepage 进行重定向 然而让我困惑的是我需要将所有页面的脚本放在同一个文件index html中 如果不是 则重定向页面无法执行其标头中的函数 例如
  • 使用 fadeIn() 时,jQuery“未捕获类型错误:未定义不是函数”;

    我是 JS 新手 正在编写一个基本的富含 jQuery 的网页 其中同一文档中的每个页面都具有淡入 淡出功能 使用具有单独 ID 的相同 div 元素 无论如何 当我尝试淡入当前页面时 我收到错误 未捕获的类型错误 未定义不是函数 我在网上
  • 仅当 url 以 www 为前缀时才会发生 CORS 错误

    我目前遇到一个关于 CORS 跨源资源共享 的问题 奇怪的是 只有当我使用 www url 前缀时 才会出现这种情况 例如 当我使用以下网址访问我的网站时 http example com index http example com in
  • console.log 是如何工作的?

    第一个例子 在以下示例中 http jsfiddle net maniator ScTAW 4 http jsfiddle net maniator ScTAW 4 我有这个js var storage function var store
  • 在 Fabric.js 中进行裁剪的“toDataURL”函数中,Multiplier 属性无法正常工作

    我的原始尺寸canvas is 800X700 我在用clipTo要在画布的选定部分中工作 var rect new fabric Rect left 100 top 50 fill fff width 376 height 602 str
  • 获取 Firebase AngularFire 中项目的索引 ID

    这里提出了类似的问题 但接受的答案并没有真正回答这个问题 使用 AngularFire 是否可以创建关系型数据库 或者访问 UniqueID https stackoverflow com questions 16879484 using
  • 在 forEach() 中使用 `this` [重复]

    这个问题在这里已经有答案了 免责声明 我正在学习 JavaScript 我有一个像这样的对象构造函数 var Palette function this colors red green blue this getColorCombinat
  • 如何按日期升序对对象进行排序?

    如果我有一个对象列表 var objectList LIST OF OBJECT each object列表中包含三个属性 name date gender 如何按 对列表中的对象进行排序date 属性升序 the date 属性包含字符串
  • Google 地图 - 如何获取空白底图

    我想要一个空白的谷歌地图 没有任何显示路线图 地形 混合或卫星数据的底图 只有一个白色背景来仅显示我的图层 那可能吗 hexblot 的建议是正确的 即查看自定义地图类型文档 这是我在没有任何控制的情况下获得空白地图 白色背景 所做的事情
  • 当 eslint 从子文件夹运行时无法解析相对模块路径

    当我从存储库的根文件夹运行 eslint 时 一切运行正常 没有错误 但是当我从子文件夹运行时 我会得到大量导入 未解决的问题 而当我从根目录运行时则不会发生这种情况 reporoot subfolder0 subfolder1 MyFil
  • d3 序数尺度的映射

    我正在使用 D3 的序数比例将数字映射到颜色 我用过这个 color d3 scale ordinal range 1f77b4 ff7f0e 2ca02c d62728 9467bd 8c564b e377c2 domain 0 6 co
  • 使用 System.js 导入 Typescript 编译的模块时出错

    我最近正在学习使用 system js 导入由 Typescript 编译的模块 这些模块之前是为 require js 编译的 并且工作正常 但是合并到system js时 应用时无法导入模块系统生产 js 控制台说 Uncaught i
  • Chrome 和 IE 上的滚动/延迟事件

    我试图让用户始终看到一个内容块 即使他向下滚动页面也是如此 他还应该能够上下滚动内容块 这是一个精简版本的小提琴 向您展示我的意思 http jsfiddle net 9ehfV 2 http jsfiddle net 9ehfV 2 人们
  • 如何创建浏览器插件?

    我必须创建一个插件 当用户将鼠标悬停在某些术语上时 该插件必须显示信息 谁能告诉我如何做的方向 我对创建插件没有太多想法 我知道我想要做的事情可以通过java脚本来完成 但是java脚本文件可以作为浏览器插件安装吗 任何对此的想法将不胜感激
  • 如何从 vue 组件调用 App.vue 中的方法

    我有一个 vue 组件和一个 vue 元素声明 如下所示 Vue component todo item template li This is a todo li methods test function I am getting an

随机推荐

  • memcached可以用来加锁吗?

    memcached可用于缓存静态数据 这可以减少数据库查找 并且通常不会memcached get id and memcached set id 但是 将其用于锁定机制可以吗 做memcache set and memcached get
  • php 中的友元函数?

    php是否像c 一样支持友元函数 您很可能指的是类 变量范围 在 PHP 中 你有 public private 受保护的 But not friend能见度 这protectedwhile 当要使对象的成员仅对其他扩展 继承对象可见时使用
  • 这个 Objective-C/XCode 注释是什么 // [START_EXCLUDE]

    查看 iOS 上 GCM 通知的示例代码 https github com googlesamples google services blob master ios gcm GcmExample AppDelegate m L31 htt
  • 在 Yii 中何时使用组件以及何时使用扩展?

    我对 protected 中组件和扩展文件夹的用途有点困惑 请澄清 根据我对 Yii 的一点经验 组件是可以帮助您根据模型编写业务逻辑的类 您肯定不想在控制器中编写所有工作 那么您需要组件来分发代码并在控制器中调用它 扩展就像库一样 基本上
  • 使用 fxml (scenebuilder)制作的进度条来使用方法中的值[重复]

    这个问题在这里已经有答案了 我希望进度条显示返回双值的方法的值 但它不起作用 但我认为这不是主要问题 即使我只使用特定的数字 它也不起作用 请帮助我 提前致谢 这是一个具体的问题 所以我搜索了 cery 很长时间没有结果 所以如果你知道更好
  • nAnt 删除超过 7 天的文件

    我想创建一个目标来清理特定文件夹中超过 7 天的日志文件 当我尝试在文件集中放入 日期 元素时出现错误 我该怎么办
  • 更新单个表的多行

    我需要更新超过 60k 行的表的每一行 目前我正在这样做 public void updateRank Map
  • 超类型-子类型数据库设计

    我有一个关于关系数据库中超类型子类型设计的问题 如果我有一个带有两个子类型表的超类型 我会将与两个子类型表的 PK 相关的超类型的 PK 作为 FK 假设我有这样的事情 Type 类型 ID PK 超级类型 身份验证 类型ID FK Sub
  • CMake 中的布尔变量取反?

    假设我在 CMake 中设置以下变量 set foo TRUE 现在 我想定义一个bar具有相反布尔值的变量foo 换句话说 在这种情况下 我想要bar to be FALSE 或等价物 例如false or 0 完成此操作的一种方法是 i
  • 一起部署 DotNetNuke 和单独的 ASP.NET 应用程序 - 可能的问题?

    我这样做是为了积极主动地尝试阻止由此可能产生的任何潜在问题 情况是 我们正在为客户开发一个 ASP NET 应用程序 该应用程序将处理客户的在线订购 该应用程序将使用与其当前 WinForms 应用程序使用的相同数据库 这里没有真正的问题
  • python中的用户指针

    我正在尝试显示使用 v4l 捕获的网络摄像头的预览 下面是代码的大概样子 from ctypes import from v4l2 import from Image import fromstring from Tkinter impor
  • 嵌套构造函数。为什么需要它?

    class Character Entity def init self x y hp Entity init self x y self hp hp self items Character是父类的子类Entity Entity类还有一个
  • SecurityException:无法为用户 0 找到提供者 null;在 Android 8.0 上的 ActiveAndroid 上

    我有一个使用 ActiveAndroid 的应用程序 它运行良好 然而 现在 当我尝试将模型保存到数据库时 我收到 SecurityException 堆栈是 Error saving model java lang SecurityExc
  • 按下 ESC 时关闭灯箱

    我试图在按下转义键时关闭灯箱 但弹出窗口没有关闭 document keypress function e if e keyCode 27 popupStatus 1 disablePopup 这是完整的代码 var popupStatus
  • HTML5 和 CSS - 媒体查询运算符问题

    我想知道是否有人可以用简单的术语解释下面示例中的每个媒体查询的含义 这是示例 media not screen and color media projection screen and color media only projectio
  • 录制红色状态栏上的自定义文本

    我的应用程序在 Info plist 中被标记为 VoiP 和 Audio 因此当后台发生任何录制时 红色状态栏会出现并显示文本 Recording 我想知道是否可以修改此文本 我到处搜索 但在文档中找不到与之关联的参数 Thanks 看起
  • UWP Windows 应用商店应用上的 TLS 客户端证书身份验证

    我正在尝试连接到使用 TLS 进行客户端证书身份验证的服务器 下面是一个代码片段 async Task TestClientCertAuth int iWinInetError 0 Uri theUri new Uri http xxx x
  • VS 2012 上的 LLVM 3.4 链接器错误

    我已经使用 Cmake 从源代码构建了 LLVM 3 4 我参考了使用 Microsoft Visual Studio 进行安装的 LLVM 系统入门文档 我现在想在我自己的项目中使用 LLVM 我已经使用以下命令在 VS 2012 中添加
  • 在 hadoop 中使用 Pig 中的正则表达式

    我有一个包含用户 tweetid tweet userid 的 CSV 文件 396124436476092416 Think about the life you livin but don t think so hard it hurt
  • Google Maps API 3 - 不支持缩放

    我正在尝试开发一个 HTML 页面 通过 Google 地图 API 显示 KML 文件 页面链接 http www slocleanair org air AQI III mapTest html http www slocleanair