Jump to: navigation, search

Difference between revisions of "HowTo:Create Image Map Overlays"


(Create a map overlay document)
 
(32 intermediate revisions by 3 users not shown)
Line 1: Line 1:
 
Image map overlays will be visualized as base maps in the map activity of the client. These are images (.png) that will be vizualized on the right location, with the right scale and also with the right rotation. Therefore georeferencing of the image is required.
 
Image map overlays will be visualized as base maps in the map activity of the client. These are images (.png) that will be vizualized on the right location, with the right scale and also with the right rotation. Therefore georeferencing of the image is required.
  
== Basics ==
+
Configuration of the image map overlay requires two steps:<br/>
 
+
To configure the image map overlay two steps are required:<br/>
+
 
# '''Georeferencing of the image'''
 
# '''Georeferencing of the image'''
 
#* This is necessary to generate the required parameters.
 
#* This is necessary to generate the required parameters.
#* Prefered Software: [http://www.google.com/earth/download/ge/agree.html | Google Earth]
+
#* Prefered Software: [http://www.google.com/earth/download/ge/agree.html Google Earth]
#* How to add a map overlay to Google Earth is available there: [https://support.google.com/earth/answer/148099#createoverlay | Add a Map Overlay (Google How To German)]
+
#* How to add a map overlay to Google Earth is available under [https://support.google.com/earth/answer/148099#createoverlay Add a Map Overlay (Google How To German)]
 
# '''Configuration of the Image Map Overlay in UBIK Studio'''
 
# '''Configuration of the Image Map Overlay in UBIK Studio'''
#* The MapOverlys are based on a File Documents, so basicly should contain the properties for the classification  [[SYSCLS DOCUMENT | Document]], [[SYSCLS FILEDOCUMENT | Filedocument]] and [[SYSCLS_MAPOVERLAY | MapOverlays]]
+
#* The Map Overlays objects are based on file documents, hence must  implement properties of the classifications [[SYSCLS DOCUMENT | Document]], [[SYSCLS FILEDOCUMENT | Filedocument]] and [[SYSCLS_MAPOVERLAY | MapOverlays]]
  
