Alex Little

My 'hello world' heatmap

Over that past few days I’ve been playing around with creating heatmaps to overlay onto OpenStreetMap – the image on the left is where I’ve got to so far. My interest in this is for creating heatmaps from data collected during my colleagues health sciences research in Ethiopia.

There are already several programs and services available to create heatmaps, for example gheat and OpenHeatMap. But none of these quite suited me, gheat because I didn’t want to create a full tile server – just an image to overlay on a particular area of the map and OpenHeatMap because I wanted to have access to the code to tweak how I wanted.

I then found heatmap.py which (using a similar algorithm to gheat) did almost exactly what I wanted. There were only a couple of changes that I needed to make:

1) Update to account for the Mercator projection – I wanted my overlay to be on a view of the whole world (zoom level 2 in OpenStreetMap). When I first ran the program the areas over northern Europe (and others) were almost but not quite inline with the marker overlays, but this was due to the projection. I just edited the input script to convert my lat/lng coordinates into Mercator coordinates. I also hooked up the heatmap.py script to read the lat/lng coordinated from a MySQL database.

2) Allow the script to have weights against each point. The current script looks at the number of points in a particular area (or on top of each other) to generate the ‘heat’. I also wanted to allow for points to have a weight – as mentioned here. I’ve not yet implemented the weighting, but I’m not anticipating this to be too tricky. GHeat (as far as I can tell) doesn’t allow for weights on points, but OpenHeatMap does (please let me know if I’m wrong about this).

All has been much easier than I’d expected, I’ve learnt a little more about python and once I’ve got the weighting working how I’d like, then I’ll share the code back.

For the past week or so, I’ve been over in Cambridge doing a some programming work for Aptivate (a not-for-profit IT development company). It’s been good to get back into doing some programming work after quite a long break – over the past couple of years I’d only really worked on a few personal projects. Quite surprised how much I’d forgotten, but more surprised how much I’d actually managed to remember.

At the moment I’ve been working on a survey application for health centres in Rwanda, to collect baseline information about the facilities and services they’re able to provide, with a view to better target resources and measure any improvements made.

What I have found interesting has been Aptivate’s use of peer programming and agile development methods. Rather than programming alone, pairs code together. At first you may think of this as being quite an inefficient way of working, especially given a limited number of programmers and many projects to work on. But actually, I’d argue the opposite is true. Whilst working alongside someone, there is far less temptation to get distracted by checking email or wandering off onto the internet.

Earlier this week I spent a few days working Cambridge doing some volunteer web development work for Aptivate. They are in the process of developing a new low bandwidth site for CDAC (Communicating with Disaster Affected Communities), this particular site is aimed at the victims of the Haiti earthquake and is to help ensure that aid and relief agencies are able to communicate well with local communities as they rebuild their lives. The site isn’t yet finalised, so can’t put the url up yet, but will do so once it’s ready.

As an aside, OpenLearn now has a course on “Using Voluntary work to get ahead in the job market“.

Much of the past couple of weeks have been spent making sure I’m ready to head off again to Ethiopia to work on the Digital Campus project. En route, I’m going to the eLearning Africa conference in Zambia, where I’m giving a presentation next Friday. Looking forward to getting back to Mekelle to see how everything it going there, seems like quite a lot of progress is still being made. My plan whilst I’m there is to help support the phd students and the ICT team, but also planning how the project can progress into the next academic year.

Hopefully I’ll be back blogging a bit more regularly over the coming few weeks!

For a project which I may be working on in the near future, I need to think about how I can measure user’s bandwidth. Although there are many tools available for doing this already (such as speedtest.net and many others), these generally all require java or a recent version of flash to be installed. Plus they appear mainly geared towards testing a broadband connection, rather than a dial up (or other slow type of connection). I’d like to avoid creating a program that needs to be installed on a users machine as I need to keep it as simple as possible.

My current thinking, avoiding any installation and as little effort as possible on the users part, is to use a simple webpage with a small piece of AJAX to download a file of fixed (known) size and just use javascript to calculate how long it takes to retrieve. I realise that there are obvious drawbacks to this approach:

