Crafting Visual Stories with Data.
a1 = 20
b1 = 3
// Reactive Cells
a1 * b1
// Boolean
true && false
word1 + " " + word2
// Simple String
"I am a String"
// Length of a String
"012367889".length
// String Literal with backticks
`I am two lines
This is second line`
`I am the first word - ${word1}`
`I am the first word in uppercase - ${word1.toUpperCase()}`
md`### First Markdown Program
This is the second word - **${word2.toLowerCase()}**
And this is the calculation of numbers A1 & B1 = **${a1 * b1}**
`
html`<h3> The number is ${a1 * b1}</h3>`
array = [1, 2, 3, 5, 7]
// Length of Array
array.length
// Access Array Elements
array[0]
// Access Array Elements
array[1]
// Part of the Array
array.slice(1, 3)
object = ({ key: "value", anotherKey: "anotherValue" })
// Access particular key
object.key
// Access all keys
Object.keys(object)
// Access all values
Object.values(object)
data = [
{ Area: "North", Sales: 5, Profit: 2 },
{ Area: "East", Sales: 25, Profit: 8 },
{ Area: "West", Sales: 15, Profit: 6 },
{ Area: "South", Sales: 20, Profit: 5 },
{ Area: "Central", Sales: 10, Profit: 3 }
]
function multiply(a, b) {
return a * b;
}
multiply(4, 5)
d3 = require("d3@7")
url = "https://raw.githubusercontent.com/amitkaps/visdown/master/data/notes.csv"
notes1 = d3.csv(url, d3.autoType)
viewof table = Inputs.table(notes1)
// importing functions as Libraries from someone else
aq = require("arquero")
notes2 = aq.loadCSV(url)
viewof table2 = Inputs.table(notes2)
dataJson = d3.json("https://data.covid19india.org/v4/min/data.min.json")
wikiData = d3.csv(wikiCSV)
viewof table3 = Inputs.table(wikiData)
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
