Oracle Policy Modelling – OPA Custom Control : Google Maps
The example is so generic that I thought I would share it with you. As before this example is just for educational purposes and there are lots of steps that were synthesised in the end after some refactoring, but is easier to show the long and wordy version here for educational reasons.
Firstly, let’s make the OPA Custom Control Project and set up the simple attributes and Screens.
Then we can build out the two Screens.
The map screen is just, for the moment, a Screen that is always displayed (because in this demonstration project we will not be doing any logic in rules).
The preceding screen, we will collect the information we need to display : firstly the visible details and secondly the latitude and longitude in the Location options of the Screen.
In this demonstration project, the incident type will have a value list, with four choices. These will correspond to four different icons from the Google Maps standard icon list. The list I was able to view from this site, and download the files needed for the demo. They were placed in the usual folder of our OPA Custom Control project, as shown below.
We’ll make some adjustments to the Map Screen, adding all the attributes we intend to use in the demonstration, using the public names and substitution tags.
The label that will be the basis for the map, and as you can see it needs (for this demonstration) a custom property, as shown below:
The content of the file, extended for the purposes of illustration, begins here, with three main areas of interest.
- Creating the script tag to load the Google Maps library
- Do the same to create an empty container for the future map
- Obtain the latitude and longitude from our project.
Continuing with our script, the entire mount, as you can see at the top of the previous image, is preceded by a check for our custom Property.
TIP : If you are planning on implementing only this customLabel, and you want to display other labels using the standard rendering, then you should put your custom property if statement right to the top immediately after the customLabel: line, and wrap everything in this if statement so that the entire script will be ignored for ordinary labels.
The next chunk is mostly setting up the Google Map functionality
4. These are the icons that will be used in the different types of incident. We use the $() notation to avoid fixed references to folders.
5. This is the callback function used when Google Maps has loaded
6. This actually loads the map
7. You can build an array of elements if you intend to display multiple markers. Here you will just use the one, with the latitude and longitude garnered earlier and the incident type.
8. For each of the loaded points, create a marker and add it to the map,
9. With a click event to handle the user interaction
10. The click event will display a dynamic content, in a typical Google Maps information box.
11. Finally as good citizens we will implement the unmount which will remove the Map when we leave the page, avoiding errors about multiple maps being loaded.
The interview experience gives us the following lovely rendering when you enter the details and pass to the Map Screen.
The icon will change depending on the type of incident, and the information box will display whatever attribute values you wish to show.