`g1.datafilter(data, filters)` returns the filtered data based on the filters. While urlfilter on [$.formhandler](#formhandler) applies filtering on data server side, `datafilter` applies urlfilter on frontend loaded data.
url:'state_score.json',// Load data from this file
dataKey:'name',// Join this column from the URL (data)
mapKey:'ST_NM'// with this property in the GeoJSON
},
attrs:{
fillColor:{// Fill the regions
metric:'score',// with the "score" column from state_score.json
range:'RdYlGn'// using a RdYlGn gradient
},
tooltip:function(prop){// On hover, show this HTML tooltip
returnprop.ST_NM+': '+prop.TOT_P
}
}
}
}
})
</script>
```
**Note**: You can use `type: 'topojson'` when loading TopoJSON maps.
### g1.mapviewer options
-`id`: ID of the map DOM element (example: `mapid`), or the DOM element
-`map`:
-`options`: supports same options as [Map options](http://leafletjs.com/reference-1.3.0.html#map)
-`layers`: builds layers one on top of another in the specified order.
-`{layername: {...} }` dict with layer name as keys
- Each layer MUST have a type. Currently supported types are
- tile
- geojson
- topojson
- marker
- circleMarker
-`tile` layer MUST have a url: that has the URL template for the leaflet tile layer.
-`url`: A string of the form - `http://{s}.somedomain.com/blabla/{z}/{x}/{y}{r}.png`
-`options`: supports same options as [Tile options](http://leafletjs.com/reference-1.3.0.html#tilelayer-minzoom)
-`geojson` layer MUST have a data as an array of objects or else MUST have a url (string).
-`url`: String
-`data`: An array of objects. data: takes preference over url.
-`options`: supports same options as [GeoJSON options](http://leafletjs.com/reference-1.3.0.html#geojson-style)
-`link`: adds attributes from input dataset to geojson
-`url` is url (String) to fetch data
-`mapKey` is attribute name in geojson to match
-`dataKey` is column name in input dataset that matches with geojson `mapKey`
-`attrs` Data driven styles.
- For `color`, `weight`, `opacity`, `fillColor`, `fillOpacity` properties, the options are:.
-`metric` string / function
- If `metric`: is a string, can be any numeric property of geojson
- To have a metric that is formala based on multiple properties, use function. Example: `function(row) { return row['congress_votes'] - row['bjp_votes']}`
-`domain` An array of two numbers. Defaults to calculated values of given `metric`.
-`range`
- For `fillColor` and `color`, must be a [interpolate color scheme](https://github.com/d3/d3-scale-chromatic#diverging)
- For `weight`, `opacity`,`fillOpacity` must be an array with min and max values
-`tooltip`: string / function that returns formatted value.
- function(properties) must return a string. feature properties are passed as argument.
- TODO: the properties currently include only geoJSON properties. link properties must be added
-`topojson` - same as `Geojson`
-`marker` layer MUST have a data as an array of objects or else MUST have a url (string).
-`url`: String
-`data`: An array of objects. data: takes preference over url.
-`latitude`: String (mandatory). Must be column name that contains latitude of marker
-`longitude`: String (mandatory). Must be column name that contains longitude of marker
-`options`: supports same options as [marker options](http://leafletjs.com/reference-1.3.0.html#marker-icon)
-`circleMarker` layer MUST have a data as an array of objects or else MUST have a url (string).
-`url`: String
-`data`: An array of objects. data: takes preference over url.
-`latitude`: String (mandatory). Must be column name that contains latitude of marker
-`longitude`: String (mandatory). Must be column name that contains longitude of marker
-`options`: supports same options as [circleMarker options](http://leafletjs.com/reference-1.3.0.html#circlemarker-radius)
-`attrs` same as `attrs` for `geojson` type layer
-`zoomHandler`: <!-- TODO -->
-`zoomlevel`: must be a `geojson` layer name or function. If given a `geojson` layer name, shows this layer and hides all other `geojson` layers. Optimize this to load only layer that is visible in viewport.
### g1.mapviewer methods
`g1.mapviewer.fitToLayer(layerName, options)`
Zooms map view to fit the layer. Supports same options as [fitBounds options](http://leafletjs.com/reference-1.3.0.html#fitbounds-options)
### g1.mapviewer events
-`mapload` is fired when all the map layers are loaded.
-`layersload` is fired when all layers are saved in mapviewer.gLayers
- tooltip is rendered on each layer only after layers are loaded.