• hard to measure latency
• accuracy of javascript timer
• other processes running on the machine
• proxy or caching servers getting in the way

However, I don’t need something extremely accurate, just something that is easy to use and gives a reasonable approximation of a users bandwidth (which will be dependent on a huge number of factors anyway, such as time of day, no of other users etc), is it 2kbps, 20kbps or 200kbps?

To get a better idea of the usual speed of a users connection, I can attempt to download several files of different sizes (from different servers), and take averages.

Is there anything I’m missing that would make this a really bad way to approach this? Or would it produce results so inaccurate they’d be useless?

Despite there being 1001 regexes on the web for matching a URL in a string and then replacing it with an anchor tag (commonly used in chat applications etc.), I couldn’t find one which did exactly what I wanted, so I thought I’d share my regex for replacing URLs with anchor tags.

Firstly, the problem with all the other regexs I found. Take for example the following text block:

you should have a look at <a href='http://example1.com'>http://example1.com</a>, and http://example2.com

All of the regexes I found for matching and replacing URLs with anchor tags would have transformed my text block into:

you should have a look at <a href='<a href='http://example1.com'>http://example1.com</a>'>http://example1.com</a>, and <a href='http://example2.com'>http://example2.com</a>

None of the example regexes I found coped with the possibility that some URLs may already be contained in an anchor tag, as in the example above, or in other instances where you don’t want to insert an anchor tag, such as: <img src='http://example.com/logo.png'/>

The regex and code I am now using to get around this problem is (in Javascript):

