Mappia API


tools=: {String}

Set the enabled map tools, these tools are shown in the top right side of the map viewer.

hovershowlegend: Add a tool to shows map legends on hovering.
layerchooser: Add to 'legends viewer' a list of map layers. (Not affects 'calculate' maps).
zoomextent: Add zoom to visible maps extents tool.
getfeature: Add GetFeatureInfo tool, a tool to click and get any pixel complete information.
measure: Add a measurement tool that can measure a polygon area or a distance in a map.
legend: Add a floating panel to show the map legends.
metadata: Add a button to show all maps metadata.
helpintro: Show a button with help options, tutorial and step by step guide.
Usage: URL/?tools=helpintro,layerchooser,zoomextent,customzoom,getfeature

Defaults to undefined

options=: {String}

Set options for the elements in the map viewer.

onlyfirstvisible: Only the first layer is initially visible.
hidemetadata: Remove layers metadata button.
disabledownload: Remove layers 'Download' button.
hidestylechooser: If defined remove the list of bands of layers. (Do not affect 'calculate' maps).
scale: Show the scale indicator at bottom left of the map.
grid: Show grid tiles bounds.
overview: Shows a small map to help user idenfity where globally is he viewing.
capabilities: Load capabilities only for the layers in query. Reduces drastically the loading speed.
startopened: Painel showing layers is initially opened. (Deprecated)
onevisible: Only one layer is visible at any time. (Deprecated)
Usage: URL/?options=enablequeries,scale,startopened

Defaults to undefined

lang=: {String}

Select the interface language, which actually are: 'pt-br', 'eng'.
Usage: URL/?lang=eng

Defaults to pt-br

queryid=: {Numeric}

Id of the Query content to load.
Usage: URL/?queryid=57

Defaults to undefined

extent=: {String}

If defined shows a given bounds defined in EPSG:4626|EPSG:900913 coordinate system, otherwise zoom to visible layers extents. The boundbox is defined as 'left, bottom,Right,top' coordinates.
Usage: extent=-443.628,-16.847,-407.373,3.294

Defaults to undefined

visibleLayers: {Number|String}

Define the initially visible layers.

visibleLayers < 0 'lower than zero' : Shows the first defined maps as visible (From top to bottom).
visibleLayers > 0 'higher than zero': Shows the last defined maps as visible (From bottom to top).
visibleLayers = 0 : Start with no layer visible.
visibleLayers = 'custom' : Visibility defined in each map by 'visibility: {Boolean}' property.
Usage: URL/?visibleLayers=custom

Defaults to 100

paramsButtonConfig: {Object}

Choose what custom buttons are shown on the layer representation.

There are multiple types of buttons, there are some commum properties and some special properties:

Commom properties:
iconCls: {String} The class to add on the button. Ex: "icon-timeline-slider"
pressed: {Boolean} True to indicate if the button starts pressed, False otherwise. Ex: true,
toggleGroup: {String} Identify a group by name where only one button of the group can be pressed. Ex: 'onlyOneAtTime'

associated: {associatedButtonID: 'ANOTHER_BUTTON_ID', type: 'associated'}
Treat the layer button and the associated as the same button, so no matter which one is clicked both will
receive the click event.
query: {type: 'query'}
This configuration allows the user to change the default query button behavior overriting his definition.
download: {type: 'download', layerIndex: 0}
Set what layer should be downloaded when more than one layer is shown by its internal layer index.
metadata: {type: 'metadata', layerIndex: 0}
Set the metadata button to show one of the inside composite layer by his index.

