Quality Graphs Package

Clear, interactive graphs are a very effective means of bringing a web page to life and delivering information.

Dovedale Design holds a licence with Norwegian software firm Highsoft Solutions AS, an industry leader in standards compatible, JavaScript based charting. Their products Highcharts and Highstock enable the production of graphs, stock or general timeline charts in pure JavaScript, including sophisticated navigation options.

“I contacted Robert as I knew that he was accomplished at integrating HighCharts into websites. He really went the extra mile to get me the result that I was looking for, which involved a number of unexpected technical challenges. I am very grateful to him for the quality of his work and for his fantastic attention to detail.”
Nigel Beynon, CityWatch

We display here a few examples of available chart styles and functionality.

The line graph, area chart and bar chart all display a time series of values. Of particular note is the way in which viewers can navigate around the graphs to change the dates.

Consider the top graph. You can change the start and end dates in one of four ways:

Graphical presentation will automatically rebase to the start of the period, though the values seen in the panel if you hover over the performance graph are the underlying data series values.

The combination graph, showing income sources and project spend of Tanzania Development Trust, shows how much information can be presented in a small area – try moving your mouse over the graph and see the underlying values appear. Try this on the other graphs, too.

The icons to the top right of the first two charts enable the chart to be printed, or downloaded in various forms including a jpeg or PDF. These can then be used in your own documents or reports.

Updatable data for graphs and tables

These graphs can be updated in several ways: by placing data in a database; by ‘reading’ data from a CSV (Excel) spreadsheet; by hard-coding values into the program.

For investment web site www.harlynresearch.co.uk, the client loads CSV sheets to the server each week with updated data. This is then ‘read’ by the charting program, and the graphs updated.

The featured pie chart (left) uses another way of pulling in data. The data is stored in a Google Docs spreadsheet. Thus the client can update his or her data in the spreadsheet and refresh the web page and voilà, The chart should already be updated!

Also on www.harlynresearch.co.uk are a number of tables produced by a program which ‘reads’ data from a spreadsheet placed on the server. Again, the client can upload fresh data when he wishes.

Below is another example of a table produced from an Excel CSV spreadsheet. This lists London walks led by Blue Badge Guide Sue Jackson, and features on her web site www.londonhistoryguide.com. The PHP code is written to ignore walks that have already passed, so only upcoming walks are shown.

If you would like to explore how we can enhance your web site presentation through a combination of graphs, tables and text, please call or e-mail us.