= GIS Software =
+
= Georeferencing (GIS Software) =
There are a lot of possibilities to georeference a map overlay. For image map overlays [http://www.google.com/earth/download/ge/agree.html | Google Earth] is the fastest way to extract the required parameters.
+
There are many possibilities to georeference a map overlay. For image map overlays [http://www.google.com/earth/download/ge/agree.html Google Earth] is the fastest way to extract the required parameters.
This How To is a small introduction for adding a Map Overlay to Google Earth and capturing the parameters for UBIK Studio.
+
This How-To is a short introduction for adding a Map Overlay to Google Earth and capturing the parameters for {{UBIK Studio}}.
 
# Prepare an image map overlay  
 
# Prepare an image map overlay  
#*The map overlay should be a .png Image of the building scheme.
+
#*The map overlay should be a .png image of the building scheme.
 
# Add the map overlay to the basemap
 
# Add the map overlay to the basemap
#* Tutorial of Google Earth: [https://support.google.com/earth/answer/148099#createoverlay | Add a Map Overlay (Google How To German)]
+
#* Tutorial of Google Earth: [https://support.google.com/earth/answer/148099#createoverlay Add a Map Overlay (Google How To German)]
 
# Extract the required parameters:
 
# Extract the required parameters:
#* WIDTH_METERS: The width of the image in meters. Please use the measurement tool of Google Earth: [https://support.google.com/earth/answer/148134?hl=en | Measuring distances and areas][[File:UI GoogleEarthImageEditing.PNG|thumb|alt=Rotation Parameter|Rotation Parameter in the Editing dialog of Google Earth]]
+
#* '''WIDTH_METERS''': The width of the image in meters. Please use the measurement tool of Google Earth: [https://support.google.com/earth/answer/148134?hl=en Measuring distances and areas]<br/>[[File:UI_Width_inMeters.PNG|400 px|border|alt=View|View]]
#* ROTATION_CLOCKWISE_DEGREES: The rotation can be extracted by using the editing tool of Google Earth for image map overlays.{{Clear}}
+
#* '''ROTATION_CLOCKWISE_DEGREES''': The rotation can be extracted by using the editing tool of Google Earth for image map overlays.<br/>[[File:UI_GoogleEarthImageEditing.PNG|400 px|border|alt=View|View]]
#*LOCATION_CENTER: To extract this parameter it is required to use the Placemark tool of Google Earth and locate the placemark in the center of the image. How to use a placemark tool: [https://support.google.com/earth/answer/148142?hl=en | Creating a new placemark]
+
#*'''LOCATION_CENTER''': To extract this parameter it is required to use the Placemark tool of Google Earth and locate the placemark in the center of the image. How to use a placemark tool: [https://support.google.com/earth/answer/148142?hl=en Creating a new placemark]
#** The location can be extracted by using the editing mode of the placemark.  
+
#** The location can be extracted by using the editing mode of the placemark.<br/>[[File:UI_LocationCenter.PNG|900 px|border|alt=View|View]]
{{Attention|Please use the Google Earth Show Lat/Long setting with Decimal Degrees [[https://support.google.com/earth/answer/148070?hl=en| HowTo: Viewing preferences]] }}
+
  
= Studio =
 
== Create a map overlay document ==
 
The following steps are required to create a Map Overlay Document: <br/>
 
#To ease up the work of the customizer we suggest to derive a new object from the '''[[SYSCLS FILEDOCUMENT | FILEDOCUMENT]]'''. The properties are visible in the ''[[Class_Details | Class Details]]''.
 
#Add the Classification [[SYSCLS_MAPOVERLAY | MapOverlays]] to the new MetaClass by using the [[Relation_Editor | Relation Editor]]
 
#Define the required Metaproperties for the '''[[SYSCLS_MAPOVERLAY | MapOverlays]]'''
 
#*HowTo:[[HowTo:Create_a_new_MetaProperty |Create a new MetaProperty]]<br/>[[File:UI_MetaPropertiesMapOverlay.PNG|990 px|border|alt=View|View]]
 
#Add the required '''[[Metaproperty | MetaPropertys]]''' to the '''[[MetaClass| Meta Class]]'''.
 
#*HowTo: [[HowTo:Add_a_MetaProperty_to_a_MetaClass | Add a Metaproperty to a Metaclass]]<br/>[[UI Properties MapOverlay.PNG|990 px|border|alt=View|View]]
 
#Save the object with {{key press|Ctrl|S}}
 
#Build and Release the Customizing {{key press|F5}}
 
# Check the Classification in the ''[[Object Explorer | Object Explorer]]''
 
  
[[Category:Document|Image Map Overlays]]
+
{{Attention|Please use the Google Earth Show Lat/Long setting with Decimal Degrees [[https://support.google.com/earth/answer/148070?hl=en HowTo: Viewing preferences]]. }}
[[Category:How-To|Image Map Overlays]]
+
[[Category:Pages with broken file links|Image Map Overlays]]
+
  
== Publish the map overlay ==
+
= Studio =
To publish the Image Map Overlay to the UBIK.Android Client it is required to configure the [[Application_Context_Management | ACM]].<br/>
+
=== Add an Image Map Overlay ===
#Create a '''[[METACLASSSCOPE| METACLASSSCOPE]]''' for the Image Map Overlay Meta Class<br/>
+
To add a Map Overlay it is required to take the parameters from the georeferenced Map Overlay Image:
#* HowTo: [[HowTo:Create_a_new_MetaClassScope | Create a Metaclass Scope]]<br/>
+
# Navigate to the [[MetaClass]] ''IMAGEMAPOVERLAY'' via the ''[[Class Browser]]''<br/> [[File:IMagemapoverlay.PNG|220 px|border]]
# Assign the Properties to the Metaclass Scope<br/>
+
# Create a new object in the {{Bulk Editor}}
#* Required Properties for the ACM:
+
#* Choose the Filetype (PNG)
 +
#* Set a '''Name''' and '''Description'''
 +
#* Select the image in the Bulk Editor (FULLPATH)
 +
#* Set '''Is Local''' to TRUE
 +
#* Set the '''Location Center''' by filling out the '''[[SYSCLS GEO|Geo Property]]''' <br/>[[File:UI_ExampleObjects_BulkEditor.PNG|990 px|border|alt=View|View]]
 +
#* Set the '''Rotation Clockwise Degree'''
 +
#* Set the '''Width''' (in Meters)
 +
#* Set the '''Z-Level''' (Default: 0)
 +
# Save the object with {{key press|Ctrl|S}}
 +
 
 +
=== Publish the Map Overlay ===
 +
To publish the Image Map Overlay to the {{UBIK}} client the [[Application_Context_Management | ACM]] has to be configured:
 +
#Create a [[METACLASSSCOPE]] for the Image Map Overlay MetaClass
 +
#* HowTo: [[HowTo:Create_a_new_MetaClassScope]]
 +
# Assign the Properties to the Scope
 +
#* Required Properties within the ACM:
 
#** ''WIDTH_METERS''
 
#** ''WIDTH_METERS''
 
#** ''Z_LEVEL''
 
#** ''Z_LEVEL''
Line 53: Line 51:
 
#** ''LOCATION_CENTER''
 
#** ''LOCATION_CENTER''
 
#** ''FILETYPE''
 
#** ''FILETYPE''
# Add the Metaclassscope to the Context<br/>
+
# Relate the MetaClassCcope to the according [[CONTEXT]]
 
# Save the object with {{key press|Ctrl|S}}
 
# Save the object with {{key press|Ctrl|S}}
# [[Release_MetaDefinitions | Release the MetaDefinitions]]
+
# [[HowTo:Release_MetaDefinitions| Release the MetaDefinitions]]
 
# Check the Classification in the ACM Manager
 
# Check the Classification in the ACM Manager
  
== Add an image map overlay ==
+
=== Add Image Map Overlay to Infrastructure ===
To add a Map Overlay it is required to take the parameters from the georeferenced Map Overlay Image
+
To finally display the image overlay on the client it is necessary to put it right into the application's infrastructure.
# Add a new Object in the Bulk Editor
+
# Open the according [[CONTEXT]] in the ''[[Relation Editor | Relation Editor]]''
#* Choose the Filetype (PNG)
+
# Add the newly created overlay object per drag and drop, from the [[MetaClass]] ''IMAGEMAPOVERLAY'', to ''"Infrastructre objects"'' ([[SYSREL INFRASTRUCTURE|SYSREL INFRASTRUCTURE]]) <br/> [[File:ImageToACM.PNG|330 px|border]]
#* Add NAME and DESCRIPTION
+
# Save the project with {{key press|Ctrl|S}}
#* Assign the image in the Bulk editor (FULLPATH)
+
The image map overlay has been added to your application.
#* Set Is Local? to TRUE
+
# Save the object with {{key press|Ctrl|S}}
+
 
+
 
<headertabs />
 
<headertabs />
  
[[Category:Document|Image Map Overlays]]
+
 
[[Category:How-To|Image Map Overlays]]
+
== See also ==
[[Category:Pages with broken file links|Image Map Overlays]]
+
* [[SYSCLS_MAPOVERLAY]]
 +
 
 +
[[Category:Document|Create Image Map Overlays]]
 +
[[Category:How-To|Create Image Map Overlays]]
 +
[[Category:Publishing|Create Image Map Overlays]]

Latest revision as of 09:52, 6 December 2019

Image map overlays will be visualized as base maps in the map activity of the client. These are images (.png) that will be vizualized on the right location, with the right scale and also with the right rotation. Therefore georeferencing of the image is required.

Configuration of the image map overlay requires two steps:

  1. Georeferencing of the image
  2. Configuration of the Image Map Overlay in UBIK Studio
[edit]

Georeferencing (GIS Software)

There are many possibilities to georeference a map overlay. For image map overlays Google Earth is the fastest way to extract the required parameters. This How-To is a short introduction for adding a Map Overlay to Google Earth and capturing the parameters for UBIK® Studio.

  1. Prepare an image map overlay
    • The map overlay should be a .png image of the building scheme.
  2. Add the map overlay to the basemap
  3. Extract the required parameters:
    • WIDTH_METERS: The width of the image in meters. Please use the measurement tool of Google Earth: Measuring distances and areas
      View
    • ROTATION_CLOCKWISE_DEGREES: The rotation can be extracted by using the editing tool of Google Earth for image map overlays.
      View
    • LOCATION_CENTER: To extract this parameter it is required to use the Placemark tool of Google Earth and locate the placemark in the center of the image. How to use a placemark tool: Creating a new placemark
      • The location can be extracted by using the editing mode of the placemark.
        View


IC Attention.pngPlease use the Google Earth Show Lat/Long setting with Decimal Degrees [HowTo: Viewing preferences].

Studio

Add an Image Map Overlay

To add a Map Overlay it is required to take the parameters from the georeferenced Map Overlay Image:

  1. Navigate to the MetaClass IMAGEMAPOVERLAY via the Class Browser
    IMagemapoverlay.PNG
  2. Create a new object in the Bulk Editor
    • Choose the Filetype (PNG)
    • Set a Name and Description
    • Select the image in the Bulk Editor (FULLPATH)
    • Set Is Local to TRUE
    • Set the Location Center by filling out the Geo Property
      View
    • Set the Rotation Clockwise Degree
    • Set the Width (in Meters)
    • Set the Z-Level (Default: 0)
  3. Save the object with Ctrl+S

Publish the Map Overlay

To publish the Image Map Overlay to the UBIK® client the ACM has to be configured:

  1. Create a METACLASSSCOPE for the Image Map Overlay MetaClass
  2. Assign the Properties to the Scope
    • Required Properties within the ACM:
      • WIDTH_METERS
      • Z_LEVEL
      • ROTATION_CLOCKWISE_DEGREES
      • LOCATION_CENTER
      • FILETYPE
  3. Relate the MetaClassCcope to the according CONTEXT
  4. Save the object with Ctrl+S
  5. Release the MetaDefinitions
  6. Check the Classification in the ACM Manager

Add Image Map Overlay to Infrastructure

To finally display the image overlay on the client it is necessary to put it right into the application's infrastructure.

  1. Open the according CONTEXT in the Relation Editor
  2. Add the newly created overlay object per drag and drop, from the MetaClass IMAGEMAPOVERLAY, to "Infrastructre objects" (SYSREL INFRASTRUCTURE)
    ImageToACM.PNG
  3. Save the project with Ctrl+S

The image map overlay has been added to your application.


See also