Newbie question: Use Mapillary-JS in Angular2 MapboxGLJS project, how to import?

Hi there,

I’m new to the Mapillary.

I try to use the mapillary-js in my angular2 based mapbox GL-JS project. However, the import typescript causes a lot of conflictions with the existing libraries. I want to import { View } from ‘mapillary-js’. I’m assuming I need to exclude certain libraries since they’re already in my projects. Is there any example for using mapillary-js with angular 2 MapboxGL project? How to import the type definition?

Hey @ema,
depending which version of Angular2 you’re using (rc-* or stable) you have to import mapillary-js (either through system-js or Webpack as a global on window (either minified or not) and declare type definitions yourself; unfortunately we don’t generate them yet alongside mapillary-js. We don’t support code splitting and tree shaking yet, the libraries have to be included twice.
I know this is not optimal, but we have it on a roadmap to get the typedefs in and proper typescript imports, so everything will be simpler soon. Please check https://github.com/mapillary/mapillary-js/releases every now and then. The support for that should land soon.

For now, the following typedef should get you started

declare namespace mapillaryjs {
  export class Viewer {
    constructor(viewerId: string, cliendId: string, imageKey: string, options?: any);
  }
}

declare module 'mapillary-js' {
  export = mapillaryjs;
}

Hello,

I tried the type definition provided. It’s getting this error:

Error in :0:0 caused by: Cannot read property 'classList' of null . 

I tried the simplest constructor in my Angular2 app as following.

this.mly = new Viewer(
			'mly',
                       '......',
			'.......');

I was also periodically checking the mapillary-js project, but it seems there is no update on the type definition for Angular2. Could you shed in some lights?

Hi @ema. I created a repository for you to check out. It uses a lot of other tools around just angular, but the important things are in this commit. We are tracking the issue here. Good luck!

Thank you for quick response! Actually I just realized that error I posted earlier “Cannot read property ‘classList’ of null” . is not related to the type definition. It’s related to the constructor of the Viewer, which a separate issue. The mapillary was imported correctly.

1 Like