ThinkGeo.com    |     Documentation    |     Premium Support

Legend moving with the MAP?

#1

Hi,



looks like that when moving the map to the left/right/up/down the legend move as well… doesn’t looks good from user point of view.



thanks.



jm




#2

Hi Jean, 
  
 Could you give us some more detail on how you setup the legend layer? 
  
 Thanks, 
 Jack

#3

Hi JM, 



Seems like Lee has some misunderstanding here. Sorry for this. Actually, there are 2 groups in MvcEdition, one is layer from MapSuiteCore namespace, and another one is Overlay from MvcEdition namespace. Overlay is actually one
 including some images in the Map’s Div, while Layer is a server side concept, for example, we have 3 layers, if we need to display them in the MvcEdition, we need to these 3 layers into 1 layerOverlay which will be Div in the map. and then we will create an image and draw these 3 layers into this created image. in other words, they share the same one overlay in the map, this overlay will work like other overlay when moving the map. I agree with you that it doesn’t looks good from user point of view, but it makes sense from this point.  



To make its position fixed when moving the map, please try adding legend layer into AdormentOverlay of the map object, it should work as you expected. 



Thanks, 

Johnny  





#4

Hi JM, 
  
 Seems like there is some misunderstanding from Lee. Sorry for this. Actually, there are 2 groups in MvcEdition, one is layer from MapSuiteCore namespace, and another one is Overlay from MvcEdition namespace. Overlay is actually one  including some images in the Map’s Div, while Layer is a server side concept, for example, we have 3 layers, if we need to display them in the MvcEdition, we need to these 3 layers into 1 layerOverlay which will be Div in the map. and then we will create an image and draw these 3 layers into this created image. in other words, they share the same one overlay in the map, this overlay will work like other overlay when moving the map. I agree with you that it doesn’t looks good from user point of view, but it makes sense from this point.  
  
 To make its position fixed when moving the map, please try adding legend layer into AdormentOverlay of the map object, it should work as you expected. 
  
 Thanks, 
 Johnny  
  


#5

Hi Johnny, 
  
 thanks for the explanations!  however it didn’t work… 
  
 I have created the LegendAdornmentLayer and then added it to map.AdornmentOverlay.Layers but the result is not good at all. 
  
 here is my code: 
  
     map.AdornmentOverlay.Layers.Add(BuildLegend()); 
  
         } 
         private static LegendAdornmentLayer BuildLegend() 
         { 
             LegendItem legendItem1 = new LegendItem(); 
             legendItem1.ImageStyle = new PointStyle(PointSymbolType.Circle, new GeoSolidBrush(GeoColor.FromArgb(100, 120, 200, 140)), 16); 
             legendItem1.TextStyle = new TextStyle(“Current”, new GeoFont(“Arial”, 8), new GeoSolidBrush(GeoColor.SimpleColors.Black)); 
  
             LegendItem legendItem2 = new LegendItem(); 
             legendItem2.ImageStyle = new PointStyle(PointSymbolType.Triangle, new GeoSolidBrush(GeoColor.StandardColors.Blue), 16); 
             legendItem2.TextStyle = new TextStyle(“Asset”, new GeoFont(“Arial”, 8), new GeoSolidBrush(GeoColor.SimpleColors.Black)); 
  
             LegendAdornmentLayer legendLayer = new LegendAdornmentLayer(); 
             legendLayer.BackgroundMask = AreaStyles.CreateLinearGradientStyle(new GeoColor(255, 255, 255, 255), new GeoColor(255, 230, 230, 230), 90, GeoColor.SimpleColors.Black); 
             legendLayer.LegendItems.Add(legendItem1); 
             legendLayer.LegendItems.Add(legendItem2); 
             legendLayer.Width = 100; 
             legendLayer.Height = 80; 
  
             LegendItem title = new LegendItem(); 
             title.TextStyle = new TextStyle(“Symbols”, new GeoFont(“Arial”, 10, DrawingFontStyles.Bold), new GeoSolidBrush(GeoColor.SimpleColors.Black)); 
             title.RightPadding = 0; 
             title.ImageJustificationMode = LegendImageJustificationMode.JustifyImageLeft; 
             title.TextLeftPadding = 0; 
  
             legendLayer.Title = title; 
  
             legendLayer.Location = AdornmentLocation.CenterRight; 
             return legendLayer; 
         }

