2

I am trying to make an Angular app which will show the optimised route along with direction of a set of destinations. I installed Azure Maps SDK in my app and started using the APIs. All things are working fine but not the animation API. I am importing maps like this

import * as atlas from 'azure-maps-control';

and then using the animation api as per the documentation:

this.animation = atlas.animation.moveAlongRoute(this.routePoints, this.pin, { 
              

  //Specify the property that contains the timestamp.
              timestampProperty: 'timestamp',

  //Capture metadata so that data driven styling can be done.

  captureMetadata: true,
  
  loop: document.getElementById('loopAnimation'),
  reverse: document.getElementById('reverseAnimation'),
  rotationOffset: (document.getElementById('reverseAnimation'))? 90: 0,
  
  //Animate such that 1 second of animation time = 1 minute of data time.
  speedMultiplier: 60,

  //If following enabled, add a map to the animation.
  map: (document.getElementById('followSymbol'))? this.map: null,

  //Camera options to use when following.
  zoom: 15,
  pitch: 45,
  rotate: true

          });
      });
  });
}

But it is giving the error like

Property 'animation' does not exist on type 'typeof atlas'

I also needed the service module, so I import it from

import * as  atlases from 'azure-maps-rest';

This time by using this import, I was able to use atlases.services module, but now some interface error is coming stating that

Type 'undefined' does not satisfy the constraint 'IBaseGeojson'.

2153 G extends IBaseGeojson = undefined> = D & (G extends undefined ? {

Vega
  • 27,856
  • 27
  • 95
  • 103
ANMOL SHARMA
  • 31
  • 5

1 Answers1

0

You can try adding azure-maps-animations JavaScript file from the dist folder into your project from this link to use with azure maps web sdk.

And for Azure Maps Service Module, atlas-services-ui JavaScript and CSS files and the localization folder from the dist folder into your project from this link.

RKM
  • 1,234
  • 1
  • 4
  • 9
  • Thanks for helping ! I added the JavaScript dist file as well but it is not working i was not able to use the function present in it. Can you Please elaborate some more on how to do it . Should i add all the files or just the dist file can do the job. As i am using should i also download the index.d.ts file as well? – ANMOL SHARMA Oct 07 '21 at 07:42