Daha çox

XüsusiyyətClick kartoDB-də işləməyəcəkdir


EDIT: Faylları ehtiva edən repoya keçid. Açınindex.htmlfaylınıidxalixracatqovluqlar.

Mən xaricində hər şeyi əldə edə bilərəmfeaturecClickişləmək.

Mənim JS:

window.onload = function () {var cartoDbTableName = 'sipri_import_export_map_1950_2014'; var domId = 'xəritə'; var mapStyle = document.getElementsByClassName ('xəritə tərzi'); var lat = 0; var lon = 0; var zoomLvl = 2; var options = {center: [lat, lon], zoom: zoomLvl}; var mapObject = yeni L.Map (domId, seçimlər); var layerSource = {user_name: 'chrismp', type: 'cartodb', sublayers: [{sql: "SELECT * FROM" + cartoDbTableName + "WHERE (gwsyear <= 1950 AND gwsyear> 0)", cartocss: mapStyle [0]. içHTML}]}; L.tileLayer ('http: // {s} .tile.openstreetmap.org / {z} / {x} / {y} .png ">

Qatınızdakı mövcud interaktiv sütunları təyin etməlisiniz:

cartodb.createLayer (xəritə, {növü: "cartodb", user_name: userName, sublayers: [{sql: "SELECT * FROM table", cartocss: myCSS, interactivity: ['cartodb_id', 'attribute1', 'attribute2']} ]})

İnteraktivliyi işlək vəziyyətə gətirmək üçün qarşılıqlı əlaqə qurmaq istədiyiniz verilənlər bazasının sütunlarını daxil etdiyinizə əmin olmalısınız. Sizin vəziyyətinizdə, maraqlı ola bilər kimi görünürgwsyearməlumatlarınızın sütunu.

CreateLayer daxilində kodunuzu aşağıdakı kimi dəyişdirməlisiniz:

cartodb.createLayer (mapObject, layerSource) .addTo (mapObject) .on ('done', function (layer) {layer.getSubLayer (0) .setInteraction (true); layer.getSubLayer (0) .setInteractivity ('gwsyear')) ; // interaktivliyi təmin etmək üçün ən azı bir sütun daxil etməlisiniz qat.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 (səhv);});

Fərq aşağıdakıların əlavə edilməsidir:

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

Hansı sütunu əlavə edəcəyinizdən narahat deyilsinizsə, qoyuncartodb_idəvəzinə daha aqnostik bir sütun olduğu üçün.


Videoya baxın: Learning CartoCSS with CartoDB (Oktyabr 2021).