#6

Hi JM, 
  
 Actually AdomentOverlay has a bug, we are trying to  fix it, but it is a little complex, would you please wait a little while before we fix it? 
  
 Best Regards 
  
 Summer

#7

Thanks for the update!   it could be very nice to add a click event on a legend item!!!

#8

Hi JM, 



Any progress for the bug fix will be updated here immediately, and about “click event on a legend item”, I am sorry to say that it is a little hard to do in our core, but it could be acheived in javascript, but it is complex to fulfill it because the legendlayer on client side is just a image, and right now we don’t have enough resource for it. if you need this function immediately, your account rep can contact you for a professional services.  



Best Regards 



Summer

#9

I also had issues with the legendAdornmentLayer, but I was able to get around them by creating my own LegendItem. For us the issue was all about the sizing of the legend based on the width of the legend text, it would truncate it off, if we tired to make the area larger for the legend box by setting the layer width, then the text would get larger and still truncate.

I included the class we use now to get around the issue.



After you create a legend item, and before you add it to the legend layer, you will need to adjust the legend layer width. See the code below.



To get access to the legend on the client side, we used java script.

  var legendElementId = Map.getLayersByName( "LegendAdornment" )[0].grid[0][0].imgDiv.id;



We did some experimenting with moving the legend, but did not spend very much time with it.







C# code for customlegend item.


public class CustomLegendItem : LegendItem
   {
       public CustomLegendItem( )
       {
       }
 
       public CustomLegendItem( int width, int height, float imageWidth, float imageHeight, Style imageStyle, TextStyle textStyle )
           : base( width, height, imageWidth, imageHeight, imageStyle, textStyle )
       {
       }
 
 
       protected override void DrawCore( GeoCanvas adornmentGeoCanvas, Collection<SimpleCandidate> labelsInAllLayers, LegendDrawingParameters legendDrawingParameters )
       {
           float num1 = 1;
           float xoffset = legendDrawingParameters.XOffset;
           float yoffset = legendDrawingParameters.YOffset;
           float num2 = yoffset + this.TopPadding + this.ImageTopPadding;
           float num3 = yoffset + this.TopPadding + this.TextTopPadding;
           DrawingRectangleF drawingRectangleF = new DrawingRectangleF( );
           if ( this.TextStyle != null )
           {
               string text = this.TextStyle.TextColumnName;
               drawingRectangleF = adornmentGeoCanvas.MeasureText( text, this.TextStyle.Font );
           }
           float num4;
           float num5;
           if ( this.ImageJustificationMode == LegendImageJustificationMode.JustifyImageRight )
           {
               num4 = xoffset + this.LeftPadding + this.TextLeftPadding + drawingRectangleF.Width + this.TextRightPadding + this.ImageLeftPadding;
               num5 = xoffset + this.LeftPadding + this.TextLeftPadding;
           }
           else
           {
               num4 = (float) ((double) xoffset + (double) this.LeftPadding * (double) num1 + (double) this.ImageLeftPadding * (double) num1);
               num5 = (float) ((double) xoffset + (double) this.LeftPadding * (double) num1 + (double) this.ImageLeftPadding * (double) num1 + (double) this.ImageWidth * (double) num1 + (double) this.ImageRightPadding * (double) num1 + (double) this.TextLeftPadding * (double) num1);
           }
           if ( this.BackgroundMask != null )
           {
               DrawingRectangleF drawingExtent = new DrawingRectangleF( this.Width / 2f + xoffset + this.LeftPadding, this.Height / 2f + yoffset + this.TopPadding, this.Width, this.Height );
               this.BackgroundMask.DrawSample( adornmentGeoCanvas, drawingExtent );
           }
           if ( this.ImageStyle != null )
           {
               float width = this.ImageWidth;
 
               float height = this.ImageHeight;
 
               DrawingRectangleF drawingExtent = new DrawingRectangleF( width / 2f + num4, (float) ((double) height / 2.0 + (double) num2 * (double) num1), width, height );
 
               this.ImageStyle.DrawSample( adornmentGeoCanvas, drawingExtent );
 
               if ( this.ImageMask != null )
                   this.ImageMask.DrawSample( adornmentGeoCanvas, drawingExtent );
           }
           if ( this.TextStyle == null )
           {
               return;
           }
           DrawingRectangleF drawingExtent1 = new DrawingRectangleF( drawingRectangleF.CenterX + num5, drawingRectangleF.CenterY + num3 * num1, drawingRectangleF.Width, drawingRectangleF.Height );
 
           this.TextStyle.DrawSample( adornmentGeoCanvas, drawingExtent1 );
 
           if ( this.TextMask == null )
               return;
 
           this.TextMask.DrawSample( adornmentGeoCanvas, drawingExtent1 );
       }
   }


