We are currently using the Street View PopUp widget that uses dual maps to create the street view content in the widget. We are in State Plane coordinates so I'm using our geometry service to convert the coordinates from the map click to lat and long to be passed into the URL for google. The problem I'm seeing is script doesn't provide enough time for the conversion to complete before returning the results. If I set an alert, it works perfectly and allows enough time to send the correct values. I have tried setTimeout(), and a for loop, but nothing seems to work. Any help would be appreciated.
onOpen: function () {
var _popWidth = this.config.popWidth;
var _popHeight = this.config.popHeight;
var _symbolStyle = this.config.symbolStyle;
var _symbolColor = this.config.symbolColor;
var _symbolSize = this.config.symbolSize;
var _popScroll = this.config.popScroll;
var _panel = this.config.panel;
var _gm = this.config.gm;
var _bm = this.config.bm;
var _md = this.config.md;
var _mi = this.config.mi;
this.map.setInfoWindowOnClick(false); // added this to fix popup issue
this.map.setMapCursor("pointer");
//wire up map on click event
mapClick = this.map.on("click", lang.hitch(this, function (evt) {
this.map.graphics.clear();
var x, y, point, pPoint;
var outSR = new SpatialReference(3857);
point = evt.mapPoint;
//alert(point.x);
var newPoint;
newPoint = evt.mapPoint;
var params = new esri.tasks.ProjectParameters(evt.mapPoint);
params.geometries = [point];
params.outSR = outSR;
params.transformForward = true;
params.transformation = 1515;
gsvc.project(params, function(outputpoint){
newPoint.x = outputpoint[0].x;
newPoint.y = outputpoint[0].y;
});
var symbol = new SimpleMarkerSymbol().setStyle(_symbolStyle);
symbol.setColor(_symbolColor);
symbol.setSize(_symbolSize);
var gclick = new Graphic(point, symbol);
//this.mapIdNode.graphics.Add(gclick);
this.map.graphics.add(gclick);
alert("The Streetview popup provides additional reference data originating from Google");
var geoPoint = new esri.geometry.webMercatorToGeographic(evt.mapPoint);
//console.info(evt.mapPoint.x);
var dMap = document.getElementById('dualMap');
var path = "http://data.mapchannels.com/mm/dual/map.htm?lat=" + geoPoint.y + "&lng=" + geoPoint.x + "&panel=" + _panel + "&gm=" + _gm + "&mi=" + _mi;
//var path = "widgets/StreetViewPopup/dualmaps/streetmap.html?lat=" + geoPoint.y + "&lng=" + geoPoint.x + "&panel=" + _panel + "&gm=" + _gm + "&mi=" + _mi;
dMap.innerHTML = '<iframe id="dMaps" style="width:' + _popWidth + 'px;height:' + _popHeight + 'px; padding:0px" src="' + path + '" marginwidth="0" marginheight="0" frameborder="0"></iframe>';
dMap.style.visibility = 'visible';
// HH auto adjust the street view window size
this.onMaximize();
return point;
}));
},
Solved! Go to Solution.
Martin,
The solution to this is simple don't try to open the window until the projection is done:
onOpen: function () {
var _popWidth = this.config.popWidth;
var _popHeight = this.config.popHeight;
var _symbolStyle = this.config.symbolStyle;
var _symbolColor = this.config.symbolColor;
var _symbolSize = this.config.symbolSize;
var _popScroll = this.config.popScroll;
var _panel = this.config.panel;
var _gm = this.config.gm;
var _bm = this.config.bm;
var _md = this.config.md;
var _mi = this.config.mi;
this.map.setInfoWindowOnClick(false); // added this to fix popup issue
this.map.setMapCursor("pointer");
//wire up map on click event
mapClick = this.map.on("click", lang.hitch(this, function (evt) {
this.map.graphics.clear();
var x, y, point;
var outSR = new SpatialReference(3857);
point = evt.mapPoint;
var newPoint;
//newPoint = evt.mapPoint;
var params = new esri.tasks.ProjectParameters();
params.geometries = [point];
params.outSR = outSR;
params.transformForward = true;
params.transformation = 1515;
gsvc.project(params, lang.hitch(this, function(outputpoint){
//newPoint.x = outputpoint[0].x;
//newPoint.y = outputpoint[0].y;
var geoPoint = new esri.geometry.webMercatorToGeographic(outputpoint[0]);
var dMap = document.getElementById('dualMap');
var path = "http://data.mapchannels.com/mm/dual/map.htm?lat=" + geoPoint.y + "&lng=" + geoPoint.x + "&panel=" + _panel + "&gm=" + _gm + "&mi=" + _mi;
dMap.innerHTML = '<iframe id="dMaps" style="width:' + _popWidth + 'px;height:' + _popHeight + 'px; padding:0px" src="' + path + '" marginwidth="0" marginheight="0" frameborder="0"></iframe>';
dMap.style.visibility = 'visible';
this.onMaximize();
}));
var symbol = new SimpleMarkerSymbol().setStyle(_symbolStyle);
symbol.setColor(_symbolColor);
symbol.setSize(_symbolSize);
var gclick = new Graphic(point, symbol);
//this.mapIdNode.graphics.Add(gclick);
this.map.graphics.add(gclick);
}));
},
Martin,
The solution to this is simple don't try to open the window until the projection is done:
onOpen: function () {
var _popWidth = this.config.popWidth;
var _popHeight = this.config.popHeight;
var _symbolStyle = this.config.symbolStyle;
var _symbolColor = this.config.symbolColor;
var _symbolSize = this.config.symbolSize;
var _popScroll = this.config.popScroll;
var _panel = this.config.panel;
var _gm = this.config.gm;
var _bm = this.config.bm;
var _md = this.config.md;
var _mi = this.config.mi;
this.map.setInfoWindowOnClick(false); // added this to fix popup issue
this.map.setMapCursor("pointer");
//wire up map on click event
mapClick = this.map.on("click", lang.hitch(this, function (evt) {
this.map.graphics.clear();
var x, y, point;
var outSR = new SpatialReference(3857);
point = evt.mapPoint;
var newPoint;
//newPoint = evt.mapPoint;
var params = new esri.tasks.ProjectParameters();
params.geometries = [point];
params.outSR = outSR;
params.transformForward = true;
params.transformation = 1515;
gsvc.project(params, lang.hitch(this, function(outputpoint){
//newPoint.x = outputpoint[0].x;
//newPoint.y = outputpoint[0].y;
var geoPoint = new esri.geometry.webMercatorToGeographic(outputpoint[0]);
var dMap = document.getElementById('dualMap');
var path = "http://data.mapchannels.com/mm/dual/map.htm?lat=" + geoPoint.y + "&lng=" + geoPoint.x + "&panel=" + _panel + "&gm=" + _gm + "&mi=" + _mi;
dMap.innerHTML = '<iframe id="dMaps" style="width:' + _popWidth + 'px;height:' + _popHeight + 'px; padding:0px" src="' + path + '" marginwidth="0" marginheight="0" frameborder="0"></iframe>';
dMap.style.visibility = 'visible';
this.onMaximize();
}));
var symbol = new SimpleMarkerSymbol().setStyle(_symbolStyle);
symbol.setColor(_symbolColor);
symbol.setSize(_symbolSize);
var gclick = new Graphic(point, symbol);
//this.mapIdNode.graphics.Add(gclick);
this.map.graphics.add(gclick);
}));
},
Wow I can't believe it was that easy. Thanks Robert!