{"repo":"stevana/svg-viewer-in-svg","free":true,"listed":false,"github":"https://github.com/stevana/svg-viewer-in-svg","clone":"git clone https://github.com/stevana/svg-viewer-in-svg.git","description":"SVG viewer in SVG","language":"Shell","stars":17,"topics":["observability","svg","visualization"],"license":"BSD-2-Clause","category":"analytics","readme_excerpt":"SVG viewer written in SVG This post is about how to write an SVG viewer / browser / \"slideshow\" which is itself a self-contained SVG. Motivation I've been working on a parallel processing pipeline. Each stage of the pipeline is running on a separate thread, and it takes some work items from a queue in front of it, processes them and then puts them in the queue in front of the next stage in the pipeline. In order to better understand what exactly is going on I thought I'd visualise the pipeline including the length and contents of all queues as well as the position each worker/stage is at in the queue it's processing. For now lets just imagine that an SVG image is created every time interval. So after a run of the pipeline we'll have a bunch of SVGs showing us how it evolved over time. Initially I was using the feh image viewer, which if you pass it several images lets you navigate through them using the arrow keys. But then I wondered: how can I show these SVGs to somebody else over the web? Demo Before I show you how I did it, let's have a look at the resulting pipeline visualisation (you need to click on the image): The arrows in the top left corner are clickable and will take you to the first, next, previous and last SVG respectively. What you are seeing is a run of a parallel word count pipeline, where lines are coming in from stdin and the counts are being written to stdout at the end. The code Let's start by having a look at the SVG itself. The following goes into the s","default_branch":null,"files":null,"tree":[],"storefront":"/r/stevana","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/stevana/svg-viewer-in-svg/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}