Welcome to tubemapping.com
Animated gif of tubemap building from data

Tubemap draws a schematic diagram on a webpage.

You supply Tubemap with data in pairs, such as A leads to B, B leads to C, D leads to C. Tubemap then draws a diagram representing these data visually. You can hover over the nodes (circles) for more information.

The animation shows Tubemap drawing and extending a schematic diagram as more data are added.

Geographic data

We tend to plot geographic data on a map. If we have the co-ordinates, it seems silly not to use them.

But there can be great benefit in stripping away physical location. Sometimes it doesn't matter where something is, only what stage it is at.

In these cases, a tubemap can help us to focus on the flow, process, or supply chain.

Database mapping

Many organisations have lots of data they don't use. IT departments might know how the data link up, but the business has no idea.

You can use Tubemap to model the data flows into and out of your organisation. And you can update the Tubemap whenever your systems change.

Placing the Tubemap on your intranet will allow both the business and IT to start speaking the same language.

Process mapping

Current process maps can require printing in A1 and a degree in logic to follow them. Users have to pull the information from them, because they aren't intuitive enough to push it.

Process are with us every day. They do not need to be corporate or written up. Most of them are in our heads, or hidden in text. Tubemap can help to bring these to the fore. Take a child's curriculum, for example. Tubemap could visualise a whole year of learning on one page.

Any kind of flow

Travel, energy, freight are obvious kinds of flow. They occur in stages or steps, making them well suited to Tubemapping. But thoughts, decisions and events can also be flows, and therefore be modelled.

The tubemaps below suggest new functionality we would like to add, such as differently coloured lines, nodes, and timelines. We have many, many more plans for an all-singing all-dancing Tubemap, which transforms a visualisation into a proper app.

Graphic showing tubemap examples on three iphones

What exactly is Tubemap?

Tubemap is a data visualisation. It could equally well be described as an interactive graphic. So: Tubemap is a webpage; it presents boring tabular data visually; it is interactive, so when the user hovers or clicks, something happens.

Tubemap is built using html5, css3 and javascript, including an extension to the javascript language called d3. Html5 is just html, but it's the newest type and it has a lot of new features compared to html4. The key feature used by Tubemap is scalable vector graphics (SVGs). Only the latest browsers support html5 (IE9 or later, for example). If you access the internet from a tablet or phone, you are probably using a browser that supports html5.

Image of browser compatibility for D3 graphics

Tubemap will work on any internet-enabled device that supports html5. It will centre itself neatly within the browser window, whether that is on a phone or a double retina iPad. It will work across Apple and Android, and across PCs and Macs.

How is Tubemap available?

Tubemap will shortly be available. The text and diagram refer to the ways in which it will be available on or after launch.

image showing licence options

You can create your own Tubemap on this site, and save the result as a static image, for free. You can then place the image on your own site if you wish. (Please do not remove the attribution to this site, though.)

Once you've created your Tubemap, you'll be given the option to keep it as an animation, hosted on this site. You will be given a unique URL, which you can share with anyone. Alternatively, you can embed the animated Tubemap you have created in much the same way you would embed a Youtube video. You can log in and update the data behind the Tubemap at any time. And you can also create a joint Tubemap by providing multiple URLs to JSON files. E.g. http://t.ubemap.com/tubemap.json. These files must follow certain rules for Tubemap to be able to interpret them.

If you prefer, you can download the Tubemap code and do what you want with it. You can edit and expand its features. You can also look to see whether other coders have written open sourced plug-ins - someone might already have created the extension you are looking for.

If you are a commercial entity, you will need to pay for one licence per developer. They can use and re-use the code, producing as many Tubemaps as you like over the years. You can host them on your internet or intranet site. If you are non-commercial, such as a charity, individual or NGO, you can do all this for free. If you have a developer licence you are not allowed to resell the code, even if you have coded your own changes and extensions, and even if it makes up only a small part of your software offering.

If you wish to resell any part of Tubemap in any form, you will need to buy an OEM licence.