Parent | Child | Previous | Next
 

Layers

IN THIS PAGE

Description

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.

In this video we show how we have defined a map with 3 logical layers= - 'layer1', 'layer2' and 'layer3'. When each marker is placed on the map is is assigned to one of these layers. In the example, the rule for assigning a marker to a particular layer is contrived - if the marker is for a record in the first 3 rows of the Grid, it is in 'level1', and so on. Obviously, in a real application you would have more realistic rules for assigning markers to different map layers. Then, we put a checkbox control in a free-form region of the grid to control which layers as shown. We also show how the markers in a particular layer can be animated to draw attention to them.

Layering functionality. common feature in mapping applications, assigning layer name to a marker on a map. Ex. Icons in first three rows, layer number 1, next three rows layer number 2. Last four layer number 3. Turn on and off layers using checkboxes. Assign layers to different catagories, good customers/bad customers. Alternate view definition. Defined in Edit Expression dialog. build Xbasic function. 

function layerName as c (e as p)

if e.rowNumber <= 3 then
    layerName = "layer1"
else if e.rowNumber > 3 .and. e.rowNumber <=6 then
    layerName = "layer2"
else
    layerName = "layer3"
end if

end function

Adding Javascript, video 2. How you can show or hide Icons on a layer map? Google map method Map Id Alternate View:MAP view Xbasic. Javascript function that calls another javascript function 

window['{grid.componentName}_G_UNBOUND_BUTTON_1_1'] = function(rowNum,rowId,objEle) {
{grid.object}.googleMap_MAP.hideLayer('layer1');
}

  1. Copy this to clipboard

    {grid.object}.googleMap_MAP.hideLayer('layer1');

  2. Go to Freeform edit region 

    Available Placeholders {ActionButton:BOUNCE1} {ActionButton:BOUNCE2} {ActionButton:BOUNCE3}

  3. Select map layers to show:

  4. Javascript Function

    function showLayers(names) {
    {grid.object}.googleMap_MAP.hideLayer('layer1');
    {grid.object}.googleMap_MAP.hideLayer('layer2');
    {grid.object}.googleMap_MAP.hideLayer('layer3');

    for(var i=0;i < names.length; i++) {
        {grid.object}.googleMap_MAP.showLayer(names[i].toLowerCase());
    }
}

  5. Can cause icons to bounce Properties, freeform area Video 3. Button Action: Javascript click button...Google Map Method Action: Bounce markers on a layer method Bounce numbers on Layer Number 1. For duration of 2 seconds. All that is required. Assigning layers to the markers that you place on icons can be very powerful.