mutable logHistoryUpdated = false;
// https://observablehq.com/@sorig/console-log-without-leaving-your-notebook
consoleHook = {
// replay
if (!console.stdlog) {
console.stdlog = console.log.bind(console);
console.logs = [];
}
console.log = function(){
console.logs.push(Array.from(arguments));
console.stdlog.apply(console, arguments)
mutable logHistoryUpdated = true;
}
}
button3 = {
const button = html`<button>Clear output<i>x</i></button>`;
// button.onclick = () => a.push(mutable x++);
button.onclick = () => mutable switcher = -1*switcher;
return button;
}
mutable switcher = 1
log2 = {
consoleHook
logHistoryUpdated
// return console.logs
return console.logs.slice();
}
log = {
if (switcher<0) {
console.clear()
console.logs = []
mutable logHistoryUpdated = true
return []
} else {
// consoleHook
// logHistoryUpdated
// return console.logs
return console.logs.slice();
}
}
log2[3]
// Object.getOwnPropertyDescriptor(graph_all_links, 'y_indent').value
function sendDataToDash(data) {
console.log(data);
window.parent.parent.postMessage({type: 'my-message-type', data: data}, '*');
}
// margin = ({top: 305, right: 5, bottom: 5, left: 460})
margin = ({top: 0, right: 0, bottom: 0, left: 0})
height = 680
//data = FileAttachment("json_G.json").json()
data = FileAttachment("test.json").json()
types = Array.from(new Set(links.map(d => d.predicate)))
links = data.links
measureWidth = {
const context = document.createElement("canvas").getContext("2d");
return text => context.measureText(text).width;
}
stroke_width_key = d3.scaleOrdinal()
.domain(["1", undefined])
.range(["4", "0"]);
color3 = d3.scaleOrdinal()
.domain(["Activation", "Inhibition", "IncreaseAmount", "DecreaseAmount", "Associated", "HAS_A_TRIAL"])
.range(["#d5f2bd", "#edc2bb", "#d5f2bd","#edc2bb","#f5d0b0", "#c3c3e3"]);
color2 = d3.scaleOrdinal(types, d3.schemeCategory10)
color = {
const scale = d3.scaleOrdinal(d3.schemeCategory10);
//const scale = d3.scaleOrdinal([`#383867`, `#584c77`, `#33431e`, `#a36629`, `#92462f`, `#b63e36`, `#b74a70`, `#946943`]); // [`#383867`, `#584c77`, `#33431e`, `#a36629`, `#92462f`, `#b63e36`, `#b74a70`, `#946943`]
return d => scale(d.group);
}
d3.schemeCategory10
Type JavaScript, then Shift-Enter. Ctrl-space for more options. Arrow ↑/↓ to switch modes.
d3 = require("d3@6")
function clamp(x, lo, hi) {
return x < lo ? lo : x > hi ? hi : x;
}
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.
