Published
Edited
Apr 2, 2020
1 star
d3 = require('d3@5')
VegaLite = require('@observablehq/vega-lite')
import {select_distribution, distribution, randomDistributions, draw_histogram_from_buckets, draw_values, draw_buckets, x, y, max, colors} from "@d3/d3-bin"
portMathArray = d3.csv("https://gist.githubusercontent.com/RebSin/5447cca850134e6194c733d054a7ac31/raw/25f6f9c3aebde4bfe48d7d299c3247c1ef1876e2/student-mat.csv")
VegaLite({
data: {values: portMathArray},
"title": "Impact of weekly alcohol consumption on study time",
"width": 250,
"height": 250,
"mark": {
"type": "square"
},
"encoding": {
"x": {"field": "Dalc", "type": "quantitative", "axis": {"title": "Workday alcohol consumption"}},
"y": {"field": "Walc", "type": "quantitative", "axis": {"title": "Weekend alcohol consumption"}},
"color": {"aggregate": "mean", "field": "studytime", "type": "quantitative", "title": "Mean of weekly study time"},
"size": {"field": "sex", "type": "nominal", "title": "Sex"}
},
})
VegaLite({
data: {values: portMathArray},
"title": "Impact of hangouts on performance failures",
"mark": "circle",
"encoding": {
"x": {
"bin": {"maxbins": 8},
"field": "goout",
"type": "quantitative",
"title": "Frequency of hangouts"
},
"y": {
"bin": {"maxbins": 6},
"field": "failures",
"type": "quantitative",
"title": "Number of failed class"
},
"size": {
"aggregate": "count",
"type": "quantitative",
"title": "Number of students"
}
},
})
VegaLite({
data: {values: portMathArray},
"title": "Impact of hangouts on G1,G2,and G3, indicating grades for 1st period, 2nd period and final period",
"repeat": {"column": ["G1", "G2", "G3"]},
"spec": {
"layer": [
{
"mark": "point",
"encoding": {
"y": {
"aggregate": "mean",
"field": {"repeat": "column"},
"type": "quantitative",
"scale": {"domain": [0,12]}
},
"x": {
"field": "goout",
"type": "nominal",
"title": "Frequency of hangouts",
},
"detail": {
"field": "goout",
"type": "nominal"
},
"color": {"aggregate": "count", "type": "quantitative"},
"opacity": {"value": 1}
}
},
{
"mark": "line",
"encoding": {
"y": {
"aggregate": "mean",
"field": {"repeat": "column"},
"type": "quantitative"
},
"x": {
"field": "goout",
"type": "nominal"
},
"color": {"aggregate": "count",
"type": "quantitative",
"title": "Number of students", }
}
}
]
}
})
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.
