Display URL with coords in Measurement Widget

GeraldStanuch — Tue, 20 Feb 2018 21:32:00 GMT

As shown in my attachment, how in the code do I add a URL to the Measurement Widget that uses the coordinates shown within the standard Measurement Widget?

Re: Display URL with coords in Measurement Widget

RobertScheitlin__GISP — Tue, 20 Feb 2018 22:01:51 GMT

Gerald,

Do you mean a hyperlink?

Re: Display URL with coords in Measurement Widget

RobertScheitlin__GISP — Sun, 12 Dec 2021 10:13:11 GMT

Gerald,

Here is the widget (version 2.7) updated to have the feature you want you just need to tweak the url:

Line 95 is where the url is constructed.

///////////////////////////////////////////////////////////////////////////
// Copyright © 2014 - 2017 Esri. All Rights Reserved.
//
// Licensed under the Apache License Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
//    http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
///////////////////////////////////////////////////////////////////////////

define([
    'dojo/_base/declare',
    'dojo/_base/lang',
    'dojo/aspect',
    'dojo/Deferred',
    'dijit/_WidgetsInTemplateMixin',
    'jimu/BaseWidget',
    'jimu/portalUtils',
    'jimu/dijit/Message',
    'esri/units',
    'esri/dijit/Measurement',
    "esri/symbols/jsonUtils",
    "dojo/dom-construct",
    "dojo/query",
    "dojo/_base/array"
  ],
  function(
    declare,
    lang,
    aspect,
    Deferred,
    _WidgetsInTemplateMixin,
    BaseWidget,
    PortalUtils,
    Message,
    esriUnits,
    Measurement,
    jsonUtils,
    domConstruct,
    query,
    array) {
    var clazz = declare([BaseWidget, _WidgetsInTemplateMixin], {

      name: 'Measurement',
      measurement: null,
      _pcDef: null,

      startup: function() {
        if (this.measurement || this._pcDef) {
          return;
        }
        this.inherited(arguments);

        var json = this.config.measurement;
        json.map = this.map;
        if (json.lineSymbol) {
          json.lineSymbol = jsonUtils.fromJson(json.lineSymbol);
        }
        if (json.pointSymbol) {
          json.pointSymbol = jsonUtils.fromJson(json.pointSymbol);
        }

        this._processConfig(json).then(lang.hitch(this, function(measurementJson) {
          this.measurement = new Measurement(measurementJson, this.measurementDiv);
          this.own(aspect.after(this.measurement, 'setTool', lang.hitch(this, function() {
            //Remove all the rows of locations added by the code
            var rows = query(".myMeasurementTableRow");
            array.forEach(rows, function (row) {
              domConstruct.destroy(row);
            });
            if (this.measurement.activeTool) {
              this.disableWebMapPopup();
            } else {
              this.enableWebMapPopup();
            }
          })));

          this.measurement.on("measure-end", function (evt) {
            switch (evt.toolName) {
            case "location":
              //Remove all the rows of locations added by the code
              var rows = query(".myMeasurementTableRow");
              array.forEach(rows, function (row) {
                domConstruct.destroy(row);
              });
              var tbl = query(".esriMeasurementResultTable tbody")[0];
              var row = domConstruct.toDom("<tr class='myMeasurementTableRow'>" +
                "<td> </td>" +
                "<td class='esriMeasurementTableCell' colspan='2'><a target='_blank' href='http://www.esri.com?lat=" + evt.values[1] + "&lon=" + evt.values[0] + "'>My Hyperlink</a></td></tr>");
              domConstruct.place(row, tbl);
              break;
            default:
              var resultDiv = query(".esriMeasurementResultValue")[0];
              var result = domConstruct.toDom("<div class='result'>" + evt.values[0] + "<div>");
              domConstruct.place(resultDiv, result);
              break;
            }
          });

          this.measurement.startup();

          this._hideToolsByConfig();
        }), lang.hitch(this, function(err) {
          new Message({
            message: err.message || err
          });
        }));
      },



      _processConfig: function(configJson) {
        this._pcDef = new Deferred();
        if (configJson.defaultLengthUnit && configJson.defaultAreaUnit) {
          this._pcDef.resolve(configJson);
        } else {
          PortalUtils.getUnits(this.appConfig.portalUrl).then(lang.hitch(this, function(units) {
            configJson.defaultAreaUnit = units === 'english' ?
              esriUnits.SQUARE_MILES : esriUnits.SQUARE_KILOMETERS;
            configJson.defaultLengthUnit = units === 'english' ?
              esriUnits.MILES : esriUnits.KILOMETERS;
            this._pcDef.resolve(configJson);
          }), lang.hitch(this, function(err) {
            console.error(err);
            configJson.defaultAreaUnit = esriUnits.SQUARE_MILES;
            configJson.defaultLengthUnit = esriUnits.MILES;
            this._pcDef.resolve(configJson);
          }));
        }

        return this._pcDef.promise;
      },

      _hideToolsByConfig: function() {
        if (false === this.config.showArea) {
          this.measurement.hideTool("area");
        }
        if (false === this.config.showDistance) {
          this.measurement.hideTool("distance");
        }
        if (false === this.config.showLocation) {
          this.measurement.hideTool("location");
        }
      },

      disableWebMapPopup: function() {
        this.map.setInfoWindowOnClick(false);
      },

      enableWebMapPopup: function() {
        this.map.setInfoWindowOnClick(true);
      },

      onDeActive: function() {
        this.onClose();
      },

      onClose: function() {
        if (this.measurement && this.measurement.activeTool) {
          this.measurement.clearResult();
          this.measurement.setTool(this.measurement.activeTool, false);
        }
      },

      destroy: function() {
        if (this.measurement) {
          this.measurement.destroy();
        }
        this.inherited(arguments);
      }
    });
    return clazz;
  });
‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

topic Display URL with coords in Measurement Widget in Web AppBuilder Custom Widgets Questions

Display URL with coords in Measurement Widget

Re: Display URL with coords in Measurement Widget

Re: Display URL with coords in Measurement Widget