如何使用CartoDB

时间:2015-09-29 15:39:46

标签: cartodb

我正在尝试使用JS库创建使用CartoDB的等值区域地图。

如何在图层上动态创建cartoCSS?

似乎有可能基于专栏?

例如,使用内置向导生成以下内容。我想以某种方式使用前端的自定义颜色和列名称动态生成它。

#mytable{
  polygon-fill: #FFFFB2;
  polygon-opacity: 0.8;
  line-color: #FFF;
  line-width: 0.5;
  line-opacity: 1;
}
#mytable [ col_xyz <= 12505.969707] {
   polygon-fill: #B10026;
}
#mytable [ col_xyz <= 3650.909837] {
   polygon-fill: #E31A1C;
}
#mytable [ col_xyz <= 1656.60976] {
   polygon-fill: #FC4E2A;
}
#mytable [ col_xyz <= 677.226857] {
   polygon-fill: #FD8D3C;
}
#mytable [ col_xyz <= 333.140676] {
   polygon-fill: #FEB24C;
}
#mytable [ col_xyz <= 170.576913] {
   polygon-fill: #FED976;
}
#mytable [ col_xyz <= 51.090065] {
   polygon-fill: #FFFFB2;
}

http://docs.cartodb.com/cartodb-platform/cartodb-js.html#sublayersetcartocsscss

1 个答案:

答案 0 :(得分:0)

是的 - 您将要使用createLayer方法,使每个多边形成为自己的子图层......

 cartodb.createLayer(map, {
   user_name: 'mycartodbuser',
   type: 'cartodb',
   sublayers: [{
   sql: "SELECT * FROM table_name",
   cartocss: '#table_name {polygon-fill: #F0F0F0;}'
   },
   {
   sql: "SELECT * FROM table_name",
   cartocss: '#table_name {polygon-fill: #FFFFFF;}'
   }]
 })
 .addTo(map)
 .done(function(layer) {
   //DO STUFF
 });

也许有更好的方法可以做到这一点,但它对我有用。

http://docs.cartodb.com/cartodb-platform/cartodb-js.html