CODEWITHSUNDEEP
javascriptangularjsfamo.usangular-google-mapsfamous-angular
Iñigo Beitia
Iñigo Beitia

Reputation: 6353

Google Maps inside Famo-us Surface not draggable on mobile

I am running angular-google-maps inside a famous-angular surface as follows: 

<fa-app ng-controller="main.common.hello as ctrl">
    <fa-modifier>
        <fa-surface fa-size="[undefined, undefined]">
            <ui-gmap-google-map center="ctrl.map.center" zoom="ctrl.map.zoom" draggable="true" options="ctrl.options"></ui-gmap-google-map>
        </fa-surface>
    </fa-modifier>
</fa-app>

The map can be panned and zoomed on the browser but when opened on an iPhone, the map is not responsive to touch events. Any ideas on how to fix this?

Upvotes: 0

Views: 177

Answers (2)

Tom
Tom

Reputation: 11

Make sure after you initialize your Engine, you also set the Engine's appMode option to false:

var Engine = require('famous/core/Engine');

Engine.setOptions({
    appMode:false
});

By default, Famo.us assumes you're not using the browser for anything else but a view.

Upvotes: 1

isaldarriaga
isaldarriaga

Reputation: 191

try with this: https://github.com/IjzerenHein/famous-map

famous-map Map component for Famo.us, supporting the following map-providers:

Google Maps Leaflet.js (OpenStreetMap) Famous-map makes it possible for adding a map-component to the famo.us render-tree. Additionally, famous transitions can be used to pan the map and modifiers can be used to sync the position of renderables with a geographical position.

Upvotes: 0

Related Questions