Modifications to the Measurement Widget

[BryanLynn]

Two questions:
1 - how do you change the text style for the units.  I have tried several things and can't get it to work correctly.  The basic problem is the font for the units is a different size than any of the other text on the form.

2 - is it possible to get projected coordinates from the maps rather than just longitude and latitude?  All of our maps are in state plane coordinate systems.

Thanks,
Bryan

[BenFousek]

1. Use the FireBug plugin for Firefox to inspect the element, and use css to override the default style.

2. To reproject geometry you'll need to use an ArcGIS Server GeometryServer's Project operation. I don't know if you can do that with the out-of-box measure widget. Sounds like you need to write your own widget to meet your specific needs.

[BryanLynn]

Thanks for the tip on the CSS - found it and have it working correctly now.

However, question #2 still puzzles me to no end.  I get the coordinates I want from the location tool.  I can see them when the onMeasureEvent fires.  The widget then converts them to something I don't want.  Seems to me the obvious/default choice should be map coordinates.

[BenFousek]

I'm not going to be able to help on that too much. I've never used the out-of-the-box measure widget. I wrote my own before the api came with one. It's hard to alter the behavior of any dojo based widget without editing the code. The problem with the esri namespace is all js files start with:

/*
 COPYRIGHT 2009 ESRI

 TRADE SECRETS: ESRI PROPRIETARY AND CONFIDENTIAL
 Unpublished material - all rights reserved under the
 Copyright Laws of the United States and applicable international
 laws, treaties, and conventions.

 For additional information, contact:
 Environmental Systems Research Institute, Inc.
 Attn: Contracts and Legal Services Department
 380 New York Street
 Redlands, California, 92373
 USA

 email: contracts@esri.com
 */

I've certainly studied a good portion of the esri namespace code to better understand the api, but I've been reluctant to copy their code or edit widgets, except to fix a few minor bugs in real time. Do on to others...right? It's much more satisfying to write your own anyway. I hope you figure it out and if you decide to write your own good luck!

[DavideLimosani]

You can try with

outSR = new esri.SpatialReference({wkid:102100}); // change with your map spatialReference

dojo.connect(measurement, "onMeasureEnd", function(activeTool,geometry){
 
 
  esri.config.defaults.geometryService.project([geometry], outSR, function (projectedPoints) {
                          
  var contentPane = dojo.byId("dijit_layout_ContentPane_1");
  contentPane.innerHTML = "X: " +   projectedPoints[0].x + "<br> Y: " + projectedPoints[0].y
   });
 });

[BryanLynn]

@dlimos - thanks for the tip.  Did exactly what I needed for a short term fix.

@btfou - I think you misunderstood - I'm not wanting to hack/steal their code.  I simply want to extend it (fairly common for Silverlight API).  I am also not opposed to writing my own - which maybe where I end up - I just need something quick and would prefer to stick with OOTB functionality.  I have been down the custom road before and been burned too many times.

Thanks to both of you for the help.

[JohnGravois]

@dlimos thanks for sharing your approach!

i logged an enhancement a while back requesting that the widget be extended to support output in projected coordinates as well, but haven't seen much customer interest since.

[NIM073060: For location tool in Measurement Widget,  include option to toggle between projected coordinates and lat/long.]

if you are interested in this issue, please feel free to log a tech support call and request to be added to the above NIM.  This helps our developers prioritize their work.

[BenFousek]

@btfou - I think you misunderstood - I'm not wanting to hack/steal their code.  I simply want to extend it (fairly common for Silverlight API).  I am also not opposed to writing my own - which maybe where I end up - I just need something quick and would prefer to stick with OOTB functionality.  I have been down the custom road before and been burned too many times.

I wasn't suggesting that you would. And maybe it's perfectly legit to copy an esri widget's code and rewrite as your own. I personally don't see it that way. It seems that my experience has been the opposite of yours in that I've had more success creating my own and getting exactly the functionality and result I want.

[JianHuang · Accepted solution]

Two questions:
1 - how do you change the text style for the units.  I have tried several things and can't get it to work correctly.  The basic problem is the font for the units is a different size than any of the other text on the form.

2 - is it possible to get projected coordinates from the maps rather than just longitude and latitude?  All of our maps are in state plane coordinate systems.

Thanks,
Bryan

Bryan,

Please take a look at the document of measurement widget: http://help.arcgis.com/en/webapi/javascript/arcgis/help/jsapi_start.htm#jsapi/measurement.htm

1. Modifying the CSS .unitDropDown will change the font size of the unit list. For example:
.unitDropDown{
        font-size:26px ;
      }

2. Connecting to the onMeasureEnd event and replace the output value will overwrite the result. If you want to show the coordinate values under the current map spatial reference, here is the code snippet:
dojo.connect(measurement, "onMeasureEnd", function(toolName, geometry){
     measurement.resultValue.domNode.innerHTML = "x: "+ geometry.x + "<br/>y: " + geometry.y;
   });

[BryanLynn]

@jgravois - thanks for letting me know.  I will log it as a request.  Seems logical that it should default to the map's coordinate system.

@Jian - thanks for the snippet it worked like a charm with one simple modification - I added a check for the location tool.  For example:  if (toolName == "location") { ... }

For anyone else that stumbles upon this here is my final solution (for now) showing both the original results and the XY coordinates from the map:

            dojo.connect(measurement, "onMeasureEnd", function (toolName, geometry) {
                if (toolName == "location") {
                    var resultValue = measurement.resultValue.domNode.innerHTML;
                    var stateCoords = "XY: " + Math.round(geometry.x).toString() + ", " + Math.round(geometry.y).toString();

                    measurement.resultValue.domNode.innerHTML = resultValue + "<br /><br />" + stateCoords;
                }
            });