You can go to the blockbuilder and to fork this block and create your own visualizations. Check out the Vega-Lite website for more information, tutorials, and documentation. Happy hacking!
forked from domoritz's block: Vega-Lite Bl.ocks example
license: bsd-3-clause |
You can go to the blockbuilder and to fork this block and create your own visualizations. Check out the Vega-Lite website for more information, tutorials, and documentation. Happy hacking!
forked from domoritz's block: Vega-Lite Bl.ocks example
<!DOCTYPE html> | |
<head> | |
<meta charset="utf-8"> | |
<script src="https://cdn.jsdelivr.net/npm/vega@5"></script> | |
<script src="https://cdn.jsdelivr.net/npm/vega-lite@4"></script> | |
<script src="https://cdn.jsdelivr.net/npm/vega-embed@6"></script> | |
</head> | |
<body> | |
<div id="vis"></div> | |
<script> | |
const spec = "line.vl.json"; | |
vegaEmbed("#vis", spec, { | |
timeFormatLocale: { | |
// copied from https://github.com/d3/d3-time-format/blob/master/locale/it-IT.json | |
"dateTime": "%A %e %B %Y, %X", | |
"date": "%d/%m/%Y", | |
"time": "%H:%M:%S", | |
"periods": ["AM", "PM"], | |
"days": ["Domenica", "Lunedì", "Martedì", "Mercoledì", "Giovedì", "Venerdì", "Sabato"], | |
"shortDays": ["Dom", "Lun", "Mar", "Mer", "Gio", "Ven", "Sab"], | |
"months": ["Gennaio", "Febbraio", "Marzo", "Aprile", "Maggio", "Giugno", "Luglio", "Agosto", "Settembre", "Ottobre", "Novembre", "Dicembre"], | |
"shortMonths": ["Gen", "Feb", "Mar", "Apr", "Mag", "Giu", "Lug", "Ago", "Set", "Ott", "Nov", "Dic"] | |
} | |
}) | |
// result.view provides access to the Vega View API | |
.then(result => console.log(result)) | |
.catch(console.warn); | |
</script> | |
</body> |
{ | |
"$schema": "https://vega.github.io/schema/vega-lite/v4.json", | |
"width": 600, | |
"data": {"url": "https://vega.github.io/vega-datasets/data/stocks.csv"}, | |
"transform": [{"filter": "datum.symbol==='GOOG'"}], | |
"mark": "line", | |
"encoding": { | |
"x": {"field": "date", "type": "temporal"}, | |
"y": {"field": "price", "type": "quantitative"} | |
} | |
} |