Skip to content
February 15, 2012 / Gagan

Tile Feature Strategy in OpenLayers

No doubt there is a huge requirement for client side vector rendering capabilities. The reason being the user interaction with features can be enhanced that can not be thought in case of tile images.

One critical point for heavy traffic sites is caching of the data. Caching can be considered at server side (http cache) and browser cache to reduce the load on servers. So for caching the vector data requests, we  need to request the data from server in predefined extent or tile wise.

I have implemented the client side handling of the tiled vector data request with OpenLayers. OpenLayers has different strategies for requesting the data from server like Fixed, BBOX. Similar way I created a strategy to request the features tile wise and to handle the response, named as Tile Feature Strategy TFS. Here is the working example of TFS with OpenLayers

You can check the TFS class source code that is inherited from OpenLayers Strategy class. I have used GeoJSON format for features. There is slight modification in protocol as well as, check here Protocal_TFS.

Well in this example features returned are not the real features ( as I dont have the data). These features I create for each tile on ad hoc basis but each time in a  tile features are same.  This is achieved with Knuth algo, check the php code for simulated tile feature service here. The response for given tile is GeoJSON feature collection. Well for your actual data, you need to implement a tile feature service at your own at server end. Can take help of TileStache to generate tile wise GeoJSON.

This approach is not new many efforts have been done earlier also. I see ticket for tiled WFS in  OpenLayers. There is microsoft research project for TiledVectors. And there is very nice implementation by Polymaps for Vector Tiles.  Here is another open source arcstache for ArcGIS Server.

August 19, 2011 / Gagan

Trace Along Featue in OpenLayers

The requirement for vector editing at web browser is increasing. Future would not be a web based GIS editor package rather plugable tools for vector editing in the web site. In this regards OpenLayers serve a good platform as a library. I have developed a tool for tracing the feature along existing feature. Here is the working example. I am looking for the feedback on this control regarding the enhancement as well as any bug. Want to test trace control, check the patch for openlayers.

There is one more functionality I would like to add in this control, trace polygon in another direction by pressing shift/ctrl. If any more suggestion please let me know.

February 23, 2011 / Gagan

Delete network feature with GeometricNet

In GeometricNet I am adding more functionality, one of them recently added is ability to delete network features edge and node.  Shown  the same in the example and available in the latest version – GeometricNet-alpha-0.5.3

GeometricNet is still in nascent stage, many more concepts and functionality need to be incorporated. My purpose of hosting the alpha code was that I would be getting the feedback from developers on this project. So that improvements can be done. I am getting a good feedback and improving the same. Still the project is not in the state to be directly used by the users, but developers can use this or part of this project for any network related project.

February 18, 2011 / Gagan

Search Nearby using Rtree

Searching POIs nearby to user location or any location feature in LBS service is critical component (in fact everyone knows that, nothing new). But exciting is rtree library in python. Well here is small example code using python rtree library that uses internally libspatialindex.

Here is a sampel code how rtree can be utilized to index all of your POIs

from rtree import index
# locations=array of {id:1,coordinate:(x1,y1),name:"htel abc"}
def create_index(locations,index_name):
	idx=index.Index(index_name)
	for location in locations:
		id = location['id']
		x = location['coordinate'][0]
		y = location['coordinate'][1]
	idx.insert(id,(x,y))
	del idx

In this sample a function create_index just loop through all of POIs and create a rtree index. It creates index files with index_name (index_name.idx and index_name.dat). So when you want to search the nearby location you load index with these files. The next sample code shows how easily one can find the near locations.

# returns list of ids
#coordinate - (x1,y1), count - no of ids to be returned
def find_nearby(coordinate,count,index_name):
    idx = index.Index(index_name)
    x = coordinate[0]
    y = coordinate[1]
    return idx.nearest((x,y),count)

So keep indexing your locations and find nearby very easily.
Update: Here is a high performance JavaScript R-tree library RBush

December 16, 2010 / Gagan

Undo Redo Vector Edits in OpenLayers

OpenLayers has given a good platform for vector data rendering on web. OpenLayers library also allows vector data manipulation or edit. For making vector data editing more easy I have created a control to undo or redo the vector edits. In the example for undo redo,  I have added controls for undo and redo the vector edits done. The basic example of OpenLayers, modify features has been extended very easily to incorporate undo redo control with help of UndoRedo class.

