Web Components

We are creating a new set of WebMAP client-side libraries to use web components platform that also integrates with the changes that are introduced by the new WebMap5 server-side libraries. Basically, there is the need to support Angular Web Components specifically in the first stage of this effort, the Kendo UI for Angular, in order to modernize our web platform and have a new set of encapsulated and easy to use set of components.

Currently we have a simple architecture for components that are based in direct inheritance from the ControlComponent Class as you can see in the next diagram.

The different control's components are based in the Kendo UI for Angular Web components, but there is no limitation in the usage of another components frameworks such as PrimeNG or DevExtreme.

Base Components

Control Component

The WebMAP base components are used to manage general things that all the WebMAP's components must implement. The ControlComponent class for instance is the base class for all the others components and implements the basic properties like:

  • ID: is the WebMap's unique id for this control.

  • Text: Every control that inherits from the System.Windows.Forms.Control has this property.

  • Model: This property contains the control's client-side model that is based in the corresponding WebMap5 projection.

  • Visible: it controls the display value for the current component.

  • Enabled: it controls the enabled value for the current component.

Form Component

The Form Component is the base component for every form that is migrated by WebMap. It can retrieve the corresponding form model from the route parameter that is sent when the navigateToView event is performed. Currently it gets the Id parameter and use the current WebMapService instance to set the form model value from the getModel function that is exposed in that service.

Controls Components

WinForms Components using Kendo UI for Angular

This is the set of components that supports the System.Windows.Forms set of controls using the components that are implemented in the Kendo UI framework. You can find a simple description for each control implementation and it's PME (Properties, Methods, Events) in the following links:

Last updated