PS: The layerIndex is from 0 to the quantity of layers in a composed map.
PS2: The properties are aditional, so the common must always be present, and for each type his
corresponding property must be added.
Usage: paramsButtonConfig: {
associatedButtonID: "population_2015_2036_timeline",
iconCls: "icon-timeline-slider",
pressed: true,
toggleGroup: undefined

Defaults to undefined

visibility: {Boolean}

Define the layer as initial visibility, True to start visible False otherwise. (the URL parameter visibleLayers can override this value).
Usage: {visibility: false}

Defaults to true

legendTitle: {String}

Defines a title for the map legend representation.
Usage: {legendTitle: '(Ton/ha)'}

Defaults to empty

hideLegendButton: {Boolean}

Set the 'show legend' button visibility, True to hide button or False to keep it visible.
Usage: {hideLegendButton:true}

Defaults to false

associatedButtonID: {String}

Defines a button to associate with the query button, so when click on one of these buttons the other receives the click too.
Usage: paramsButtonConfig: [{
associatedButtonID: "precip_monthly_average_timeline",
iconCls: "icon-timeline-slider",
pressed: true,
toggleGroup: undefined

Defaults to undefined

source: {String} required

Type of desired interaction with map, there are two possible types:
1) 'local': Maps without complex pixel actions.
2) 'calculate': Maps to interact with his values and use to create others maps.
Usage: {source: 'calculate'}

Defaults to undefined

name: {String} required

One or more maps identifiers, each map have a unique name, and the name is a group of identifiers separated by comma. Usage:
One map: 'CSR:protected_areas'.
Two Maps: 'CSR:protected_areas,CSR:altimetria'

Defaults to undefined

otherNames: {String}

One or more maps identifiers which will be used within the changeLayers in the expression function. Usage:
One map: 'CSR:protected_areas'.
Two Maps: 'CSR:protected_areas,CSR:altimetria'

Defaults to undefined

title: {String}

Define map title, if empty the title is read from metadata.
Usage: title: 'My 1º Custom Title'

Defaults to {String}

styles: String

A string that describes the index/attribute of each map will be used. The style quantity must be the same of maps defined in query.
Usage: '1,1,1,1'

Defaults to undefined

updateAutomatically: {Boolean}

Flag to control the calculations delay after a widget update/change by user interaction.

'True' to start calculations immediately and 'False' otherwise.

*PS: Only applicable to 'calculate' maps.
Usage: {updateAutomatically: true}

Defaults to false

visible: {Boolean}

Defines initial map visibility, True to start visible, False otherwise.
Usage: {visible: false}

Defaults to true

opacity: {Numeric}

Defines initial map opacity.
Usage: {opacity: 0.8}

Defaults to 1

priority: {Numeric}

Defines map listing order priority. The higher this value, the higher its placement in the layer list.
Usage: {priority: 1}

Defaults to 0

beforeCalc: {Function}({{inputs}})

Function called before each expression calculation.
Ps: Maps even without 'expression' function will call the 'beforeCalc' function on an input update.
Ps2: This function is called synchronously and the context is the map layer.
Usage: beforeCalc: function(inputs){}

Defaults to null

afterCalc: {Function}({{inputs}})

Function called after each expression calculation.
Ps: Maps even without 'expression' function will call the 'afterCalc' function on an input update.
Ps2: This function is called synchronously and the context is the map layer.
Usage: afterCalc: function(inputs){}

Defaults to null

expression: {Function}({{layersVals}}, {{inputs}})

Function to process each layer pixels to the resulting map.

@param layersValue {Array} Array with the layers values, each layer in one position of the array.
@param inputs {Object} Inputs defined to interact with the map.
@return {*} Value of each processed pixel.
Usage: { expression: function(layersVals, inputs) {return layersVals[0];} }

Defaults to null

functions: {Object}

Allows to create custom functions on the context of each layer. These functions can be used in any tool callbacks, in the tool callback must use the same name in this 'functions' property.
PS1: Functions only visible inside this layer.
PS2: Functions accessed by tools callbacks using his property name as: (this.functions.['onClick']) to refer the following onClick function:
functions: {
onClick: function() {
ExtjsUtils.ALERTIFY.log("Clicked Button");

Defaults to null

group: {String}

Defines this layer as part of a group of exclusively visible, when one is shown all others will become hidden.

Defaults to null

changeLayers: {Array{Object} }

Change a internal layer in a given index by another.

PS: Its highly recommended to pass multiple configuration in a array, avoid call this function multiple
times in the same callback.
@param newConfig {Array|Object} One or more layers configurations with a property 'index' indicating the replacing layer.
Each config object must contain at least the following properties:
[{name: 'MAP_FULL_NAME', styles: 'MAP_STYLE', index: 'MAP_INDEX_TO_CHANGE'}, ... ]
@param force {Boolean} Force redraw even if no change is done when the layer is the same.
Usage: (layer.changeLayers({name:'CSR:estados', index:1} ))

Defaults to undefined

setCalculateLegend: {Function}({{legendEntries}})

Defines the current map legend, so it prevents from a new legends calculation process.

PS: Can be called inside the 'beforeCalculate' callback, which is the time right before the new legend calculation.
PS2: Can be called on a tool callback.

@param legendEntries {Array{{String|Array{Number, Number, Number} }, {Object}, {String} } } Array with the legends sorted entries in ascending order, the ones out of order will be ignored.
Usage: layer.setCalculateLegend([['00FF00', 10, 'lower Bound'], ['F100F3',50,'higher Bound']]);

Defaults to undefined

handler: {Function}({Component}, {EventObject})

{{Function}} called, on layer scope, when the button is clicked.
{{Component}}: This button.
{{EventObject}}: The click event.
Usage: |handler=function() {alert('btn on layer: ' + this.name + ' was clicked.');}|

Defaults to null

toggleHandler: {Function}({{Component}}, {{EventObject}})

Function called when a Button with {enableToggle} set to true is clicked.
{{Component}}: This button.
{{EventObject}}: The click event.
Usage: |toggleHandler=function(c,e) {alert('Btn pressed ' + e);}

Defaults to null

enableToggle: {Boolean}

{{Function}} called when the button is clicked.
{Component}: This button.
{EventObject}: The click event.
Usage: |enableToggle=true|

Defaults to false

onSelect: {Function}({{element}}, {{value}}, {{index}})

Fires when a list item is selected.
@param element {Element} This combobox.
@param value {Record}: The record which was selected.
@param index {Numeric} Index of the selected item.

Usage: |onSelect= function(e,v) {alert('Selected ' + v);}|

Defaults to undefined

width: {Number}

Define element initial width in pixels.
Usage: |width=200|

Defaults to 190

runOnClick: {Function}({{layer}}, {{layersValue}}, {{inputs}}, {{coordinates}}, {{clickEvt}}, {{lastInfo}}

Fires when a pixel is clicked. CallBack parameters (layer, layersValue, inputs, coordinates, clickEvt, lastInfo)
layer: {Layer} Current layer.
layersValue: {Array} One value for each layer at the given point.
inputs: {Object} Object with all the layer inputs.
coordinates: {Openlayers.LatLon} Coordinate of the click in the map.
clickEvt: {EventObject} Mouse click event.
lastInfo: {click: {LatLon}, hover: {LatLon} } A object with the last click and hover latLon positions.
Usage: onClick=function(){alert('i found a click')}

Defaults to undefined

runOnHover: {Function}({{layer}}, {{layersValue}}, {{inputs}}, {{coordinates}}, {{clickEvt}}, {{lastInfo}}

Fires when is hovering a pixel. CallBack parameters (layer, layersValue, inputs, coordinates, clickEvt, lastInfo)
layer: {Layer} Current layer.
layersValue: {Array} One value for each layer at the given point.
inputs: {Object} Object with all the layer inputs.
coordinates: {Openlayers.LatLon} Coordinate of the click in the map.
clickEvt: {EventObject} Mouse click event.
lastInfo: {click: {LatLon}, hover: {LatLon} } A object with the last click and hover latLon positions.
Usage: onClick=function(){alert('i found a click')}

Defaults to undefined

CreateTooltipThumb: ({{title}}, {{description}}, {{target}}, {{thumbUrl}}, {{showDelay}})

Create a tooltip which follows the mouse on hovering an element with title, description and thumbnail.

PS: The description content is shown until three break lines in sequence and the rest of the content is thrown away.

@param title {String} Tooltip title.
@param description {String} Tooltip content.
@param target {DOM} DOM object to create the tooltip.
@param thumbUrl {String} URL of the thumbnail.
@param showDelay {Numeric} Define how many seconds until hide the tooltip.
@returns {Ext.ToolTip} Created tooltip with the properties.
Usage: ExtjsUtils.TooltipHelper.CreateTooltipThumb()

Defaults to undefined

CreateTooltipOnPosition: ({{title}}, {{contentHtml}}, {{position}}, {{additionalConfig}})

Create a tooltip at a fixed position.

If the position is the mouse event, the tooltip will be at the right side and below the pointer.
If the position is a array[x,y] will anchor the top left at this point.

@param title {String} Tooltip title.
@param contentHtml {String} Tooltip HTML content.
@param position {Event|Array[Number, Number]}} Defines the top left position of the tooltip.
@param additionalConfig {Object} Additional configuration for the tooltip.
@returns {Ext.Tooltip} A tooltip anchored at the given position.
Usage: ExtjsUtils.TooltipHelper.CreateTooltipOnPosition('title', 'My tooltip content', [0, 0])

Defaults to undefined

getCmp: ({{objId}}) => {Ext.Component}

Get a Extjs object by his ID.
{{objId}}: The Id which object will be returned.
Usage: Ext.getCmp('myId');

Defaults to undefined

getId: () => {String}

Returns the id of this component or automatically generates and returns an id if not defined yet view detailed documentation Ext.Component.getId().
Usage: Ext.Component.getId()

Defaults to undefined

log: {Function}({{msg}},{{config}})

Shows an user notification (if enabled).

PS: The messages before layer loading are delayed, when it finishes only the last message will be shown.

@param msg {String} Notification HTML content.
@param config {Object} Message configuration parameters.
{force: {Boolean} Force to show notification even when disabled.
func: {Callback} Callback function when the notification is clicked.
onlyMsg: {Boolean} True to only show message and hide the close and the stop notifications, False otherwise.
Usage: ExtjsUtils.ALERTIFY.log('test msg', {force:true})

Defaults to undefined

getValue: ({String}) => {Object}

Get the stored value by his property name, if it does not exists returns null.

@param key {String} Stored property name.
@returns {*} Desired stored property when it exists or null otherwise.
Usage: (inputs.id['id'].getValue('name'))

Defaults to undefined

forceRecalc: ()

Force a legend map recalculation.
Usage: (inputs.id['id'].forceRecalc())

Defaults to undefined

setValues: ({{obj}}, {{cancelUpdate}}, {{local}})

Stores object properties for later usage.

PS: If has name property collision the older is replaced.
@param obj {Object} Object with the properties to be stored.
@param cancelUpdate {Boolean} False if this change must cause layer recalculation, True otherwise.
@param local {Boolean} True to store the property locally, False otherwise. The local properties aren't sent to 'expression' calbacks. (i.e. If a element is recursive or have DOM elements, it must local avoid stringify errors on 'expression' callbacks)
Usage: (inputs.id['id'].setValues({toStore:5}, ))('name'))

Defaults to undefined

operation: {String})

A string that describe the RAW MAPS operations, each operation identifier da must be separated by a comma.
PS: The operations must be one for each defined map.

Raw Maps operations:

'normal' (NORMAL): A normal map is a map with each cell representing a legend/color and aren't a RAW Maps type.
'raw' (RAW): Each cell in resulting map has the value of ther most centered cell in aggregated region.
'rgba' (RGBA): Each cell in resulting map has a integer value representing the RGBA composition.
PS: Tanto o resultado como o input são inteiros representando valores RGBA.
'sum' (SUM): Each resulting cell is the weighted sum of cells in the covering region.
PS: The weight used is the proportion of the covered area against the total area of the cell i.e. VALUE * COVERED_PERCENTAGE.
'average' (AVERAGE): Each cell is the resulting of the weighted mean of cell in the covered region.
Example: A full covered cell the COVERED_PROPORTION is 1, and the half covered cell the proportion is 0.5 .
'max' (MAX): Each resulting cell is the greater cell that is at least partially covered in the given region.
'min' (MIN): Each resulting cell is the smaller cell that is at least partially covered in the given region.
'integral' (INTEGRAL): A technique that allows to calculate the sum in a region just inspecting the cells on the
boundaries of a retangular area i.e. calculate sum in a region using only 4 points.
'areaintegral' (AREAINTEGRAL): ?
'area' (AREA): Each cell carry the original map area in the aggregated region.
?PS: Esse simplificador agrupa as áreas do mapa original e permite avialiar a área do mapa minimizando erros de
calculos de área causados pela reprojeção uma vez q a própria célula armazena esse valor.
'cells' (CELLS): Weighted sum of the cell quantity in a given region.
Exemplo: 'min,max,raw,integral'

Defaults to undefined

runOnceLayerVisible: ({{layer}}, {{callback}})

A function that assure that a function will be called only when the layers is/became visible.
layer: {Openlayers.Layer} A reference to the map layer.
callback: {Function} A function that will be called instantly if the layer is already visible, or when the layer became visible.
Usage: ExtjsUtils.QUERY.runOnceLayerVisible(this, function(){alert('Layer Visible.')});

Defaults to undefined

setQueryGlobalProperties: {Function}({{globalProperties}}) && {{QUERY_DESCRIPTION}}

A function that allows to define custom global functions that can be used in order to define properties or even inside the functions callbacks.
globalProperties: {Object} The object that all his functions will became globals, each property can be a value or a object or evan a function.
PS: All properties defined here are added to the global scope and are removed when the query is changed.
@param QUERY_DESCRIPTION {Array{ConfigLayer} } Array of layers in the query.
Usage: ExtjsUtils.QUERY.setQueryGlobalProperties({globalCount: 0}) && QUERY_DESCRIPTION

Defaults to undefined

getValue: {Function}({{column}}, {{line}}) => {String}

Get a value by the matrix index and column.
@param column {Number} Column index (First index is 0).
@param line {Number} Line index (First index is 0).
@return {String} Get the cell value.
Usage: inputs.id['loadjson'](0,0)

Defaults to undefined

columnNameToInd: {Function}({{columnName}}) => {Numeric}

Get the index of a column with the 'columnName' name.
@param columnName {String} Column name to search for.
@return {Number} When it exists returns the column index, otherwise -1.
Usage: inputs.id['loadjson']('total_ha')

Defaults to undefined

setValue: {function}({{column}}, {{line}}, {{value}})

Change a cell value by its cell index.

@param column {Numeric} Column index.
@param line {Numeric} Line index to change (ignore the header information when it exists).
@param value {*} New value to replace the older value.
Usage: inputs.id['loadjson'].setValue(2,2, 'myValue')

Defaults to undefined

getLines: {Function}({{columns}}, {{values}}, {{includeHeader}})

Get all lines that 'column' has the value equals to 'value'.

PS: To use the 'column' as index, it must be numeric, when the 'column' is a text the index is searched on header by its name.
PS: To filter multiple column each value and index one must be added to the 'columns' and 'values' arrays.

@param columns {Array} (Optional) Array of indexes/names of the filtered columns.
@param values {Array} {Opcional) Array of values to match each column.
@returns {Array} If the parameters 'column' and 'value' aren't defined return all lines, otherwise returns only the matched lines.
Usage: (inputs.id['id'].getLines([1,2,4], [20, 'blue', false], false);)

Defaults to undefined

plugins.tip: {String}

Shows a tooltip with any html content with the value while dragging.
Usage: |plugins=tip=Filter {0}% of total cells|

Defaults to undefined

minValue: {Numeric}

Defines the minimum acceptable value to slider.
Usage: |minValue=0|

Defaults to undefined

maxValue: {Numeric}

Defines the maximum acceptable value to slider.
Usage: |maxValue=0|

Defaults to undefined

value: {Numeric}

Defines the initial value to slider with only one thumb.
Usage: |value=0|

Defaults to undefined

values: {Array}

Property to use two or more thumbs, each value is the initial thumb value
@type {Array} Array of initial values.
Usage: |values=[0,100]|

Defaults to undefined

backgroundColors: {Array}

Array of colors of background slider values, to define background slider color based in slider value.
The values are defined from most to minimum with two properties each:
- color: {String} CSS color definition for the current interval. i.e. 'red','black','#FF0000', '#000000'.
- startValue: {Numeric} If defined define the initial value which above will apply this color, otherwise use theminimum slider value as default.

backgroundColors: [
// Define background color to red when slider has value above 75.
color: "red",
startValue: 75
// Define background color starting from value 0.
// That results two intervals, from 0 to 75 as blue, and from 76 to 100 as red.
color: "blue",
startValue: 0
Usage: |backgroundColors=[{color:'red',startValue:75},{color:'blue'}]|

Defaults to undefined

value: {String}

Set the initial tool content.
Usage: |value=text|

Defaults to undefined

isnumeric: {String}

Assures that the text content is a numeric string.
Usage: |isnumeric|

Defaults to undefined

fieldLabel: {String}

Field description.
Usage: |fieldLabel=Field description.|

Defaults to undefined

style: {String}

Element style description.
Usage: |style=color:black;|

Defaults to undefined

text: {String}

The label text content.
Usage: |text=content|

Defaults to undefined

text: {String}

Text associated with the pickpoint activation button.
Usage: |text: 'Descibe pickpoint action'|

Defaults to undefined

markLayerInd: {Numeric}

Set the index of the internal layer to be drawn when a region is selected.
Usage: |markLayerInd=1|

Defaults to undefined

lat: {Numeric}

Initial latitude of the pickpoint pointer.
Usage: |lat=10|

Defaults to undefined

lon: {Numeric}

Initial longitude of the pickpoint pointer.
Usage: |lon=10|

Defaults to undefined

nextStepInterval: {Numeric}

Sets the delay in seconds between steps when timeline is playing.
Usage: |nextStepInterval={Numeric}|

Defaults to undefined

steps: {Array{Array} }

Array of all timeline steps where each element is a tuple of [VALUE,'Title']. The value is a mandatory parameter for the step, the title give a optional custom representation to value.
Usage: |steps=[[1918, 'World War 1'], [1939, 'World War 2']]|

Defaults to undefined

value: {Numeric}

Initial latitude of the pickpoint pointer.
Usage: |lat=10|

Defaults to undefined