Lic. en Ciencias de la Computación, DC, FCEyN, UBA.
Profesor Asociado en el ITBA.
linechart = {
var option = {
title: {
text: "Precio del pescado en el Mercado Central de Bs As (2019)"
},
xAxis: { type: "time" },
yAxis: { type: "value", min: 120 },
tooltip: {
trigger: "axis",
axisPointer: {
type: "cross",
label: {
backgroundColor: "#6a7985"
}
}
},
series: [
{
name: "Merluza",
data: [
[new Date("2019-01"), 122],
[new Date("2019-02"), 130],
[new Date("2019-03"), 133],
[new Date("2019-04"), 154],
[new Date("2019-05"), 134],
[new Date("2019-06"), 143],
[new Date("2019-07"), 147],
[new Date("2019-08"), 147],
[new Date("2019-09"), 165],
[new Date("2019-10"), 155],
[new Date("2019-11"), 147],
[new Date("2019-12"), 156]
],
type: "line"
},
{
name: "Gatuso",
data: [
[new Date("2019-01"), 122],
[new Date("2019-02"), 155],
[new Date("2019-03"), 157],
[new Date("2019-04"), 172],
[new Date("2019-05"), 150],
[new Date("2019-06"), 176],
[new Date("2019-07"), 177],
[new Date("2019-08"), 169],
[new Date("2019-09"), 170],
[new Date("2019-10"), 176],
[new Date("2019-11"), 182],
[new Date("2019-12"), 198]
],
type: "line"
}
]
};
return draw(option, width, width * 0.7);
}
function draw(option, w, h){
var div = html`<div style="width: ${w}px;height:${h}px;" ></div>`
echarts.init(div).setOption(option);
return div;
}
// echarts = require('https://cdnjs.cloudflare.com/ajax/libs/echarts/4.8.0/echarts-en.min.js')
// echarts = require('https://cdnjs.cloudflare.com/ajax/libs/echarts/5.0.0/echarts.min.js')
echarts = require("echarts@5.5.0/dist/echarts.js")
// d3 = require("d3@5")
data = d3.tsv("https://raw.githubusercontent.com/aaizemberg/vis/gh-pages/narda/df_NardaLepes.tsv", d3.autoType)
document.body.clientWidth
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.