private void DetermineLegendWitdh( LegendAdornmentLayer legendLayer, CustomLegendItem legendItem )
     {
         SetLegendItemWidth( legendItem );
 
         if ( legendItem.Width > legendLayer.Width )
         {
             legendLayer.Width = legendItem.Width;
         }
     }


private static void SetLegendItemWidth( CustomLookLegendItem legendItem )
       {
           var fudgeFactor = 10;
           var lineWidth = (int)new GdiPlusGeoCanvas( ).MeasureText( legendItem.TextStyle.TextColumnName, legendItem.TextStyle.Font ).Width;
           var totalImageLength = legendItem.ImageWidth + legendItem.ImageLeftPadding + legendItem.ImageRightPadding;
           var totalTextLength = legendItem.TextLeftPadding + legendItem.TextRightPadding + lineWidth;
           legendItem.Width = totalImageLength + totalTextLength + fudgeFactor;
       }


#10

Hi Rick,


We tried to recreate your problem with the new dlls(7.0.55.0), but the problem  still didn't show up, when the legendlayer width is larger the text size didn't change with the legendlayer width. Following pictures are the result of our test.


Width=100:


Width=200:


Another thing for your information is that, if the text needs to be wrapped, we could simply add "\n" in the string that we want to display:


Hope it helps


Summer



#11

Hi JM, 
  
 We have fixed the legend issue, would you please get the latest version 7.0.58.0 or 7.0.0.58 and try it again?  
  
 if you have any more question , please feel free to let us know. 
  
 Best Regards 
  
 Summer

#12

Hi Summer, 
  
 just downloaded version MvcEditionFull7.0.69.0DllPackage.zip but still not working… Just in case, I have cleared everything from cache point of view.  
  
 jm.

#13

Hi JM,



Thanks for your further information, we tried to recreate your problem, but it didn’t show up on our end, following is a test vedio on our end:    screencast.com/t/cc5JdGwlc6 , attached is our test code, would you please check it and tell us what we miised?



Waiting for your further information.



Summer

Post11428.txt (2.73 KB)

#14

Hi Summer, 
  
 thanks but still not working.  check my screen cast : screencast.com/t/OFtQlZRiR 
  
 thanks 
  
 jm

#15

Hi JM





Thanks for your further information, this should be because the cache, following is a test vedio on our end: screencast.com/t/M2LroO4NY,  as you could see after clearing the cache the legend is working.



Attached is a test vedio on our end, would you please check if there are any thing we missed? and if possible, would you please provide us a sample(with your Mapsuite dlls) for a further test?



Waiting for your further information



Summer

002_001_Post11428Sample.zip (164 KB)