In this implementation i.e UndoRedo class has two stacks for undo features and redo features. On any edit of vector feature I insert the feature in undo stack. Like if there is a update of the feature the old feature get inserted into undo stack. So on undo action the updated  feature is  moved out to redo stack and old feature is moved to layer. The only issue here is with delete feature, openlayers library on delete action does not remove the feature (as it is required to send that info to server on commit) but change the state to “Delete”. I have done a little modification on delete, I remove the feature from layer to undo stack. So at this stage if somebody commits, the deleted features would not be deleted from server. To over come this issue I’ll write a function that will move back the deleted features to layer with state  “Delete” and style {display:”none”}  so that deleted features could also be removed from server.  This function has to be triggered before commit i.e. on start event of save strategy. I’ll update this control with this function by that time please test undo redo control example and in case of any bug let me know.

December 10, 2010 / Gagan

Move Network Node with Edge

Modifying a Network is a basic requirement for any GIS Network Editor, most of the COTS GIS packages have this facility. But critical user expectation is to move a node along with it’s associated edges. Keeping in mind this requirement I have added a functionality to modify a network node along with edges in GeometricNet (Geometric Network).

Please check the example – modify network where user can select a tool “Move Node” from tool panel and select any existing node and move it to the required position. The connecting edges to this node are also moved simultaneously with node movement. After modification you can save your modification with save tool.

Some more examples of Geometric Network (GeometricNet)

September 30, 2010 / Gagan

Draw Line direction on OpenLayers Feature

Many times its required to draw the line direction on LineString of OpenLayers. It may be to show the flow of water in pipe, one-way roads or directed geometric network. I have written generic code to draw the line direction using OpenLayers. Here is example to check my code how it is working.

Basically I create a point feature and set the angle attribute of this feature same as of the line at that position. And position of point/direction-arrow could be start, end or middle of the LineString or segment. For each segment of linestring  a arrow can be added. Not shown in the  example but the position can be set any where on the linestring by giving the measure value (between 0-1) to the function “getPointOnLine( )” in Direction.js

September 28, 2010 / Gagan

Electric Network with Geometric Network

In my last blog “Shortest path with Geometric Network” I had shown that how easily a road network can be created with GeometricNet library. We can also find the shortest path as well using A-star algorithm.

Now I have created a example for electrical network. Here a existing network of power distribution is loaded in the window along with many network creation tools. Functionality of utility network are simulated here with this examples. Like a distribution  line can not start from substation, only high voltage line can start.  Another constraint is  from a pole one can take fixed number connections, so I have consider four and only four line can be drawn ‘to’ connection points. As electrical network is directed network, so a line can not be drawn ‘from‘  connection point to pole. There are many other Utility GIS functionalities are implemented like while drawing edge (electrical line /wire ) default end node (poles / network element ) , splitting the edge if another edge touch the same and check the edge to edge snapping rule. Please explore the more in the example.

I am not electrical engineer so all rules are with my basic understanding of electric network / power distribution. So to tackle this issue is very essential, like all GIS software, utility GIS  or AM/FM/GIS software are developed by software engineer or non domain expert. Here I have designed a configuration file that contains all the network behavior.  So by using this configuration file, I separate the domain expertise from GeometricNet library.  This  configuration file tags are self explanatory and simple.  Further to this, I am working on feature modification of  the network.

August 29, 2010 / Gagan

Shortest Path with Geometric Network

In my project GeometricNet (Geometric Network) I have added the functionality to find the shortest path between two nodes. This is based on A-Start Algorithm . A JavaScript  implementation of A- Star is nicely done by Brian Grinstead,  same code I have included in my project. Actually scalability of the graph and related operations like shortest path on javascript is doubtful considering amount of vector data need to be loaded ( say full network of a city roads) and operation time.  I’ll test both in coming days and post the result for same.  Here is demo of the shortest path with Geometric Network.                                                                                               

By drawing  a edge network with draw edge tool, it will create network topology itself.  The graph is implemented with modified adjacency list data structure. By drawing the flags near any two nodes initiate the process to find the shortest path between these nodes. The shortest path is shown by selecting the edges of the path.

August 16, 2010 / Gagan

Geometric Network on SourceForge

In my last blog Geometric Network creation with OpenLayers, I had shown the potential of OpenLayers that can be used to manipulate the vector data on web. Based on OpenLayers I have started a open source project GeometricNet (Geometric Network) on SourceForge. GeometricNet is JavaScript library extended from OpenLayers. GeometricNet can be used to create topological correct geometric network in Web-GIS environment created with OpenLayers.

Right now project is in alpha stage. But developers familiar with OpenLayers can use this project easily.