个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
26
4
首先，我的数据如下所示:
然后我有一个谷歌地图:
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
center: {lat: 0, lng: 0},
zoom: 3,
styles: [{
featureType: 'poi',
stylers: [{ visibility: 'off' }] // Turn off points of interest.
}, {
featureType: 'transit.station',
stylers: [{ visibility: 'off' }] // Turn off bus stations, train stations, etc.
}],
disableDoubleClickZoom: true
});
}
var firebase = new Firebase("https://dogouttest-1517327924086.firebaseio.com");
我的 firebase 已使用他们提供的代码正确初始化。
这是我的 html :
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://cdn.firebase.com/js/client/2.3.2/firebase.js"></script>
<link type="text/css" rel="stylesheet" href="main.css">
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div id="map"></div>
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyC5fGURVIJKUbxf_zu7EGTWLwM8tLZI-us&libraries=visualization&callback=initMap">
</script>
<script src="https://www.gstatic.com/firebasejs/4.9.0/firebase.js"></script>
<script>
// Initialize Firebase
var config = {
apiKey: "AIzaSyAWk8PNIytV4zzHeeqi_Zos2LcpN1u_9qY",
authDomain: "dogouttest-1517327924086.firebaseapp.com",
databaseURL: "https://dogouttest-1517327924086.firebaseio.com",
projectId: "dogouttest-1517327924086",
storageBucket: "dogouttest-1517327924086.appspot.com",
messagingSenderId: "830022432628"
};
firebase.initializeApp(config);
</script>
<script src="main.js"></script>
</body>
</html>
我不知道如何导入 firebase 数据以将其作为谷歌地图中的标记。
有什么帮助吗？
谢谢:)
最佳答案
首先，从 firebase 数据库中以数组格式检索点。将使用该数组创建标记。为此，您需要一个理由来触发此函数，您将加载数据。假设您将通过按钮或 document.onload 事件触发此事件。无论如何，以下功能将满足您的要求:
function loadPointsFromFirebase (map) { // pass the initialised map to the function
var marker= {};
var db = firebase.database();
db.ref('clicks').ones('value', points => {
points.forEach(point=>{
marker = new google.maps.Marker({
map:map,
position: {
lat: point.val().lat,
lng: point.val().lng
}
})
marker.setMap(map) // Set market on the map
})
})
}
关于javascript - 将地理数据从 Firebase 导入到谷歌地图，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/48565497/
26
4
0
我想知道地理数据、几何数据和数据库系统(例如 Oracle 或 SqlSqerver)中表示空间数据的标准数据类型之间有什么区别？ 对我来说看起来是一样的，但我知道肯定有区别。. 最佳答案 首先，地理
我正在寻找用于存储 map 的理想数据库或数据结构的建议。本质上， map 由“道路”组成，如道路、路径等。道路包含节点(具有纬度和经度坐标，有时还有高度。) 任何此类数据库或结构: 应该能够快速(毫
我最近将一些预装的国家和省份形状下载到 Sql Server 2008 中 http://sqlsamplegeo.codeplex.com/ 除了地理列，每个国家和省都有一个“ShapeArea”和
我对google Analytics（分析）地理如何工作（特别是对于出差用户）有疑问。例如，如果我是森尼韦尔市的用户，并且我打开了一个应用程序，则Google ID在用户ID级别的分析将说用户数= 1
我正在使用 Geo::IP 对 IP 地址执行位置查找。一切正常，直到我遇到一个不在地理 IP 查找数据库中的 IP 地址并且程序突然关闭并给出此错误 Can't call method "city"
通用(或设备无关)物理位置的结构是什么？我的猜测是它可能是一个有两个长字段的结构，或者类似的东西。 此外，给定一个目的地位置和两个候选位置，是否有一种简单的算法可以确定哪个候选位置最接近目的地？我并不
我正在使用 d3 geomaps 创建美国的地理 map 。当我将鼠标悬停在状态上时，我希望突出显示该状态。那可能吗？这是我当前的代码:
在geoviews guide for Bokeh ，它指出 Bokeh 仅支持墨卡托投影，但大多数示例投影使用 PlateCarree，然后输出看起来像墨卡托投影。 有人知道图形的投影和输出是怎么回
我有一个geodataframe'all_locations'，其中有一个几何列和一个带有点名称的列。在 map 上绘制点工作正常，但我想用位置名称注释这些点。 ['位置'] ['几何'] BUITH
我正在尝试在 Canvas 中缩放 map 。 var projection = d3.geoMercator() projection.fitExtent([[margin.left, margin
我目前正在处理这段代码，一切正常，但是当我用鼠标悬停在一个国家/地区时，我只希望国家/地区名称出现在标签中，而不是相关值。我可以这样做吗？如果是，怎么办？ 提前致谢! 这是javascript代码:
我正在尝试在 mac os 上使用 Geodjango，我使用 postgresql 并安装了 GEOS，但出现此错误: dlopen(/usr/local/lib/libgeos_c.dylib,
我正在研究 GeoViews，我想知道我们是否可以将 slider 作为 GeoViews 中等值线图的输入。 我在 gdf 中有另一个变量，它是年份。是否可以使用 slider 显示年度 Tot
我有一个 Geometry (看起来像 WKB) 我的 postgres/postgis 数据库中的对象，我已经转储到 BigQuery 来做一些有趣的事情。我看到它存储为 bytes .我如何构建一
我正在使用 DPM 进行 azure 在线备份，并且想要将冗余从 Geo 更改为 Local，但它显示为灰色。有办法改变吗？ 我不想为此创建新的错误，然后我必须再次将所有内容从 DPM 重新上传到 A
我正在实现 Google 地理 map ，我想做的是，例如，如果我单击 US在 map 上，我会将国家/地区名称作为警报(例如，如果我单击美国，我必须将美国作为警报)，我最终可以将其用作变量。当我尝试
我正在制作一张具有缩放和平移功能的世界地图。我在某些城市上画了圆圈，圆圈的半径由数据决定。当鼠标悬停在这些圆圈上时，将出现一个工具提示来显示数据。 代码结构为 //在此选择上调用缩放行为 - 让我们调
我需要一个函数来计算一对 WGS 84 之间的距离定位到高精度，我计划使用 boost geometry 中的 geographic 函数. boost geometry Design Rationa
我正在尝试缓冲数据集中半径为 100 公里的点。我正在使用函数 gBuffer来自包裹rgeos .这是我到目前为止所拥有的: head( sampledf ) # postalcode
我正在用 C# 开发一个应用程序，它将使用 SQL Server 2008 中的“地理”数据类型来使用和存储地理位置。我计划使用 Entity Framework ，但很快发现它不支持空间数据。有没有
我是一名优秀的程序员,十分优秀！