Report Google Map Plugin v1.0 Released

Over the past couple of weeks I’ve been working on an overhaul of my Google Maps region for Oracle Application Express. This free, open-source plugin allows you to integrate fully-featured Google Maps into your application, with a wide range of built-in declarative features including dynamic actions, as well as more advanced API routines for running custom JavaScript with the plugin.

The plugin has been updated to Oracle APEX 18.2 (as that is the version my current system is using). Unfortunately this means that people still on older versions will miss out, unless someone is willing to give me a few hours on their APEX 5.0 or 5.1 instance so I can backport the plugin.

EDIT: Release 1.0.1 includes some bugfixes and a backport for APEX 5.0, 5.1 and 18.1.

The plugin is easy to install and use. You provide a SQL Query that returns latitude, longitude, and information for the pins, and the plugin does all the work to show them on the map.

The plugin has been rewritten to use the JQuery UI Widgets interface, at the suggestion of Martin D’Souza. This makes for a cleaner integration on any APEX page, and reduces the JavaScript footprint of each instance on the page if you need two or more map regions at the same time. This represented a rather steep learning curve for me personally, but I learned a lot and I’m pleased with the result. Of course, I’m sure I’ve probably missed a few tricks that the average JavaScript coder would say was obvious.

The beta releases of the plugin (0.1 to 0.10) kept adding more and more plugin attributes until it hit the APEX limit of 25 region-level attributes. This was obviously not very scaleable for future enhancements, so in Release 1.0 I ran the scythe through all the attributes and consolidated, replaced, or removed more than half of them – while preserving almost every single feature. This means v1.0 is not backwards compatible with the beta versions; although many attributes are preserved, others (including the SQL Query itself, which is rather important) would be lost in the conversion if the plugin was merely replaced. For this reason I’ve changed the Internal ID of the plugin. This is so that customers who are currently using a beta version can safely install Release 1.0 alongside it, without affecting all the pages where they are using the plugin. They can then follow the instructions to gradually upgrade each page that uses the plugin.

All of the plugin attributes relating to integrating the plugin with page items have been removed. Instead, it is relatively straightforward to use Dynamic Actions to respond to events on the map, and an API of JavaScript functions can be called to change its behaviour. All of this is fully documented and sample code can be found in the wiki.

New features include, but are not limited to:

  • Marker Clustering
  • Geo Heatmap visualisation (this replaces the functionality previous provided in a separate plugin)
  • Draggable pins
  • Lazy Load (data is now loaded in a separate Ajax call after the page is loaded)

The plugin attributes that have been added, changed or removed are listed here.

If you haven’t used this plugin before, I encourage you to give it a go. It’s a lot of fun and the possibilities presented by the Google Maps JavaScript API are extensive. You do need a Google Maps API Key which requires a Google billing account, but it is worth the trouble. It is recommended to put a HTTP Referer restriction on your API Key so that people can’t just copy your public key and use it on their own sites. For more information refer to the Installation Instructions.

If you are already using a beta version of the plugin in your application, please review the Upgrading steps before starting. Don’t panic! It’s not quite as simple as just importing the plugin into your application, but it’s not overly complicated. If you were using any of the Page Item integration attributes, you will need to implement Dynamic Actions to achieve the same behaviour. If you had any JavaScript integrations with the plugin, you will need to update them to use the new JQuery UI Widget API calls. I am keen for everyone to update to Release 1.0 as soon as possible, so I will provide free support (via email) for anyone needing help with this.

I am very keen to hear from everyone who is using the plugin, and how it is being used – please let me know in the comments below.

If you notice a bug or have a great idea to enhance the plugin, commenting on this post is not the best place – instead, please raise an issue on GitHub.

Links

Change Item Icon Dynamically
Conditionally Required Floating Item

Comments

  1. Wow, talk about perfect timing. This is so great. Even better to see an Aussie building such a useful plugin. Will give it a good test.

  2. Jeff,
    I’m using release 1.1 with apex 5.1 and was trying out the geoJSON features. I have a large layer that I’m trying to add to my map that is stored in my database as a clob. How can I get that data into the API to draw my layer? I’ve tried all sorts of things but can’t seem to get it to work. I tried using the data from your demo site successfully so my basics are correct and the data will draw when enabling drag and drop and dropping the file onto the map but I need to be able to do this from my database. Any ideas on what to try?

  3. Jeffrey,
    I used this plugin to build some applications to help with COVID-19 needs.
    Thank you so much for making it to easy.
    -Neelesh

  4. Hi Jefferey,

    In Marker clustering part, the icons of clusters are missing.
    I’m not sure how those icons are defined.

    • The plugin does not currently work with the new “Friendly URLs” feature. I’ll raise this as an issue to fix.

      Thank you!

  5. Hi Jeff,

    Great plugin, we are loving how it it is to use and have already changed our app to store maps coordinates, but the question is if I want to store the coordinates (lat. long.) how to update my addresses table and all previous records?

    Tks

    • Hi Andre,

      Thanks for giving the plugin a go.

      The plugin is like a report in that it takes the results of a query on a datasource you provide and shows them on the map; if you allow the user to drag-and-drop the pins to new locations (i.e. edit the data), the plugin does not handle the actual updating of your datasource. You may need to add a dynamic action to pick up the new lat/long coordinates and store them – how this should be done will depend on your data source. You could use a dynamic action to run an UPDATE statement on your table, for example.

      I trust this answers your question but if it doesn’t, please clarify what you’re trying to achieve.

      Jeff

  6. Hi Jeff, I meant what to do with all 12k rows of addresses that I have in my database, because I would like to update all rows to store maps coordinates and than make it easy to manipulate maps reports.

    As of now I am using the plugin and I can get the coordinates for the new ardesses that our user creates and store in the db with no problem.

    Thank you

  7. Hi Jeffrey,

    Just found out this great plugin that I would like to use in my apex application. However, when I try to use the plugin on the application it says ‘something is wrong’ and ‘This page didn’t load Google Maps correctly. See the JavaScript console for technical details. ‘ Was just wondering if there is a way to troubleshoot this error?

    • Hi Emily,

      Thanks for trying the plugin. Please check your browser console (F12 usually) for error messages from Google.

      Jeff

  8. Hi Jeff,

    Is there a way to copy the route? Or to copy the destination address on the map?

    That would be to send directly to our delivery guy phone and he would just click on the link and be ready to go.

    Tks

    • Hi Andre,

      At the moment the plugin doesn’t expose the Directions objects that are used internally for generating and rendering the directions on the map.

      I’m working on the next version of the plugin which will provide the ability to show the turn-by-turn directions on the page, and will also provide access to the full DirectionsResult object which will give you the ability to store the turn-by-turn directions, along with the all the Lat/Long points along the way.

      I’m not sure if that will suit your needs or not, however. It depends on what form you would need to have this data in, which would dictate how you can re-render it on the recipient’s device when later retrieved.

      If you want to provide more details / input on your exact requirements, please comment on this enhancement request here so we can discuss them further:

      https://github.com/jeffreykemp/jk64-plugin-reportmap/issues/97

      Thanks!
      Jeff

  9. neelesh shah
    1 May 2020 - 6:07 am

    Hi Jeff, Hope you are staying safe and healthy.
    Can I guide me on how to set language for the rendering of maps ?
    Is it configurable?
    Thank you
    -N

  10. Neelesh shah
    2 May 2020 - 6:29 am

    Thanks Jeff..

  11. Neelesh shah
    2 May 2020 - 6:29 am

    Thanks Jeff.. will check in later.
    Awesome job once again..

Leave a Reply

Your email address will not be published / Required fields are marked *