ThinkGeo.com    |     Documentation    |     Premium Support

Markers performance

#1

Hi,


I need to display 1000 Icons/Markers onto the map within 1 sec.  Can SimplerMarkerLayer or Features in OpenLayer achieve such speed?  What is the best class should I use for this?


Thanks,


Tracy



#2

Hi, Tracy 
  
 I recommend you to use InMemoryMarkerOverlay instead of SimpleMarkerOverlay if you want to display more than 1000 markers onto the map. The former uses asynchronous mode to get makers from server-side and then render them on the client-side; it won’t get all markers at the first time that depends on the extent you require. However, SimpleMarkerOverlay will render all marker on the client-side at the first time. Hope this will help you. 
  
 Thanks, 
 Khalil

#3

Hi Khalil, 
  
 I’m implementing the icons in javascript.  I use OpenLayers.Layer.Vectors and for each of my icon, I create a OpenLayers.Feature.Vector and use its attribute ‘description’ to create a popup.  I believe what I do is asynchronous and the rendering depends on my extent as well since it takes 2-3 seconds to add 1500 icons which are all out of my extent.  I then use Map1.SetCenter() to move my map to a location in which the extent includes roughly 50 -100 icons.  It takes minutes to center the map.  Even if I pan or zoom out to a level to include more icons, the map becomes extremely slow.  Is there any way to solve this problem?  I must display 1000 icons for my clients and most likely, they would use an extent to include all icons at once on the map. 
  
 Thanks, 
 Tracy

#4

Hi Khalil, 
  
 I tried out InMemoryMarkerLayer.  It takes roughly 30s to add all 1500 markers that are not in the extent to the layer.  I believe I must stick to OpenLayers.Feature.Vector since it takes only 2.5s to add all 1500 markers.  Please let me know how I can speed up the display when I pan to my makers. 
  
 Thanks, 
 Tracy

#5

Hey, Tracy 
  
 Sorry for delay response. Yes, if you use InMemoryMarkerOverlay or SimpleMarkerOverlay to add 1500 markers or more; it will slow down the display and that’s because lots of element nodes will be added to DOM. However, as far as I know, InMemoryMarkerOverlay won’t add other markers that are not in the extent and it consumes asynchronous mode. Could you provide us with a simple sample and we could test it. 
  
 Thanks, 
 Khalil

#6

Hi Khalil, 
  
 I created a simple project and sent to support’s email.  Just want to restate that I am now using OpenLayers.Feature.Vector instead of InMemoryMarkerOverlay 'coz adding 1500 markers to InMemoryMarkerOverlay takes roughly 30s even none of the markers are added to the existing extent while vector only takes 2.5s. 
  
 Thank you very much for your help. 
 Tracy

#7

Hi, Tracy



I have received your app demo and tested it. It displays markers not as you have said that it takes 2.5s but about 10s; that's maybe my machine problem. It will becomes extremely slow when you pan, zoom in or zoom out. I think the problem is that the map will render again when you pan or zoom; it will use 'SVG' or 'VML' renderer to render the vector features again depend on your browser. 

Yes, I know that you are using OpenLayers.Feature.Vector instead of InMemoryMarkerOverlay; but I still recommend you to use InMemoryMarkerOverlay which is designed to handler lots of features. Also I have tested it, it works well with 1000 markers or more. One thing I just want to restate that InMemoryMarkerOverlay won't add other markers that are not in the extent and it consumes asynchronous mode.  Please refer to the code in the attachment.



If you still have any problem please let me know.



Thanks,

Khalil



1897-WebApplication1.zip (2.21 KB)

#8

Hi Khalil, 
  
 How can I add features to InMemoryMarkerOverlay in javascript?  I see a method in C# server side to do such but not in javascript.  Please advice. 
  
 Thanks, 
 Tracy

#9

Hi Khalil, 
  
 When you tried out the InMemoryMarkerOverlay, did you have all 1000 icons display in one extent?  For mine, it looks as slow as the demo program I sent to you.  It doesn’t seem responsive enough. 
  
 Thanks, 
 Tracy

#10

