خرید بک لینک

Vote count: 0

I have a html page that uses Firebase to get updated geolocation data. that data is then used to update a marker in a google map. The map works fine (map renders, and markers move accordingly) in the chrome browser on a laptop, but when I visit the same link on my iphone safari browser, I do not receive the updated marker positions.

In the iphone Safari browser, the map renders, displays the start marker, destination marker, and the current position marker. But when firebase it is time to fire off a current position marker change, nothing happens.

I know the location data is accurate,and being sent, as it works on the laptop. but for some reason, the setPosition function does not seem to be firing correctly on the mobile browser. Below is the relevant javascript. I left out user specific information just because...well, this is the inteet. Would anyone have an idea as to why setPosition doesnt update the currentPosition Marker when being displayed in mobile devices?

 <script>
    var styles1 = code omitted for simplicity

    var map;
    var userLocationMarker;
    var userDestinationMarker;
    var HakiFirebaseRef = new Firebase("https://leftOutOnPurpose");
    var WMBHakiFirebaseRef;
    var user;

    function initialize(){
        this.initMap();
        if (isWatchMyBackClient()) {
            uuid = getClientUuid();
            setFirebaseData(uuid);
        }

    }

    function initMap(){
        styledMap = new google.maps.StyledMapType(styles1, {name:"Blizzard Haki"});
        mapOptions = {
            zoom: 13,
            center: new google.maps.LatLng(48.864716, 2.349014),
            // center: LatLng, //should be firebase longLat
            mapTypeControlOptions: {
                mapTypeIds: [google.maps.MapTypeId.ROADMAP, 'blizzard_style']
            }
        };
        map = new google.maps.Map(document.getElementById('wmbMap'), mapOptions);
        //Associate the styled map with the map type id
        map.mapTypes.set('blizzard_style', styledMap);
        map.setMapTypeId('blizzard_style');
    }

    /**********************/
    /*  HELPER FUNCTIONS  */
    /**********************/
    function isWatchMyBackClient(){
        //check for a uuid in the header
        var query = window.location.search;

        if (query.indexOf("?") !== -1){
            retu true;
        }
        retu false;
    }

    function getClientUuid(){
        var uuid = "";
        var queryUrl =  window.location.search;
        uuid = queryUrl.slice(1);

retu uuid;
    }

    function setFirebaseData(uuid){
        WMBHakiFirebaseRef = HakiFirebaseRef.child("WMB").child(uuid);
        WMBHakiFirebaseRef.once("value", function(userdata){
            user = userdata.val();
            if(userdata.val() !== null){
                setUserMarker(userdata.val());
                setDestinationMarker(userdata.val());
                watchUser();
            } else {
                console.log("Could not get user data")
            }
        });
    }

    function setUserMarker(userData){
        var myLatlng = new google.maps.LatLng({lat: userData.latitude, lng: userData.longitude});
        var infoWindow = new google.maps.InfoWindow({
            content: "starting location"
        });
        var greenPin = '/images/green-pin.png';
        var markers = new google.maps.Marker({
            position:myLatlng,
            map: map,
            title: 'starting Location',
            icon: greenPin
        });
        google.maps.event.addListener(markers, 'click', function() {
           infoWindow.open(map,markers);
        });

    }

    function setDestinationMarker(userData){
        var infoWindowd = new google.maps.InfoWindow({
            content: "My Destination"
        });
        var destpin = '/images/destpin.png';

        destMarker = new google.maps.Marker({
            position: new google.maps.LatLng(userData.dest_latitude,userData.dest_longitude),
            map: map,
            title: 'My Destination',
            icon: destpin
        });
        google.maps.event.addListener(destMarker, 'click', function() {
           infoWindow.open(map, destMarker);
        });
        destMarker.addListener('click', function() {
            infoWindowd.open(map, destMarker);
        });
    }

    function watchUser() {
        WMBHakiFirebaseRef.on('value', function(userData) {
            user = userData.val();
            var latLng = new google.maps.LatLng(user.latitude,  user.longitude);
            var destLatLng = new google.maps.LatLng(user.dest_latitude,  user.dest_longitude);
            updateUserMarker(latLng);
            updateDestinationMarker(destLatLng);

        });

    }

    function updateUserMarker(latLng){
        if(!userLocationMarker) {
            var image = '/images/currLocBtn.png';
            var userInfoWindow = new google.maps.InfoWindow({
                content: 'Current Location'
            });
            userLocationMarker = new google.maps.Marker({
                map: map,
                title: 'Current Location',
                icon: image
            });
            google.maps.event.addListener(userLocationMarker, 'click', function() {
               userInfoWindow.open(map, userLocationMarker);
            });
        }
        //update info window here later
        userLocationMarker.setPosition(latLng);
    }

    function updateDestinationMarker(destLatLng){
        destMarker = new google.maps.Marker({
            map: map
        });
        destMarker.setPosition(destLatLng);

    }

</script>

asked 22 secs ago

برچسب: نویسنده: استخدام کار تاريخ: دوشنبه 14 تير 1395 ساعت: 2:25

صفحه بندی