topic Set a timeout in a javascript funtion for Streetview PopUp in Web AppBuilder Custom Widgets Questions

Set a timeout in a javascript funtion for Streetview PopUp

MartinOwens1 — Mon, 22 Jan 2018 14:54:41 GMT

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;

}));

},

Re: Set a timeout in a javascript funtion for Streetview PopUp

RobertScheitlin__GISP — Sun, 12 Dec 2021 10:40:54 GMT

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);
  }));

},‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Set a timeout in a javascript funtion for Streetview PopUp

MartinOwens1 — Mon, 22 Jan 2018 15:24:55 GMT

Wow I can't believe it was that easy. Thanks Robert!