Skip to content

jkruse/googlemaps-dataflex

Repository files navigation

googlemaps-dataflex

A DataFlex custom component wrapper for Google Maps.

Demo

Available here.

Quickstart

Download either the demo workspace including prebuilt component (GoogleMapsDemo.zip) or just the prebuilt custom component (GoogleMapsComponent.zip) from the Release page.

Demo workspace

If you downloaded the demo workspace, unzip to new folder and open workspace in DataFlex Studio. The studio will copy themes and the JavaScript engine into the AppHtml folder.

Register the web application from the studio menu "Tools > Register WebApp...".

Change the Google Maps API key in AppHtml/Index.html (see Get an API Key). The API key already in the file only works on the demo site.

Hit F5 to run the application.

Custom component

If you downloaded just the custom component, unzip to your existing workspace, add the script includes for CoreJS, the Google Maps API and Custom/GoogleMaps/index.js from this project to your Index.html, changing the Google API key, Use cWebGoogleMaps.pkg from one of your views and add the component to your page.

Using the source

Clone or download ZIP file of the repository to your computer.

Install DataFlex. This workspace is setup for version 20.1, but should be easy to migrate.

Install Node.js. Latest LTS version recommended. At least v18.12 required.

Install dependencies - from the folder where you cloned or extracted the repository run:

npm ci

Build the component client-side files (will be placed in AppHtml/Custom/):

npm run build

The component consists of a DataFlex class and an EcmaScript class. If you change the EcmaScript class you need to rebuild the component client-side files. Or to automatically rebuild a non-minifed version whenever you save it, run:

npm run watch