Engineering @huggingface 🤗. Data visualization enthusiast. Creative technologist. Open for collaborations.
y = {
const minValue = 0;
const maxValue = d3.max(data, d => d.value);
const minY = height - margin.bottom;
const maxY = margin.top;
return function(value) {
return (value - minValue)
/ (maxValue - minValue)
* (maxY - minY)
+ minY;
};
}
foo = "🌎" // Uma célula nomeada foo
bar = foo + "bar" // Uma referência (reativa) para a célula foo.
baz = {
let foo = "🏠"; // Varíavel local foo, mascarando a célula foo.
return foo + "baz"; // Uma referência à variável local foo.
}
cycle1 = cycle2 + 1
cycle2 = cycle1 + 1
function computeNodes() {
const map = new Map;
function get(name) {
let node = map.get(name);
if (!node) map.set(name, node = new Node(name));
return node;
}
for (const [i, o] of edges) {
const nodeIn = get(i);
const nodeOut = get(o);
nodeIn.outputs.add(nodeOut);
nodeOut.inputs.add(nodeIn);
}
return [...map.values()];
}
function* computeSequence() {
const nodes = computeNodes();
const queue = [];
for (const node of nodes) {
if (!(node.indegree = node.inputs.size)) {
queue.push(node);
}
}
let node;
yield {nodes, first: true};
while (node = queue.pop()) {
node.computed = true;
for (const output of node.outputs) {
if (!--output.indegree) {
queue.push(output);
}
}
yield {node, nodes};
}
yield {nodes};
}
class Node {
constructor(name) {
this.name = name;
this.computed = false;
this.indegree = 0;
this.inputs = new Set;
this.outputs = new Set;
}
}
edges = [
["d3", "chart"],
["DOM", "chart"],
["width", "chart"],
["height", "chart"],
["data", "chart"],
["x", "chart"],
["y", "chart"],
["xAxis", "chart"],
["yAxis", "chart"],
["require", "data"],
["d3", "x"],
["data", "x"],
["margin", "x"],
["width", "x"],
["d3", "y"],
["data", "y"],
["height", "y"],
["margin", "y"],
["d3", "xAxis"],
["height", "xAxis"],
["margin", "xAxis"],
["x", "xAxis"],
["d3", "yAxis"],
["margin", "yAxis"],
["y", "yAxis"],
["require", "d3"]
]
import {d3, data, height, margin} from "@d3/bar-chart"
dot = require("@observablehq/graphviz@0.2")
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.
