如何在Google Maps上显示有关存储在Firebase数据库中的标记的信息

时间:2018-12-15 10:50:38

标签: android google-maps android-studio

我正在尝试获取保存在Firebase实时数据库中的信息,并使用Google Maps API在地图上显示它们。这是我到目前为止的代码。现在,它将打开并使用html5地理位置API向用户显示当前位置,并使用Geofire将经纬度和经度坐标同步到Firebase实时数据库。

firebase

我不知道如何从Firebase检索信息并显示在Google地图上。如果有人可以帮助我,我将非常感激。

    <script>
        // counter for online drivers...
        var loc_count = 0;
        // markers array to store all the markers, so that we could remove marker when any driver goes offline and its data will be remove from realtime database...
        var markers = [];
        var map;
        function initMap() { // Google Map Initialization...
            map = new google.maps.Map(document.getElementById('map'), {
                zoom: 10,
                center: new google.maps.LatLng(1.558490, 103.638183),   //map centered at UTM Skudai


                // mapTypeId: 'terrain'
            });
        }




        // This Function will  add/display that marker on the map
        function AddDriver(data) {


            var LatLng = new google.maps.LatLng(parseFloat(data.val().lat),parseFloat(data.val().lng ));
          // var service = new google.maps.places.PlacesService(data.val().email);

            var marker = new google.maps.Marker({
                //id:service,
                position:LatLng,
                map: map
            });


          //Create a new infowindow object
            var infowindow = new google.maps.InfoWindow({
              content: "The first marker"
            });

          // Attach it to the marker we've just added
          google.maps.event.addListener(marker, 'click', function() {
          infowindow.open(map,marker);
             });

            markers[data.key] = marker; // add marker in the markers array...
            document.getElementById("loc").innerHTML = loc_count;


        }



        // get firebase database reference...
        var locationsRef = firebase.database().ref('lastOnline');

        // this event will be triggered when a new object will be added in the database...
        locationsRef.on('child_added', function (data) {
            loc_count++;
            AddDriver(data);
        });
        // this event will be triggered on location change of any driver...
        locationsRef.on('child_changed', function (data) {
            markers[data.key].setMap(null);
            AddDriver(data);
        });
        // If any driver goes offline then this event will get triggered and we'll remove the marker of that driver...
       locationsRef.on('child_removed', function (data) {
            markers[data.key].setMap(null);
            loc_count--;
            document.getElementById("loc").innerHTML = loc_count;
        });

0 个答案:

没有答案