I have a question related to the cartodb infobox. I want it to always appear on the same place on the map even if a click on a point that is not in the center (where I want to to open). I am using the cartodd.js library and google API one. I am here seeking for help since I am not an expert in programming.
var map;
var google_api_key = "ljkjGcnvIaN-4HXq45A7Q-HD"
function main() {
//var google_api_key = "ljkjGcnvIaN-4HXq45A7Q-HD"
// Map center
var myLatlng = new google.maps.LatLng(42.358, -71.07);
var myOptions = {
zoom: 14,
center: myLatlng,
disableDefaultUI: true,
zoomControl: true,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
// Render basemap
map = new google.maps.Map(document.getElementById("map"), myOptions);
// Put layer data into a JS object
var layerSource = 'http://ift.tt/1vWhvnO';
// For storing the sublayers
var sublayers = [];
var cdbOptions = {
cartodb_logo: false,
mobile_layout: true
}
// Add data layer to your map
cartodb.createLayer(map,layerSource, cdbOptions)
.addTo(map)
.done(function(layer) {
//console.log(layer);
var num_sublayers = layer.getSubLayerCount();
for (var i = 0; i < num_sublayers; i++) {
sublayers[i] = layer.getSubLayer(i);
//console.log(sublayers[i]);
}
var sublayer0Shown = true;
$("#sublayer0").on('click', function() {
if (sublayer0Shown) {
sublayers[0].hide();
sublayers[1].hide();
$("#switch1").removeClass('right switch enabled');
$("#switch1").addClass('right switch disabled');
} else {
sublayers[0].show();
sublayers[1].show();
$("#switch1").removeClass('right switch disabled');
$("#switch1").addClass('right switch enabled');
}
sublayer0Shown = !sublayer0Shown;
});
var sublayer1Shown = true;
$("#sublayer1").on('click', function() {
if (sublayer1Shown) {
sublayers[2].hide();
sublayers[3].hide();
$("#switch2").removeClass('right switch enabled');
$("#switch2").addClass('right switch disabled');
} else {
sublayers[2].show();
sublayers[3].show();
$("#switch2").removeClass('right switch disabled');
$("#switch2").addClass('right switch enabled');
}
sublayer1Shown = !sublayer1Shown;
});
})
.error(function(err) {
console.log("error: " + err);
});
}
window.onload = main;
</script>
Aucun commentaire:
Enregistrer un commentaire