Public
Edited
Jun 23, 2023
Insert cell
md`# Project Disciplines and Researcher's Training in the Field `
Insert cell
import {select} from '@jashkenas/inputs'
Insert cell
vega = require("vega-embed@3")
Insert cell
viewof selection = {
const colorschemas = new Array("blues","reds","oranges","greens","purples","purpleblue","redpurple","yellowgreen");
const form = select({
description: "Select Color Schema",
options: colorschemas,
value: "oranges"
});
return Object.defineProperty(html`<div>${form}`, 'value', {get() { return form.value }});
}
Insert cell
d3 = require('d3')
Insert cell
data = FileAttachment("pathways_sept_15_2021@1.csv").csv()
Insert cell
Type JavaScript, then Shift-Enter. Ctrl-space for more options. Arrow ↑/↓ to switch modes.

Insert cell
Type JavaScript, then Shift-Enter. Ctrl-space for more options. Arrow ↑/↓ to switch modes.

Insert cell
colorschema=selection

Insert cell
viewof heatmap = vega({
data: { values: data },
width: 700,
height: 500,
title: 'Project Disciplines and Researcher\'s Training in the Field',
mark: 'rect',
selection: { highlight: {type: "single"}} ,
encoding: {
x: { field: 'discipline', type: 'o' , title:'Humanities discipline'},
y: { field: 'expertise', type: 'o' ,title:'Training',sort:["Doctoral degree","Master's degree","Experiential or informal study","Field of study within degree program","Undergraduate major","Undergraduate minor or certificate","Other"]},
color: {
field: 'value',
type: 'q',
scale: { scheme: selection, domain: [0, 32] }
},

}
});


Insert cell
clicked = Generators.observe((notify) => {
const clicked = (event, {datum}) => window.open(datum.url);
heatmap.addEventListener("click", clicked);
return () => heatmap.removeEventListener("click", clicked);
})



Insert cell

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.
Learn more