Trick

When working with maps and geographical information systems styling features is very important, on one hand it can make your map more flashy and on the other it can help to classify or organize your features visually.For example, in a map where you show the most populated cities of the world you can use circles with different color and radius.

OpenLayers offers the option to style our features in different ways:

  • using a style structure for the whole layer
  • styling a concrete feature

The order applying these style go from "out" to "in", that is, given a feature first is applied the layer style and later the concrete style the feature could have. And to show this nothing better than an example.

Supposing we have a Vector layer with some circles:

var vectorLayer = new OpenLayers.Layer.Vector("Vector"); // Create 50 random features, and give them a "type" attribute that // will be used to style them by size. var features = new Array(50); for (var i=0; i<features.length; i++) { features[i] = new OpenLayers.Feature.Vector( new OpenLayers.Geometry.Point( (360 * Math.random()) - 180, (180 * Math.random()) - 90 ), { type: 5 + parseInt(5 * Math.random()) } ); } vectorLayer.addFeatures(features);

Now we define a layer style which applied to the layer and a feature style applied directly to a concrete feature:

var myStyles = new OpenLayers.StyleMap({ "default": new OpenLayers.Style({ pointRadius: 3, // sized according to type attribute fillColor: "#ff5566", strokeColor: "#ff9933", strokeWidth: 2, graphicZIndex: 1 }) }); vectorLayer.styleMap = myStyles; features[0].style = { pointRadius: 9, // sized according to type attribute fillColor: "#225566", strokeColor: "#ff9933", strokeWidth: 4, graphicZIndex: 1 };

As we expect the result is:

Flexigrid is one of the most usefull and powerfull grid plugins for jQuery. Unfoirtunatelly, as ahotur explain in the project page, there is no much documentation so you must learn how to use it looking at existing code.

Flexigrid

If anytime you need to fill a flexigrid with JSON or XML content and you are a little buggy to look at example code, here is the summary of history:

  • Remember XML/JSON data must follow the next rules: total, page, rows. And for every row specify and id and a cell structure.

Sample data for both types are:

{ page: 1, total: 2, rows: [ {id: 'reg1', cell: ['reg1-cell1','reg1-cell2']}, {id: 'reg2', cell: ['reg2-cell1','reg2-cell2']} ] } 1 2 reg1-cell1 reg1-cell2 reg2-cell1 reg2-cell2

Finally, to use your XML/JSON data to create a flexigrid component you need to:

  • Put some element on your HTML document: <p id="yourId"></p>
  • Convert that element into a flexigrid with: $("#yourId").flexigrid({ url: 'your_file_name.json_or_xml', dataType: 'json', ... }

Now you know how to build a flashy flexigrid.

I have working on a web page using OpenLayers which among others shows a OpenStreetMap layer.

The issue is I need to move the mouse over the map and print on a label the tile name in the form level/x/y, for example, 5/15/10.

The first thing to do is to register a listener to the OpenLayers map object, then for every mouse event we need to get the lonlat and translate it from current map projection to the EPSG:4326 (WGS84).

 

map.events.register( 'mousemove', this, function(evt){ var lonlat = new OpenLayers.LonLat(0, 0); if(evt){ lonlat = map.getLonLatFromPixel(evt.xy); lonlat.transform(this.map.getProjectionObject(), new OpenLayers. Projection("EPSG:4326") ); } tileX = long2tile(lonlat.lon, map.getZoom()); tileY = latg2tile(lonlat.lat, map.getZoom()); tileZ = map.getZoom(); });

To compute the tile X,Y grid coordinate from latlon you can use next functions, obtained from OpenStreetMaps site:

// Functions to compute tiles from lat/lon function long2tile(lon,zoom) { return (Math.floor((lon+180)/360*Math.pow(2,zoom))); } function lat2tile(lat,zoom) { return (Math.floor((1-Math.log(Math.tan(lat*Math.PI/180) + 1/Math.cos(lat*Math.PI/180))/Math.PI)/2 *Math.pow(2,zoom))); } 

Lately I'm programming more than I never thought in JavaScript, to be exact with Dojo, a JavaScript framework for the client side. I know about it for some time ago but never give an oportunity. But never say never :) Next slide shows you some "simply" tricks to improve the performance in your JavaScript code. I see it on ajaxfreak, which in fact are hosted in slideshare.

Probably you could think PSP is not the best device to read PDF files and also it is not intended to do so, better to play some game like Need For Speed :) Yes, I know but I'm "a curious animal" and use my PSP more read than other thing.

Some time ago I update my PSP, now runs 5.50 GEN-D firmware version, and since then Bookr doens't works, the nasty 8002014C error appears on my screen.

Well, don't ask my why but if you want to use bookr too the version that works for me is Bookr for firmware 1.0.

See bookr in action:

Recently I started working with Jetty. I have never used it, always working with Tomcat and my dear GlassFish.

One of my first problems with Jetty was about the symbolic links in Linux. Usually, while developing, I like to have my code organized in some directories and my servers in others. Then I create a simlink from the webapps Jetty's folder to my project folder. But that strategy fails initially in Jetty.

Taking a look in the FAQ pages found here and here, you can read that:

Jetty by defaults runs in a mode where all file accesses are checked for aliases, such as case insensitivity, short names, symbolic links and extra characters (Eg %00). If a resource is an alias, then it is treated as not found.

There are, or at least I know two solutions.

  1. Start Jetty by command line and specify the property value, like: java -Dorg.mortbay.util.FileResource.checkAliases=False -jar start.jar
  2. Adding it as an initialization parameter in the webdefault.xml file:
    default org.mortbay.jetty.servlet.DefaultServlet . . . aliases true . . .
No doubt to put any comments.
Too much time without write anything, and unfortunately I continue without time to write more. This post is only to point to a very interesting link that talks about JPA and the problems of the concurrency when persisting entities.

Via DZone I found an interesting link about the creation of UML diagrams online.

More probably you agree that yUML seems the nice option for the web, with a nice and modern look and feel. See some examples:

 

If you read the comments of the initial link you'll find a bunhc of alternatives, desktop and web alternatives. I would like to mention http://websequencediagrams.com which seems a good alternative to yUML.