Author Topic: How to present/distribute layered data?  (Read 209 times)

Offline bugbear

  • RootsChat Aristocrat
  • ******
  • Posts: 2,055
  • Census information Crown Copyright, from
    • View Profile
How to present/distribute layered data?
« on: Monday 30 August 21 10:37 BST (UK) »
There are several websites that present data as layers, often with variable transparency; maps are the most common, being able to overlay older maps with newer maps to see changes over time, or to see how industry correlates with geography or geology.

I have some family tree data that would usefully be presented as layers, that I would like to send to other members of the family.

I know that TIFF supports layers, and that Inkscape (a vector drawing program) can create layers.

What file format (that is widely supported, and cross-platform) would people recommend for distribution?

BICE Middlesex
WOMACK Norfolk/Suffolk

Offline bluesofa

  • RootsChat Extra
  • **
  • Posts: 40
  • Census information Crown Copyright, from
    • View Profile
Re: How to present/distribute layered data?
« Reply #1 on: Sunday 26 September 21 00:50 BST (UK) »
Some thoughts...

I suspect you will have already considered this, but if you were looking to share map data, then you can create and share google map layers.  I'm no expert, and would use a search engine to find guides on how to create.

If maps were not suitable, then tiff is documented, I believe an ISO standard, supported by a wide array of software, can be saved uncompressed or with lossless compression, and can store layers. 

I believe the issue will be that most software will flatten the layers when displaying which may not be what you want. Software, such as photoshop, will open a tiff file and display the layers, but I don't know which free software does this.

A possible alternative is to create a pdf file with layers.  This format is widely supported and cross-platform.  The challenge may be creating a layered pdf.  I couldn't get photoshop layers to save as pdf layers.  The solution may be to create separate pdf files for each layer, and then use other software to combine into a new layered pdf. 

If you were familiar with coding then I imagine it's possible to create a webpage where images are layered. However, again, I would be off to a search engine to work out exactly how though.

I don't know if that helps, sorry it lacks specifics.

Offline cuffie81

  • RootsChat Veteran
  • *****
  • Posts: 768
  • Census information Crown Copyright, from
    • View Profile
Re: How to present/distribute layered data?
« Reply #2 on: Sunday 26 September 21 18:28 BST (UK) »
If you're already using Inkscape then the obvious candidate is SVG. Inkscape uses SVG as it's file format, albeit with some extensions but can export "Plain SVG". Most other vector graphics applications will likely support exporting to SVG as well.

SVG has wide support by modern browsers so most people will already have a viewer. The only awkwardness is for tablet and phones users, as they may not be able to open a local file on their device using their web browser.

SVG supports embedded javascript allowing the SVG elements to be changed (eg visibility, transparency). See attached for a simple example (just change the extension). Inkscape does support adding JS for the document and objects but it seemed to cause some odd issues when I tried it, so it may be easier to do this in a text editor.

SVG can also be used in HTML, allowing it be be embedded within existing pages, and can be scripted by external javascript.

The following article has a basic, but good, intro to scripting SVG.

Using Javascript with SVG

Mozilla have a good SVG reference, including a list of attributes that can be manipulated. For you purposes you'll probably want to look into display, visibility, style and opacity. In the example I used the display setting of the style object to hide/show the layers; for some reason the display attribute of the layer object itself didn't work (my knowledge of scripting SVG is very limited so it's probably just my understanding).

SVG Attribute reference - SVG: Scalable Vector Graphics

EDIT: Updated example to also show changing opacity/transparency
Anderson Banks Beard Brewer Caves Clarke Clinch Cooling Cuff Denton Gamble Gibson Gunn Hunt Mills Muncey Norris Notzke Reid Robinson Searle Smith Trundle Turner Weedon Wells Wilson