Visualization

Created: Jul 26, 2023 by Pradeep Gowda Updated: Apr 05, 2024 Tagged: visualization

Fundamental rule – Friends don’t let friends make certain types of data visualization - What are they and why are they bad.

Vega-Lite Vega is a declarative format for creating, saving, and sharing visualization designs. With Vega, visualizations are described in JSON, and generate interactive views using either HTML5 Canvas or SVG.
Domain Storytelling - Domain Storytelling Domain Storytelling is a technique to transform domain knowledge into effective business software. It brings together domain experts and development teams. The domain experts can see immediately whether we understand their story correctly.

Visualization Stories

Spain lives in flats: why we have built our cities vertically

Javascript libraries

Apache ECharts via A love letter to Apache Echarts

What makes it stand out from other charting libraries is that it manages to cover a very wide range of use cases while remaining simple to use. On top of that, the documentation never failed to point me in the right direction. And most importantly, the results look good and are interactive.

Bar chart code.. I like the direct injection into an HTML element:

        const bar = echarts.init(document.getElementById('bar'));
bar.setOption({
  legend: {},
  tooltip: {},
  dataset: {
    // dataset.source contains your data in table form
    source: [
      ['repo', 'stars'],
      ['Mikochi', 129],
      ['crud_benchmark', 40],
      ['sql-repository', 7],
    ],
  },
  xAxis: {
    // category will use the first column for the x axis
    type: 'category',
  },
  yAxis: {},
  series: [
    // this creates a bar chart
    { type: 'bar' },
  ],
});

Blogs

¶ Truth & Beauty - Data visualization by Moritz Stefaner