ThinkGeo.com    |     Documentation    |     Premium Support

Is there a TrackInteractiveOverlay at MvcEdition.Map?

 


 Hi,


 I have been studying the Map Suite MVC and I would like custom the TrackOverlay, but I cannot found the TrackInteractiveOverlay at ThinkGeo.MapSuiteMvcEdition.Map





Thanks.

 



Hello Alexandre Honório, 
  
 Thanks for your post, it’s name is EditOverlay in the MVC edition, they have same function. 
  
 Or you want to inherit and override the TrackOverlay? In our MVC edition, we process these overlays in the Client side, so you need process the code in openlayer, and I believe the name is EventOverlay in openlayer. 
  
 Regards, 
  
 Gary

Hi Gary, thanks


I would like override the TrackOverlay like the samples Custom_Track_Line or Ruler_Overlay ( wiki.thinkgeo.com/wiki/Map_Suite_Desktop_Edition_All_Samples#Custom_Track_Line  or wiki.thinkgeo.com/wiki/Map_Suite_Desktop_Edition_All_Samples#Ruler_Overlay ).


I get the "Draw and Edit Shapes" MVC sample, to better understand how EditOverlay works at client side.


Is there any sample code with OpenLayer? 


 


Regards,


Alexandre


 



Hi Alexandre, 



We don't have samples that include OpenLayers JavaScript but we do have a reference document in our Wiki that might be helpful: 

download.thinkgeo.com/docs/mvc/clientapi/



This reference can be found in the MVC Edition Wiki under - API Documentation - Client JavaScript API Documentation: wiki.thinkgeo.com/wiki/Map_S...umentation



Hi Ryan,


 Thanks for the links.


 


Looking at OpenLayers samples I found the OpenLayers.Control.DrawFeature which contains some functions


to draw (examples: insertDirectionLength , insertXY...  openlayers.org/dev/examples/editing-methods.html# )
 
When I start the draw with Map1.setDrawMode('Line') at ThinkGeo, the DrawFeatures are created at Map1.controls
I can get the object DrawFeature for a "Line", it's activate but it does not contain all funtions displayed at OpenLayers DrawFeature API.
 
My steps:
 
I have been render a Map with Html.ThinkGeo().Map("Map1", .... ).Render();
 
Started the draw with < ... onclick="Map1.setDrawMode('Line'); return false; />
 
Draw some line segments, than click < ...  onclick="editShape();return false;" />
 
 
  function editShape() {
 
        var drawFeature = null;
 
        var controls = Map1.getControlsByClass("OpenLayers.Control.DrawFeature");
 
        for (i = 0; i < controls.length; i++)
        {
            if (controls.id == "Line")

 


            {
                drawFeature = controls;

 


                break;
            }
        }
 
        if (drawFeature != null)
        {
    // parseinput just get two values from userInput e returns in an array
            var values = parseInput( window.prompt( "Enter direction and length offset values for new point", "direction, length" ) );
 
            if (values != null)
            {
// Here a get an error
                drawFeature.insertDirectionLength(values[0], values[1]);
 
            }        
        }
 
    }
 
 
I get error because inserDirectionLength does not exist ( is undefined ) at drawFeature, but the object CLASS_NAME is "OpenLayers.Control.DrawFeature"
 
OpenLayers.Control.DrawFeature API
  dev.openlayers.org/releases/OpenLayers-2.11/doc/apidocs/files/OpenLayers/Control/DrawFeature-js.html
  
 
Regards,
Alexandre


 Hello Alexandre,


 
 Sorry I think this is some part of OpenLayer 2.11 missing in our control, because we are planning upgrade to OpenLayer 2.12 recently, so we won't directly fix this bug but by upgrade to 2.12
 
 So here I can provide a workaround that I hope can help you, in this workaround, I have override the missing part and let it work, please have a try, add the code below into your page.

$(document).ready(function () {
         OpenLayers.Control.DrawFeature.prototype.insertDirectionLength = function (direction, length) {
             if (this.handler && this.handler.line) {
                 this.handler.insertDirectionLength(direction, length);
             }
         }
         OpenLayers.Handler.Path.prototype.insertDirectionLength = function (direction, length) {
             direction *= Math.PI / 180;
             var dx = length * Math.cos(direction);
             var dy = length * Math.sin(direction);
             this.insertDeltaXY(dx, dy);
         }
         OpenLayers.Handler.Path.prototype.insertDeltaXY = function (dx, dy) {
             var previousIndex = this.getCurrentPointIndex() - 1;
             var p0 = this.line.geometry.components[previousIndex];
             if (p0 && !isNaN(p0.x) && !isNaN(p0.y)) {
                 this.insertXY(p0.x + dx, p0.y + dy);
             }
         }
         OpenLayers.Handler.Path.prototype.insertXY = function (x, y) {
             this.line.geometry.addComponent(
             new OpenLayers.Geometry.Point(x, y),
             this.getCurrentPointIndex()
         );
             this.drawFeature();
             delete this.redoStack;
         }
         OpenLayers.Handler.Path.prototype.getCurrentPointIndex = function () {
             return this.line.geometry.components.length - 1;
         }
     });

 Please feel free to let us know your queries.
 
 Regards,
 
 Gary


  Thanks Gary, 
  
  Now works perfectly. 
  


Hello Alexandre, 
  
 I’m glad it’s working for you, don’t hesitate to let us know your problems. 
  
 Regards, 
  
 Gary