carto/README.md

84 lines
1.7 KiB
Markdown

# CartoCSS
[![Build Status](https://secure.travis-ci.org/mapbox/carto.png)](http://travis-ci.org/mapbox/carto)
Is as stylesheet renderer for javascript, It's an evolution of the Mapnik renderer from Mapbox.
Please, see original [Mapbox repo](http://github.com/mapbox/carto) for more information and credits
## Quick Start
```javascript
// shader is a CartoCSS object
var cartocss = [
'#layer {',
' marker-width: [property]',
' marker-fill: red',
'}'
].join('')
var shader = new carto.RendererJS().render(cartocss);
var layers = shader.getLayers()
for (var i = 0; i < layers.length; ++i) {
var layer = layers[i];
console.log("layer name: ", layer.fullName())
console.log("- frames: ", layer.frames())
console.log("- attachment: ", layer.attachment())
var layerShader = layer.getStyle({ property: 1 }, { zoom: 10 })
console.log(layerShader['marker-width']) // 1
console.log(layerShader['marker-fill']) // #FF0000
}
```
# API
## RendererJS
### render(cartocss)
## CartoCSS
compiled cartocss object
### getLayers
return the layers, an array of ``CartoCSS.Layer`` object
### getDefault
return the default layer (``CartoCSS.Layer``), usually the Map layer
### findLayer(where)
find a layer using where object.
```
shader.findLayer({ name: 'test' })
```
## CartoCSS.Layer
### getStyle(props, context)
return the evaluated style:
- props: object containing properties needed to render the style. If the cartocss style uses
some variables they should be passed in this object
- context: rendering context variables like ``zoom`` or animation ``frame``
## Reference Documentation
* [mapbox.com/carto](http://mapbox.com/carto/)