Hello All, I am working on a custom widget which display a series of images and zooms to a location when click an image. Each image corresponds one point on the map. Please see codes below. I was able to successfully display the images. How to add a onclick event on each image so when users click it map is going to zoom to the location where the image was taken? Appreciate your comments!
_maplayer:'http://......'
startup: function() {
this.inherited(arguments);
this._query(this._maplayer);
},
_query: function(mapLayer){
var query = new Query();
query.where = "Id > 0";
query.outFields = [ID"];
query.returnGeometry = true;
var queryTask = new QueryTask(mapLayer);
queryTask.on("complete", this._queryTaskExecuteCompleteHandler);
queryTask.execute(query, this._showResults);
},
_showResults: function(featureSet){
var features = featureSet.features;
var resultUl = new Builder('<ul />');
for (i = 0; i < features.length; i++){
resultUl.append('<li><img src="./images/' + features.attributes.ID + '.jpg" height="200" width="250"</li>');
}
dom.byId('pictures').innerHTML = resultUl;
}
