マップボックスにファイアベースのバックエンドデータを表示する方法

Question

htmlファイルに表示するために、firebaseデータをglシステムにインポートするにはどうすればよいですか？

私はこの例から作業しています：https://www.mapbox.com/mapbox-gl-js/example/heatmap/。私はmap.addSourceとデータのために何を置くべきかわかりません。アドバイスありがとう。あなたのデータはあなたが他を追加するように、このJSONが追加され、firebaseから有効にGeoJSON形式であることが必要

// Initialize Firebase 
var config = { 
apiKey: [key], 
authDomain: "[domain name]", 
databaseURL: "[url]", 
storageBucket: "bitebytes-4d211.appspot.com", 
messagingSenderId: "[id]" 
}; 
firebase.initializeApp(config); 

defaultDatabase = firebase.database(); 
var openedOnce = false 
firebase.auth().onAuthStateChanged(function(user) { 
if (user && !openedOnce) { 
openedOnce = true 
var isAnonymous = user.isAnonymous; 
var uid = user.uid; 
var reportsRef = firebase.database().ref('reports/'); 
reportsRef.on('child_added', function(data) { 
console.log('reports child_added'); 
addPoint(data.val()); 
}); 
} 
}); 

Answer 1

：ここ

は私がGLのために適応したいリーフレットのhtmlファイルからいくつかのコードですgeojsonソースは、マップボックスの例を使用しています。火星基地のデータを構造化する方法はあまりにも多くあります。