Create With Data

I'm launching a new course Visualising Data with JavaScript on 17 Nov. It shows how to use Chart.js, Leaflet and React to build data dashboards like this jsvis-data-story.surge.sh createwithdata.com/visualisi…

I've been working on a new course Visualising Data with JavaScript. It shows how to use Chart.js, Leaflet and React to build data stories like this jsvis-data-story.surge.sh Launches on Nov 17 createwithdata.com/visualisi…

You can build a data dashboard using React, Chart.js and Leaflet and I show you how in a 38 minute video (5/7)

You'll also learn how to build a data-driven map using Leaflet (@LeafletJS) (4/7)

It includes a single lesson on D3.js (@d3js_org) and shows how to build a simple custom data visualisation (3/7)

You'll learn about @chartjs (one of the most popular JavaScript charting libraries) and learn how to make and style simple charts (2/7)

Very excited to announce my new course Visualising Data with JavaScript launches on Nov 17. It contains 2.5 hours of video content, code examples, two eBooks and shows you how to make charts, maps, data stories and data dashboards using JavaScript. createwithdata.com/visualisi… (1/7)

D3.js is a JavaScript library so it's vital you know JavaScript fairly well. This book covers the fundamentals (variables, data types, arrays, objects and functions). It also covers iteration (forEach and map) which is VERY common when working with data! #d3js #javascript

It even covers CSS positioning, which can get REALLY confusing! I'm not promising to explain all, but it covers how HTML elements are positioned (block and inline) and also covers Flexbox, which lets you solve most layout problems. #css #flexbox

CSS is vital for positioning and styling HTML and SVG elements. The book goes through the basics, and lists out commonly used properties for HTML and SVG. It also covers CSS ids and classes which are essential when visualising data with D3. #d3js #css

The book delves into SVG transforms (translate and rotate) and talks about compound transforms (which can easily get confusing).

It covers: the main HTML elements used for data visualisation (headings, lists, images and div), and commonly used SVG elements such as line, rect, circle, text and g. #d3js #html #svg

It's not a full tutorial on HTML, SVG, CSS and JavaScript, but it covers enough so you can learn to build a data visualisation with D3 (such as Energy Explorer from D3 Start to Finish createwithdata.com/d3-start-…) #d3js

Learning D3.js is hard. Especially if you don't already know HTML, SVG, CSS and JavaScript. That's why I wrote Fundamentals of HTML, SVG, CSS and JavaScript for Data Visualisation leanpub.com/html-svg-css-js-… #d3js #javascript #dataviz @leanpub

Love these coding zines by @b0rk. They make git, command line, linux etc. accessible and fun wizardzines.com/ via @maartenzam

sorry - forgot to attach this...

Hi Jeffrey - thanks for responding! It's a map... so I'm guessing dual axis doesn't apply... (I'm a bit of a Tableau newbie BTW) I'm coloring circles according to one measure and setting empty/filled according to another measure. Here's an example (in SVG).