Google Maps (Alternate View)

Description

Videos relating to Google Maps and how to incorporate them into Grid Components.

Name
Description
Introduction

Grids have a property called 'Alternate Views'. An Alternate View is simply another way of displaying the data in the Grid. You can define custom Alternate View (using Xbasic), or you can use one of the built-in Alternate Views. The most commonly used built-in Alternate View is a Google Map. This is used to plot the data displayed in the Grid as markers on a Google Map.

Customizing the Marker Title and Info Box

This video continues from video GM1. The video shows how you can customize the 'info box' for each marker on the map. The 'info box' is a small window that pops up when the user clicks on a marker.

Dynamic Marker Icons-Alternate View Layout Options

This video continues from GM2. The video shows how the icon for each marker that is placed on the map can be dynamically specified. So, for example, if record 1 in the Grid was for a customer with a low credit rating, the corresponding icon on the map might be red. If record 2 was for a customer with a high credit rating, the corresponding icon on the map might be green.

More Alternate View Layout Options

This video continues from GM3. The video shows more options for how the Alternate Views and the main Grid can be displayed on the page.

Dynamic Marker Circles

When you place a marker on a map you have control over the marker icon, bubble help and info box text.

Dynamic Images and Image Sequences

When you place a marker on a Google Map, you have full control over the icon that is used. You can specify an expression that evaluates to the icon name to use for the marker. Or, you can specify an Xbasic function that will get called for each row in the Grid. The function can compute the marker icon based on the data in the current Grid row.

Layers

When you place a marker on a Google Map you can assign the marker a logical 'layer' name. For example the layer name for a marker could be 'High Risk', or 'Medium Risk', etc. Then using the automation features on the map that Alpha exposes, you can hide and show different layers on the map. For example, you might put a checkbox control on your Grid with these entries: High risk, Medium risk and Low risk. Then when the user checked or unchecked an entry, your Javascript automation code could hide or show the markers in the corresponding map layer.

Animating Markers

When markers are placed on a Google Map, you can specify that the markers should be animated as they are placed on the map. Two animation modes are supported: Drop and Bounce.

Treating the Map as a Blank Canvas so that Markers on the Map can be Added Programmatically

In the previous videos, the markers on the map have been added automatically. For each record in the Grid, a corresponding marker has been placed on the Map.

Search Part - Geography Searches

Certain SQL databases (such as SQL Server, Oracle, DB2, MySQL, Postgres) support a special data type called 'Location'.

Search Part - Show Search Results on Screen

This video continues from GM10. When you have a Google Map in the Search Part of a Grid you can use the Map to mark a search polygon or radius, as shown in the previous video. However, you can also display markers on the map to show the location of the records found by the search.

Search Part - Radius Search - Sorting result by distance from the map center point

When you do a radius search (i.e. find all records with a certain distance of a map center point), it can be useful to order the records by distance from the map center point. This video shows how this is easily done.

How to use a Grid to implement a typical 'Store Finder' application

A typical pattern often seen in web applications is a 'store finder' The user enters his location and clicks a button and a list of store branches that are closest to his location is retrieved. In this video we show how this type of application is easily built using a Grid component with a Search Part.

Update the Latitude and Longitude in the current Grid

Shows how to Update the Latitude and Longitude in the current Grid row when a Marker in the Map is dragged to a new Location. In this video we show how the latitude and longitude value in the current Grid row can be updated when the user drags the marker to a new position on the map.

Updating a Geography data type Field

Updating a Geography data type field automatically when a Longitude or Latitude Field is Changed.

Adding New Markers to a Map

Shows how a New Marker Can be Added to a Map When Entering New Records to a Grid.

How the Grid Was Configured in Video GM12

A guide to configuring the video GM12 on how to use a Grid to implement a typical 'Store Finder' application.

Alternate View Google Map JavaScript Methods

Methods can be called directly on the JavaScript object for the Grid Map object in the Grid Component.