InkStitch - data visualization

The educational technology and digital learning wiki
Jump to navigation Jump to search
InkStitch - data visualization
◀▬
draft avanced
2018/08/16
Objectives
  • Create data visualizations for SVG
  • Adapt the SVG for embroidery
  • Digitize
Sub pages:

Objectives

  • Create data visualizations for SVG
  • Adapt the SVG for embroidery
  • Digitize


  • Quality: draft
  • Difficulty: avanced

.... under construction

Data visualization embroidery

Various types of charts have the potential for embroidery. We will explore this a bit over the next few weeks and months.

The following was made from a high charts demo. Please do not reuse this data without crediting highcharts and do not use it for commercial purposes. It took a fairly long time to process.

To do:

  • Add x/y axis
  • Replace the dots by a dotted line.
  • Check if the letters a big enough
SVG
Simulation

Links

Ignore these for the moment. We are just in the process of finding a suitable way to create SVG files. - Daniel K. Schneider (talk).

D3

D3 is a JavaScript library for programmers that can generate SVG

RawGraphs

RAWGraphs is an online application that can generate visualizations from tabular data (e.g. spreadsheets).

The generated SVG requires some work that should be done partly with a programming editor.

  • Remove grid lines (optional)
  • Make some labels bigger, and remove some
  • Translate all text to path
  • Remove opacity (alpha values to 100%)

Google charts

High charts

So far, the most convenient SVG output to deal with. In the bubble and line charts, data (bubbles or lines), data labels, and other information are in different groups and therefore not too difficult to manipulate.

Rough procedure

  • Remove grids
  • simplify x/y and global labels and put all of these into a single group. Within this group ungroup all.
  • Remove strokes from labels and add fill
  • Convert all text objects to paths after that.

Data collections