HTML5 ESRI map object

Permanently deleted user

28. Oktober 2014 23:37

I am trying to get a handle on the underlying map service object so I can add handlers for user click events on the map.

Looking at the code for the Cluster renderer in the code gallery (version 1.1) it looks like a map reference could be had via  this.app.map.

How does one go about doing this in version 2.3?  Or is there a better way through the geocortex api?  I tried the MapClickedEvent but it returns the pixels and i would prefer the map coordinates.

 

 

 

 

0

• 

  Permanently deleted user

  29. Oktober 2014 21:55

  I was able to get a handle on the 'map' by subscribing to "SiteServiceLayersLoadedEvent" in the module initialize function which passes in the site object which has getMap()  property.

  From here i can just use the ESRI API.......

  0
• 

  Kevin Penner

  31. Oktober 2014 05:02

  Hi Rob,

  The easiest way to grab the Esri map is to use this.app.map from inside of your module.

  Are you writing typescript or javascript to develop this?

  Edit: The best way to do this is to use the MapClickedEvent published by the viewer and then look in the event payload for the mapPoint property.

  -Kevin

  0
• 

  Permanently deleted user

  31. Oktober 2014 05:28

  Hi Kevin

  I am using TypeScript and i tried this.app.map and i get this error

  error TS2094: The property 'map' does not exist on value of type 'geocortex.framewor

   

  k.application.Application'.

  I am using version 2.3 of the HTML5 viewer.

   

  The following is the code that throws the error.

  ===========================================================================

   

   initialize (configuration: any) {

   

              

   

              this._targetRegion = configuration["targetRegion"];

   

              this._ViewMarkup = configuration["exampleViewMarkup"];            

   

              this.app.commandRegistry.command("CreateBufferView").register(this, this.createView);          

   

              this._Map = this.app.map;

   

      

   

          

   

          }

  ============================================================================

   

  The following is the code that works for me

  ===========================================================================

   initialize (configuration: any) {

   

              

   

              this._targetRegion = configuration["targetRegion"];

   

              this._ViewMarkup = configuration["exampleViewMarkup"];            

   

              this.app.commandRegistry.command("CreateBufferView").register(this, this.createView);

   

              var _this = this;                  

   

            

   

              this.app.eventRegistry.event("SiteServiceLayersLoadedEvent").subscribe(this, function (site) 

   

          {

   

                  _this._Map = site.getMap();                

   

              });

   

          }

   

  ============================================================================

   

   

   

   

   

   

   

   

   

  0
• 

  Kevin Penner

  31. Oktober 2014 05:52

  Awesome, I'm glad to see that you are using Typescript. It rocks!

  Here is a cool trick with Typescript:

  The module here has a base class of ModuleBase which takes a Framework application as a constructor argument. This Framework application lacks the map property. At the point where we construct our module we are using a geocortex.essentialsHtmlViewer.ViewerApplication as the application argument. The base class of ViewerApplication is framework.application.Application.

  The trick here is to add the typing notation - app: geocortex.essentialsHtmlViewer.ViewerApplication; to the top of the class, outside of method scope. Now when you access this.app.map it will resolve as this.app is of geocortex.essentialsHtmlViewer.ViewerApplication type.

  Alternatively, you can use an inline type like this: (<geocortex.essentialsHtmlViewer.ViewerApplication>this.app).map I prefer the first method as it has a class wide effect and you only need to write it once.

  Another trick you'll need to do is use the <any> type on the event payload from that MouseClickedEvent. Example: (<any>eventPayload).mapPoint. This is because the event payload is typed as a <MouseEvent>, but I know it contains a mapPoint property. "Any" gives us the ability to tell the compiler to be quiet, as we know that the property will be there at runtime.

  0

Bitte melden Sie sich an, um einen Kommentar zu hinterlassen.