terikon / marker-animate-unobtrusive

Google Maps markers become animated, unobtrusively

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Typescript in Ionic 5

msacchetti opened this issue · comments

commented

I followed the install instructions for typescript, and i cannot get it to work in Typescript.

npm install marker-animate-unobtrusive
npm install @types/googlemaps --save
npm install @types/marker-animate-unobtrusive --save

importing nothing, and trying to use it:

pin = new SlidingMarker()
Error: Cannot find name 'SlidingMarker'.ts(2304) any

Trying to import different ways:

import { SlidingMarker } from 'marker-animate-unobtrusive'
Error: /node_modules/@types/marker-animate-unobtrusive/index.d.ts' is not a module.ts(2306)
import { SlidingMarker } from 'SlidingMarker'
error: Cannot find module 'SlidingMarker' or its corresponding type declarations.ts(2307)
commented

I had to do this to get it to work in ionic 5 / TS

    const google = await loader.load()
    var SlidingMarker = require('marker-animate-unobtrusive')
commented

Nevermind, typescript doesnt allow methods on it doing it that way.

 pin = new SlidingMarker({
      position: { lat: lat, lng: lng },
      map,
      duration: 0,
      easing: 'easeOutExpo',
      shape: { coords: [20, 20, 30], type: 'circle' },
      icon: {
        url: 'https://i.ibb.co/4tJxG6c/marker.png',
        size: new google.maps.Size(35, 35),
      },
      optimized: false,
    })

   pin.setDuration(1000)
  error: Property 'setDuration' does not exist on type 'Marker'.t