Hi Khalil, 
  
 I have modified my sample program and emailed to support for your review.  I included Vector and InMemoryMarkerOverlay for your comparison.  The page first opens an extent in which no markers will be drawn.  I first clicked ‘Load Markers to Vector’.  It took 1s to add 1000 features to vector layer.  But when I then clicked ‘Display Markers’, it took extremely long time.  Panning was very slow too when markers are in display. 
 I then restarted the page, and clicked ‘Load Markers to InMemoryMarkerOverlay’.  It took 7s to add 1000 features instead.   
 It seems my makers don’t want to stay when using InMemoryMarkerOverlay when I zoom or pan; but when markers are visiable, even in InMemoryMarkerOverlay, it is also slow. 
  
 7s to add 1000 markers InMemoryMarkerOverlay is not acceptable by our clients.  Panning and zoom are also too slow while markers are in display.  I really appreciate your help  on this matter.  We must meet our deadline on this in a week and InMemoryMarkerOverlay doesn’t seem to be promising in our situation. 
  
 Thanks, 
 Tracy

#11









Hi, Tracy


 


I don't get your sample app now, maybe tomorrow support will send it to me. But some thing I want to confirm with you now. I noticed that you set CurrentExtent of map control as the whole world extent, such as (-180, 90, 180,-90); it does render all markers at the first time using InMemoryMarkerOverlay and slow down the display. That's because first off we get will get features in the CurrentExtent through the GetFeaturesInsideBoundingBox method Of FeatureSource, and generate markers in JSON format and then render these markers on the client-side. For example, when you set CurrentExtent as the world extent, at the first time it will render 1000 markers on the map and it will take about 7s after you have clicked "Add Markers Using InMemoryMakerOverlay" button. But if you set it as some small extent such as (-123.33853, 50.28656, -121.59719, 48.97957); it will takes about 1.5s to render about 26 markers. Please refer to the screenshot below and samples in the attachment. And then you pan and zoom in or out; map just need to render markers that included in the CurrenExtent.


 


1902-Markers.PNG640×565 53.1 KB


 


However, if you use Vector Layer to load markers; it will render all markers while you pan or zoom in/out again regardless of whether these markers include in the CurrentExtent. So the best choice is the InMemoryMarkerOverlay. I’ll review your samples as soon as I get it. 


 


Thanks,


Khalil




1901-MarkerSamples.zip (9.58 KB)

#12

Hi Khalil, 
  
 I understand that if the extent is smaller, fewer markers would be displayed and panning and zooming can be smoother.  However, our clients would not like the restriction on seeing limited number of markers in certain zoom levels only.  Is there any other option for us to workaround this bottle neck of displaying markers? 
  
 Thanks, 
 Tracy

#13

Hi, Tracy 
  
 We don’t support Cluster strategy now. But if you still want to use Vector to load markers; I suggest that you use the Cluster strategy which OpenLayes provides for Vector layer. Please refer to the sample “strategy-cluster-threshold.html” in the installed samples of OpenLayers. 
  
 Thanks, 
 Khalil

#14

Hi, 
  
 I’m using InMemoryMarkerOverlay() to display roughly 1000 makers in an extent.  I still find updating markers on client map is slow.   
 sendMarkersRequest() seems to remove all markers in the overlay then create markers in the extent requested from server.  I did an analysis and it seems addMarker() takes the most time.  I now have my own logic since my markers may just need to change popup content, I don’t create a new marker for it.  I find the marker by its ID then change the popup and redraw the layer.  It seems the performance is much better. 
  
 However, when panning or zooming, I find the map is slow again.  I assume the map draws the same way as in sendMarkersRequest() that all markers are first removed then new markers are created and added to the client map.  Is there a way to override drawing to use my own logic as well when panning or zooming? 
  
 Thanks, 
 Tracy

#15






<object
classid="clsid:38481807-CA0E-42D2-BF39-B33AF135CC4D" id=ieooui>

st1\:*{behavior:url(#ieooui) }




<st1:city w:st="on"><st1:place w:st="on"></st1:place></st1:city><st1:city w:st="on"><st1:place w:st="on">Tracy</st1:place></st1:city>, I know your meaning. We do remove and destroy all markers in the VectorLayer, and then add new markers which are requested from server. I have tested it using Fiddler, it will consume about 1 second to get data for markers in asynchronous mode, and about 6 seconds are consumed by the creating and event binding of markers and the related popups. That's because there are so many element nodes that need to be added to DOM tree, so the improving performance of browser is more important. 


The code in the attachment is used to add markers after the request for markers has completed. Hope it could help you. If you want to implement your own login in this function, please put this function just before the form end tag and it will override the default function. But I first off recommend that you use the "SuppressingGridSize" property to remove markers if they are near too close.


 




Thanks,




Khalil




1936-code.txt (2.62 KB)