Más

FeatureClick no funcionará en cartoDB

FeatureClick no funcionará en cartoDB


EDITAR: Enlace al repositorio que contiene los archivos. Abre elindex.htmlarchivo en elimportacionesyexportacionescarpetas.

Puedo conseguir todo exceptofeaturecClicktrabajar.

Mi JS:

window.onload = function () {var cartoDbTableName = 'sipri_import_export_map_1950_2014'; var domId = 'mapa'; var mapStyle = document.getElementsByClassName ('estilo de mapa'); var lat = 0; var lon = 0; var zoomLvl = 2; var opciones = {centro: [lat, lon], zoom: zoomLvl}; var mapObject = new L.Map (domId, opciones); var layerSource = {user_name: 'chrismp', tipo: 'cartodb', subcapas: [{sql: "SELECT * FROM" + cartoDbTableName + "WHERE (gwsyear <= 1950 AND gwsyear> 0)", cartocss: mapStyle [0]. innerHTML}]}; L.tileLayer ('http: // {s} .tile.openstreetmap.org / {z} / {x} / {y} .png ">

Necesita definir las columnas de interactividad disponibles en su capa:

cartodb.createLayer (mapa, {tipo: "cartodb", nombre_usuario: nombre_usuario, subcapas: [{sql: "SELECT * FROM tabla", cartocss: myCSS, interactividad: ['cartodb_id', 'atributo1', 'atributo2']} ]})

Para que la interactividad funcione, debe asegurarse de incluir las columnas de su tabla de datos con las que desea interactuar. En su caso, parece que podría estar interesado en elgwsyearcolumna de sus datos.

Debe modificar su código de la siguiente manera dentro de createLayer:

cartodb.createLayer (mapObject, layerSource) .addTo (mapObject) .on ('hecho', función (capa) {layer.getSubLayer (0) .setInteraction (true); layer.getSubLayer (0) .setInteractivity ('gwsyear') ; // es necesario incluir al menos una columna para habilitar la interactividad layer.getSubLayer (0) .on ('featureClick', function (e, latlng, pos, data, subLayerIndex) {console.log (e, latlng, pos, data , subLayerIndex);}). on ('error', function (err) {console.log ('featureClick error:' + err);});}). on ('error', function (err) {console. log (err);});

La diferencia es la suma de:

layer.getSubLayer (0) .layer.getSubLayer (0) .setInteraction (verdadero); layer.getSubLayer (0) .setInteractivity ('gwsyear');

Si no le preocupa qué columna incluir, coloquecartodb_iden cambio, ya que es una columna más agnóstica.


Ver el vídeo: Using CARTO to monetize mobile event data in Telecommunications.