var mystring = "text with some URLs in";
var myregex = /(^|[^'">])((ftp|http|https):\/\/(\S+))(\b|$)/gi;
var newstring = mystring.replace(myregex ,"$1<a href='$2'>$2</a>");


All appears to be working well so far, but I’m sure my regex is far from perfect. This regex doesn’t check that the URL is really well formed, for example valid top level domain etc.

So please post any possible improvements below, in the meantime I hope it’s useful

Recently I was sent link to Chisimba, a ‘Web 2.0 enabled, Free Software development framework for creating web and distributed applications’, developed by African Virtual Open Initiatives and Resources (AVOIR). From the info on the site it looked an interesting project, although my first impression was that its trying to be all things to everyone, with modules for blogs, wikis, CMS, LMS and more. It appears to have taken elements from Moodle, Joomla, Drupal and Elgg and packaged them all into one application, which may or may not be a good thing.

On downloading and installing on my laptop, I soon found that this was still very much a work in progress, as there appeared to be lots of little bugs/annoyances that would probably have been resolved if it was a little more developed. A very minor example of this was the fact that the next/previous buttons on the installation were the wrong way round (for me anyway), with next being on the left hand side and prevous on the right, rather than the more usual arrangement. The installation itself was a little fiddly, however that was mainly because I had to upgrade my version of PHP, install some PHP libraries and some PEAR libraries too, before it would install.

A lot of effort seems to have gone into creating modules, 100′s of them by the looks of it, so thought I’d take a look at installing the blog module. Unfortunately the automatic ‘download and install’ kept giving me an error, so then tried an offline installation of the module – a 35Mb download of all(?) the modules is available – but I couldn’t find any info on how to install a module in this way. I’ve posted a query on their discussion forums, so hopefully I’ll get a reply to have this resolved soon.

Overall I was a little disappointed that I couldn’t have a proper play with the modules, but will come back to it once I get a resolution as to how to install them. Having said that I can’t see this framework taking off, there are many other established frameworks out there and I don’t think Chisimba offers anything different enough from these.

Mozilla Labs have just launched the Ubiquity plugin for Firefox and to me it looks fantastic. The plugin makes it really easy to embed a map say into an email – without all the faffing around of cutting and pasting URLs from Google Maps into emails etc – it also does much more than this – but I’ve only just started to play!

Even though I’m not generally one for command-line type interfaces, this one works for me. Will be interesting to see how many developers jump on this to create new commands. I can see how you might want to add an IM command (for MSG of course) or one for Cohere. Also, how will this affect some other Firefox plugins, for example if Delicious wrote a set of commands for this (maybe they already have?) then would you really need the Delicious Firefox plugin?

When you’re trying to use XUL. I’ve just been working on enhancing the Cohere Firefox plugin/extension/add-on so that you can optionally show a toolbar, this toolbar will also show the ideas from Cohere which are linked to the webpage you’re currently looking at (quick screengrab below):

Anyway, getting back to my original point, I needed to be able to dynamically change this drop down list whenever you browse to another page, or select another tab. Getting my plugin to go off and query the Cohere webservice to find the relevant ideas all worked fine, the problem I had was being able to remove the current items from this drop down list.

The documentation seemed to show that I can use ‘removeelement’ to remove the element from the list by setting the removeelement attribute to true (though does seem to be bit of an odd way to do things – setting an attribute to remove an element), but it didn’t work and I spent a little while figuring out why .

In the end it turned out that setting the removeelement attribute to true only means that the element is removable, so you can create the following:

<menulist id="menulist">
    <menupopup id="menupopup">
        <menuitem label="my label" value="a value" removeelement="true"/>
    </menupopup>
</menulist>

but the item “my label” will appear in the drop down list, to actually remove the item you need to do something like this in your javascript:

var ilist = document.getElementById('menupopup');
for (var i=0; i<ilist.childNodes.length;i++ ){
    ilist.removeChild(ilist.childNodes[i]);
}

Thought I’d post it up here as it confused me and might save others struggling to figure out what’s going on

I’ve just spent a frustrating couple of hours unsuccessfully attempting to get my Asus Eee (running Ubuntu Hardy Heron) to allow me to record short videos using the built in webcam and mic.

I started off by applying these fixes and have checked that it all works fine using skype. I first tried recording using ‘Cheese’ – this resulted in the video working fine – but no sound ( I also tried with plugged in mic/headphones). So I installed ucview and gave that a go instead,  but his was quite erratic too, most of the time it would appear to record, but then on playback, only the first frame would be visible, and no sound (using either built in mic or a plugged in mic). I also found that sometimes ucview wouldn’t stop recording even after I’d clicked the button and I had a to kill the process to get it to stop.

I then went back to looking at cheese only to find that it now won’t start, the top window bar appears, but with big grey square underneath – no menus or webcam preview. Restarting, removing and reinstalling all made no difference

Really not sure what is causing these problems, from googling & reading wikis and blogs most other people seem to have got ucview and cheese working fine – so just me then If anyone has an idiots guide as to what to check then feel free to send on to me

I’ve been trying to get this working in the hope that when I go away to Ethiopia I’ll be able to record short video blogs to post up – but I may have to fall back to just using my digital camera and the video/sound recorder on that, but would’ve been nice to be able to use the webcam and mic.

On a different note, I hope that Ubuntu updates will soon include FireFox3…

Not being a designer spending all my time getting to know the ins and outs of how floating divs work, it tends to take me a little while to get my head around how to lay out pages using pure CSS. I thought I’d pretty much got how to do 2 and 3 column layouts with CSS and divs, but today I found a new problem which really had me stumped for a while.

Essentially I wanted an ordered list, then within each <li> element a couple of <div>s which I could float to layout how I wanted. Everything was working fine in Firefox, but not in IE(6), the images below show the output given in Firefox and IE:

IE (6):

Firefox:

HTML code which generated the above images.

The items numbered 1-3 show how I want the output to appear, but my first stab at the code resulted in items numbered 4-6. As you can see, in Firefox it appears fine, but in IE the ‘float:left’ is being ignored, making the div containing the text appear below the checkbox. [Aside: you might ask why I'm using divs and floats for something as simple as just some text next to a checkbox, well, this is just my starting point, my final page will be more complicated than this example!]

The only difference between the working and non-working examples is that the div containing text has width property defined (set to 100%) in the working version. I’m not sure why this should be necessary – my example shows that it’s not needed if the wrapper div isn’t part of an ordered list.

My only explanation is that this is another (frustrating) little IE CSS bug – unless anyone can give me another explanation? Alternatively if there are better ways to do what I’m trying to achieve?