I have an info template returning a link.
Right now with I click on it it opens to a new browser tab (_blank)
Looking for 2 options.
1. Display this in a DIV
2. Pop this up into a new floating popup
Any ideas
var infoHighwayCameras = new InfoTemplate();
infoHighwayCameras.setTitle("Highway Cameras");
infoHighwayCameras.setContent("<table>" +
"<tr><td id='tblTitle'>Highway Cameras</td><td id='tblTitle2'></td></tr>" +
"<tr><td id='tblTitleLine'></td><td id='tblTitleLine2'></td></tr>" +
"<tr><td></td><td></td></tr>" +
"<tr><td id='tblMainline1'>image_url</td><td id='tblSubline2'><i>For Camera Image <a href='${image_url}' target='_blank'><font color='0x84CCDA'>click here</font></a>."+
"</table><hr>");
Solved! Go to Solution.
Yea they have a Service
This service has a bunch of features in it.
Each feature has a field called image_url
This URL will NOT change...it will reference the SAME .png file every time.
See Below
This is how I think they do it.
I just cant get the InfoTemplate to refresh with the new image.
If you click this link you can see that the popup image is replaced... takes about 5-10 seconds for a new image to be taken.
Jay,
OK this is what I got working on my end:
var infoHighwayCameras = new InfoTemplate();
infoHighwayCameras.setTitle("Highway Cameras");
infoHighwayCameras.setContent(getTextContent);
function getTextContent(graphic) {
return "<table>" +
"<tr><td id='tblTitle'>Highway Cameras</td><td id='tblTitle2'></td></tr>" +
"<tr><td id='tblTitleLine'></td><td id='tblTitleLine2'></td></tr>" +
"<tr><td></td><td></td></tr>" +
"<tr><td id='tblMainline1'>description</td><td id='tblSubline2'> " + graphic.attributes.descriptio + " </td></tr>" +
"<tr><td id='tblSubline2' colspan='2'><img src= " + graphic.attributes.image_url + "?t=" + new Date().getTime() + " /></td></tr>" +
//Notice my little time stamp change to the url above
"</table><hr>";
}
function onLayerUpdateEnd(){
//when the layer is refereshed if the popup has a selected feature then
//force the popup to get the content again
if(map.infoWindow.count > 0){
var graphic = map.infoWindow.getSelectedFeature();
map.infoWindow.setFeatures([graphic]);
}
}
var HighwayCameras = new FeatureLayer("https://services.arcgis.com/DO4gTjwJVIJ7O9Ca/arcgis/rest/services/Camera_Location_VDOT/FeatureServer...", {
mode: FeatureLayer.MODE_ONDEMAND,
visible: true,
opacity: .5,
outFields: ["*"],
infoTemplate: infoHighwayCameras,
refreshInterval: 0.1
});
legendLayers3.push({
layer: HighwayCameras,
title: 'Highway Cameras'
});
HighwayCameras.on('update-end', onLayerUpdateEnd);
I put this code in and I get an error: Uncaught SyntaxError: Unexpected token if
var infoHighwayCameras = new InfoTemplate();
infoHighwayCameras.setTitle("Highway Cameras");
infoHighwayCameras.setContent(getTextContent);
function getTextContent(graphic) {
return "<table>" +
"<tr><td id='tblTitle'>Highway Cameras</td><td id='tblTitle2'></td></tr>" +
"<tr><td id='tblTitleLine'></td><td id='tblTitleLine2'></td></tr>" +
"<tr><td></td><td></td></tr>" +
"<tr><td id='tblMainline1'>description</td><td id='tblSubline2'> " + graphic.attributes.descriptio + " </td></tr>" +
"<tr><td id='tblSubline2' colspan='2'><img src= " + graphic.attributes.image_url + "?t=" + new Date().getTime() + " /></td></tr>" +
//Notice my little time stamp change to the url above
"</table><hr>";
}
function onLayerUpdateEnd()
//when the layer is refereshed if the popup has a selected feature then
//force the popup to get the content again
if(map.infoWindow.count > 0){
var graphic = map.infoWindow.getSelectedFeature();
map.infoWindow.setFeatures([graphic]);
}
}
var HighwayCameras = new FeatureLayer("https://services.arcgis.com/DO4gTjwJVIJ7O9Ca/arcgis/rest/services/Camera_Location_VDOT/FeatureServer...", {
mode: FeatureLayer.MODE_ONDEMAND,
visible: true,
opacity: .5,
outFields: ["*"],
infoTemplate: infoHighwayCameras,
refreshInterval: 0.1
});
legendLayers3.push({
layer: HighwayCameras,
title: 'Highway Cameras'
});
HighwayCameras.on('update-end', onLayerUpdateEnd);
Think I got it... function onLayerUpdateEnd(){ missing the { on the Function
Testin now
Thats it....yes the image refreshed automatically.....GREAT....thanks for your help so very appreciated.