- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在使用单个图钉创建 map 类型的 Google 图表可视化。
根据How to set zoomLevel in google Visualization Map api? ,我应该能够使用 ZoomLevel 选项来控制初始缩放级别。然而,对我来说,这失败了(代码):
<html>
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("visualization", "1", {packages:["map"]});
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Lat', 'Long', 'Name'],
[12, 77, 'Random location nearby'],
]);
var map = new google.visualization.Map(document.getElementById('map_div'));
map.draw(data, {showTip: true, zoomLevel: 10, mapType: "normal"});
}
</script>
</head>
<body>
<h1>Drop Point Map</h1> <hr />
<div id="map_div" style="width: 99%; height: 85%"></div>
</body>
</html>
如您所见,设置了 zoomLevel: 10
,但我对缩放级别没有运气,默认为最大缩放级别 (19)
关于我缺少什么有什么想法吗?
最佳答案
看起来它没有按照记录工作。可能相关issue in the issue tracker .
确认为错误,将在下一个版本中修复:https://code.google.com/p/google-visualization-api-issues/issues/detail?id=747
作为解决方法,根据该问题,第二次绘制 map 似乎可行:
将此添加到示例中(仅延迟半秒然后重新绘制 map ):
setTimeout(function () {
map.draw(data, {
showTip: true,
zoomLevel: 10,
mapType: "normal"
});
}, 500);
google.load("visualization", "1", {
packages: ["map"]
});
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Lat', 'Long', 'Name'],
[12, 77, 'Random location nearby'], ]);
var map = new google.visualization.Map(document.getElementById('map_div'));
map.draw(data, {
showTip: true,
zoomLevel: 10,
mapType: "normal"
});
setTimeout(function () {
map.draw(data, {
showTip: true,
zoomLevel: 10,
mapType: "normal"
});
}, 500);
}
html, body, #map_div {
height: 100%;
width: 100%;
margin: 0px;
padding: 0px
}
<script src="https://www.google.com/jsapi"></script>
<script src="https://maps.googleapis.com/maps/api/js"></script>
<h1>Drop Point Map</h1>
<hr />
<div id="map_div" style="width: 99%; height: 85%"></div>
您还可以使用 Dr.Molle 在 the question to which you refer 中发布的未记录解决方法(正如他所说的“风险自负”)。
存在时间问题;您必须延迟缩放设置,直到 map 完成渲染。
google.load("visualization", "1", {
packages: ["map"]
});
google.setOnLoadCallback(drawChart);
function drawChart() {
google.visualization.Map.prototype.getMap = function () {
for (var k in this) {
if (this[k].constructor == google.maps.Map) return this[k];
}
}
var data = google.visualization.arrayToDataTable([
['Lat', 'Long', 'Name'],
[12, 77, 'Random location nearby']
]);
var map = new google.visualization.Map(document.getElementById('map_div'));
map.draw(data, {
showTip: true,
zoomLevel: 10,
mapType: "normal"
});
setTimeout(function () {
console.log(map.getMap().getZoom() + ":" + map.getMap().getCenter());
map.getMap().setZoom(12);
}, 500);
}
代码片段:
google.load("visualization", "1", {
packages: ["map"]
});
google.setOnLoadCallback(drawChart);
function drawChart() {
google.visualization.Map.prototype.getMap = function() {
for (var k in this) {
if (this[k].constructor == google.maps.Map) return this[k];
}
}
var data = google.visualization.arrayToDataTable([
['Lat', 'Long', 'Name'],
[12, 77, 'Random location nearby']
]);
var map = new google.visualization.Map(document.getElementById('map_div'));
map.draw(data, {
showTip: true,
zoomLevel: 10,
mapType: "normal"
});
google.maps.event.addListenerOnce(map.getMap(), 'idle', function() {
console.log(map.getMap().getZoom() + ":" + map.getMap().getCenter());
map.getMap().setZoom(12);
});
}
html,
body,
#map_div {
height: 100%;
width: 100%;
margin: 0px;
padding: 0px
}
<script src="https://www.google.com/jsapi"></script>
<script src="https://maps.googleapis.com/maps/api/js"></script>
<h1>Drop Point Map</h1>
<hr />
<div id="map_div" style="width: 99%; height: 85%"></div>
关于javascript - Google Visualization 的 ZoomLevel 参数不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27605081/
我想根据我使用的 visual studio 版本编译不同的东西,比如 #if VISUAL_STUDIO_VERSION > 2015 eventH?.Invoke(this, EventArgs.
在 Visual Studio 2010 中调试并将鼠标悬停在变量名称上时,我可以选择使用 3 种不同的内置可视化工具:文本、XML 和 HTML。 这是我所指的示例: 由于我越来越多地使用基于 JS
我将可视化编程语言理解为允许程序员在屏幕上操作图形(而不是文本)对象以构建功能的语言。 我在 C#、VB 等中看到的最接近的东西是 RAD 控件,但这只是组成 UI 和最简单的功能——甚至与语言本身无
我目前正在使用 Visual Studio 2015 来编程 ASP.NET Core 应用程序。我对安装 Visual Studio 2017 有以下疑问: 什么被认为是最佳实践和/或最干净的方法?
尝试从扩展和更新获取 Visual Studio 扩展时,出现以下错误:- 向 visualstudiogallery.msdn.microsoft.com/Services/VStudio/Exte
我已经开发了Windows服务,并且该服务正在我的帐户下在本地计算机上运行。当我尝试通过在Visual Studio 2008中将其作为一个过程附加该服务来调试该服务时,我得到“无法附加到该过程。 V
作为标准安装的一部分,Visual Studio Code 带有一个名为“Monokai Dimmed”的颜色主题。 有没有办法将它移植到 Visual Studio 2015?我检查了社区主题( h
Visual Studio Community Edition是否可以使用Visual Studio Online帐户上的存储库? 我一直为包含在Online帐户中的Visual Studio Onl
我正在使用文本可视化工具在 Visual Studio 中调试字符串变量。然而,似乎字符串中间的大部分不见了。这背后的原因是什么? 最佳答案 Visual Studio 中的 Text Visuali
我正在开始一个涉及使用多个 SDK 的新项目,包括: 英特尔凌动开发者 SDK 文本转语音 SDK(建议?) 某种网络摄像头和增强现实支持(建议?) 我目前有 2008,但我也可以安装 2010。是否
我想知道,如果我发送一个解决方案文件夹(它是用 visual studio C# 编写的),您可以在 visual studio for mac 中打开解决方案吗? 在visual studio 20
有没有办法在 Visual Studio Code 和 Visual Studio 中设置相同的快捷方式(而不必每次都手动更改它们)? 例如,我在 Visual Studio Code 中经常使用 A
我无法启用 实时可视化树 在 Visual Studio 2017 用于 UWP 应用程序 (C#)。这个工具在 VS2015 上工作,但在 VS2017 中从来没有为我工作过。它对我的 WPF 项目
我刚开始了解 Visual Studio Code。我想知道,我可以将 Visual Studio 替换为所有 .NET 开发相关的工作吗? 我可以节省 Visual Studio 许可的成本吗? V
我安装了具有有效许可证(Visual Studio 订阅)的 Visual Studio 2019 企业版(VS 2019 16.1.4),它运行良好。 突然之间,当我尝试打开项目或项目中的任何文件时
Visual Studio 2015 Pro 提供以下 错误 : error BC36716: Visual Basic 9.0 does not support implicit line cont
我正在我的 PC 中使用 .net Framework 2.0 和 Visual C#(Microsoft Visual Studio 2008)开发 Windows 应用程序。 完成我的项目后,我必
有什么方法可以在启动 VS 时禁用 VA X 并仅在需要时将其重新打开?因为它会导致一些滞后。我似乎在 VS 的选项或 VA 的选项中都找不到该选项。 最佳答案 持shift在 Visual Stud
我可以将 Visual Studio 命令提示符 与免费的 Visual C# Express 一起使用吗? Visual Studio 命令提示符 被引用 here : Run 'Visual St
这很容易成为 Visual Studio 历史上最烦人的“功能”之一,我不明白它为什么存在 -- 曾经 . 为什么 CodePlex 项目需要关心我使用的是什么版本的 Visual Studio? 在
我是一名优秀的程序员,十分优秀!