AnsweredAssumed Answered

typescript

Question asked by umeshmanilal on May 12, 2017
Latest reply on May 15, 2017 by TSolow-esristaff

Hello everyone, I was trying to create a angular 4 application as part of POC, I was able to show esri map, but was not able to display the polygon in the map. Its not throwing any error. Below is the code which I had used. Could you let me know what's wrong in this?

 

export class EsriMapComponent implements OnInit {
  map: __esri.Map;
  mapView: __esri.MapView;
  polyLine: __esri.Polyline;

  @ViewChild('mapViewNode') private mapViewEl: ElementRef;

  constructor(private esriLoader: EsriLoaderService) {
  }

  public ngOnInit() {
    // only load the ArcGIS API for JavaScript when this component is loaded
    return this.esriLoader.load({
      // use a specific version of the JSAPI
      url: 'https://js.arcgis.com/4.3/'
    }).then(() => {
      // load the needed Map and MapView modules from the JSAPI
      this.esriLoader.loadModules([
        'esri/Map',
        'esri/views/MapView',
        'esri/geometry/Polyline',
        'esri/symbols/SimpleLineSymbol',
        "dojo/domReady!"
      ]).then(([
        Map,
        MapView,
        Polyline,
        SimpleLineSymbol
      ]) => {


        let mapProperties: __esri.MapProperties = {
          basemap: 'hybrid'
        };

        let map: __esri.Map = new Map(mapProperties);

        let mapViewProperties: __esri.MapViewProperties = {
          // create the map view at the DOM element in this component
          container: this.mapViewEl.nativeElement,
          // supply additional options
          //center: pointProperties,
          center:[-98, 49.5],
          zoom: 13,
          map: map // property shorthand for object literal

        };

        this.mapView = new MapView(mapViewProperties);

        this.polyLine=new Polyline({
          paths: [
            [-111.30, 52.68],
            [-98, 49.5],
            [-93.94, 29.89]
          ]
        });
      });
    });
  }

Outcomes