-1

I want to set a GIF image as a map marker representing specific places on the google maps. I have used ionic cordova environment to build the project. Please find the environment setup below:

li packages: 

@ionic/cli-utils  : 1.19.2
ionic (Ionic CLI) : 3.20.0

global packages:

cordova (Cordova CLI) : 7.1.0

local packages:

@ionic/app-scripts : 3.1.6
Cordova Platforms  : android 6.3.0 ios 4.5.4
Ionic Framework    : ionic-angular 3.9.2

System:

ios-deploy : 1.9.2 
Node       : v8.8.1
npm        : 2.15.12 
OS         : macOS High Sierra
Xcode      : Xcode 9.3 Build version 9E145

Environment Variables:

ANDROID_HOME : /Users/MP-36/Users/MP-36/Library/Android/sdk

Misc:

backend : pro

Also, I have used cordova plugin googlemaps to render a map into my app. Plugin Details:

<plugin name="cordova-plugin-googlemaps" spec="^2.3.6">
   <variable name="API_KEY_FOR_ANDROID" value=“#” />
   <variable name="API_KEY_FOR_IOS" value=“#” />
</plugin>

The map renders as expected but from the improvements points of view, I need to add gif image as a marker. I have tried different solutions to satisfy the same but not able to make it.

Solution Tried:

Adding a script tag into the index.html file and setting the optimized property to false.

<script src="http://maps.googleapis.com/maps/api/js?v=3&sensor=false"> 
</script>

var marker = new google.maps.Marker({
        position: myLatlng,
        map: map,
        title: 'Hello World!',
        icon: "https://s3-eu-west-1.amazonaws.com/outsavvy/website/loading.gif",
        optimized: false
});

Result: This would probably work on the web view, not for the Android and iOS platforms. For the Android and iOS platforms, I was able to see the static image i.e the single frame from the GIF image, not the entire animation.

There is any way to add a GIF marker which supports for both the Android and iOS platforms or to create a custom marker and add animation to the same? Can anyone point me in the right direction?

Any help would be really appreciated.

Amey Desai
  • 1
  • 1
  • 1
    check this link, it may help you : https://stackoverflow.com/a/39096058/2919483 – Rajshree Tiwari Jul 24 '18 at 18:38
  • Possible duplicate of [phonegap :: animated gif on gmap](https://stackoverflow.com/questions/39068199/phonegap-animated-gif-on-gmap) – Steven Scott Jul 24 '18 at 20:05
  • @StevenScott I want to set the GIF image through Ionic framework not the phonegap one mentioned in https://stackoverflow.com/questions/39068199/phonegap-animated-gif-on-gmap. Can you please direct me with Ionic. – Amey Desai Jul 25 '18 at 05:12

1 Answers1

0

Answer as author of cordova-plugin-googlemaps. cordova-plugin-googlemaps does not support GIF animated image for marker, because native APIs do not support it.

wf9a5m75
  • 6,100
  • 3
  • 25
  • 59