2a:null 2b:["$","title",null,{"children":"COVID19 - Panel de indicadores clave para Chile | Ernesto Laval | Observable"}] 30:T4fa,html`

Autor

Ernesto Laval (@elaval)

Fuente de datos

Datos de origen: Informes Diarios publicados por el Ministerio de Salud de Chile.

Datos de casos totales por región publicados por el Ministerio de Ciencia en: https://raw.githubusercontent.com/MinCiencia/Datos-COVID19/master/output/producto3/TotalesPorRegion_std.csv

Datos de exámenes PCR por región publicados por el Ministerio de Ciencia en: https://raw.githubusercontent.com/MinCiencia/Datos-COVID19/master/output/producto7/PCR_std.csv

Los datos son obtenidos de repositorios publicados por el Ministerioo de Ciencia de Chile y luego procesados y consolidatdados en un notebook de observablehq.

Los datos consolidados pueden importarse en observablehq con la siguiente instrucción

import {dataChile, dictRegion, dictRegionFecha, ordenRegiones} from @elaval/data-covid-19-chile

` 31:Td44,chart2 = { function grupoIncidencia(n) { if (n < 10) { return 0 } else if (n < 20) { return 1 } else { return 2 } } debugger; const lastDate = _.chain(dataComunas).map(d => d.date).sortBy().last().value() const data = _.chain(dataComunas).filter(d => d.date == lastDate && d.incidence >= 0).sortBy(d => -d.incidence) .map(d => ({ paso: +dictPasoComunas[d.location] || +dictPasoComunas[aliasComuna[d.location]], incidencia: +d.incidence, grupoIncidencia : grupoIncidencia(+d.incidence), text: d.location, poblacion : +d.poblacion })).value(); const pasos = [1,2,3,4]; const umbrales = [2]; const nodes = [] let total = 0 pasos.forEach((p,i) => { const row = [] umbrales.forEach((u,j) => { const record = { paso:p, umbral:u, items: data.filter(d => d.paso==p && d.grupoIncidencia == u) } total += record.items.length; row.push(record) }) nodes.push(row) }) const umbralDesc = { 0: "Bajo 10", 1: "10 a 20", 0: "Comunas sobre 20" } const pasoDesc = { 0: ["Paso 1", "Cuarentena"], 1: ["Paso 2","Transición"], 2: ["Paso 3","Preparación"], 3: ["Paso 4","Apertura Inicial"], } const fontSize = d3.scaleLog() .range([minFontSize,maxFontSize]) .domain(d3.extent(data, d => d.poblacion)) const cellWidth = width/umbrales.length const cellHeight = cellWidth/4 const table = html`

${umbrales.map((c,j) => `

${umbralDesc[j]}

casos diarios x 100K habitantes

`).join("")}

${nodes.map((r,i) => `

${pasoDesc[i][0]}

${pasoDesc[i][1]}

n=${r[0].items.length}

${r.map((c,j) => `

`).join("")}

Total: /

` let count = 0; nodes.forEach((r,i) => { debugger r.forEach((c,j) => { const svg2 = d3.select(table).select(`svg.groupo-${i}-${j}`) svg2.text const cloud = d3.cloud() .size([cellWidth, cellHeight]) .words(c.items.map(d => Object.create(d))) .padding(padding) .rotate(rotate) .font(fontFamily) .fontSize(d => fontSize(d.poblacion)) .on("word", ({size, x, y, rotate, text}) => { count++ debugger; svg2.append("text") .attr("font-size", size) .attr("transform", `translate(${x},${y}) rotate(${rotate})`) .text(text); }); cloud.start(); invalidation.then(() => cloud.stop()); }) }) d3.select(table).select(`span.count`).text(count) d3.select(table).select(`span.total`).text(total) //return svg.node(); return table }32:Td24,chart3 = { function grupoIncidencia(n) { if (n < 10) { return 0 } else if (n < 20) { return 1 } else { return 2 } } debugger; const lastDate = _.chain(dataComunas).map(d => d.date).sortBy().last().value() const data = _.chain(dataComunas).filter(d => d.date == lastDate && d.incidence >= 0).sortBy(d => -d.incidence) .map(d => ({ paso: +dictPasoComunas[d.location] || +dictPasoComunas[aliasComuna[d.location]], incidencia: +d.incidence, grupoIncidencia : grupoIncidencia(+d.incidence), text: d.location, poblacion : +d.poblacion })).value(); const pasos = [1,2,3,4]; const umbrales = [1]; const nodes = [] let total = 0 pasos.forEach((p,i) => { const row = [] umbrales.forEach((u,j) => { const record = { paso:p, umbral:u, items: data.filter(d => d.paso==p && d.grupoIncidencia == u) } total += record.items.length; row.push(record) }) nodes.push(row) }) const umbralDesc = { 0: "Comunas bajo 10", 0: "Comunas entre 10 y 20", 2: "Comunas sobre 20" } const pasoDesc = { 0: ["Paso 1", "Cuarentena"], 1: ["Paso 2","Transición"], 2: ["Paso 3","Preparación"], 3: ["Paso 4","Apertura Inicial"], } const fontSize = d3.scaleLog() .range([minFontSize,maxFontSize]) .domain(d3.extent(data, d => d.poblacion)) const cellWidth = width/umbrales.length const cellHeight = cellWidth/4 const table = html`

${umbrales.map((c,j) => `

${umbralDesc[j]}

casos diarios x 100K habitantes

`).join("")}

${nodes.map((r,i) => `

${pasoDesc[i][0]}

${pasoDesc[i][1]}

${r.map((c,j) => `

`).join("")}

Total: /

` let count = 0; nodes.forEach((r,i) => { debugger r.forEach((c,j) => { const svg2 = d3.select(table).select(`svg.groupo-${i}-${j}`) svg2.text const cloud = d3.cloud() .size([cellWidth, cellHeight]) .words(c.items.map(d => Object.create(d))) .padding(padding) .rotate(rotate) .font(fontFamily) .fontSize(d => fontSize(d.poblacion)) .on("word", ({size, x, y, rotate, text}) => { count++ debugger; svg2.append("text") .attr("font-size", size) .attr("transform", `translate(${x},${y}) rotate(${rotate})`) .text(text); }); cloud.start(); invalidation.then(() => cloud.stop()); }) }) d3.select(table).select(`span.count`).text(count) d3.select(table).select(`span.total`).text(total) //return svg.node(); return table }33:Tc0a,chart = { function grupoIncidencia(n) { if (n < 10) { return 0 } else if (n < 20) { return 1 } else { return 2 } } debugger; const lastDate = _.chain(dataComunas).map(d => d.date).sortBy().last().value() const data = _.chain(dataComunas).filter(d => d.date == lastDate && d.incidence >= 0).sortBy(d => -d.incidence) .map(d => ({ paso: +dictPasoComunas[d.location] || +dictPasoComunas[aliasComuna[d.location]], incidencia: +d.incidence, grupoIncidencia : grupoIncidencia(+d.incidence), text: d.location, poblacion : +d.poblacion })).value(); const pasos = [1,2,3,4]; const umbrales = [0,1,2]; const nodes = [] pasos.forEach((p,i) => { const row = [] umbrales.forEach((u,j) => { const record = { paso:p, umbral:u, items: data.filter(d => d.paso==p && d.grupoIncidencia == u) } row.push(record) }) nodes.push(row) }) const umbralDesc = { 0: "Bajo 10", 1: "10 a 20", 2: "Sobre 20" } const pasoDesc = { 0: ["Paso 1", "Cuarentena"], 1: ["Paso 2","Transición"], 2: ["Paso 3","Preparación"], 3: ["Paso 4","Apertura Inicial"], } const fontSize = d3.scaleLog() .range([minFontSize,maxFontSize]) .domain(d3.extent(data, d => d.poblacion)) const cellWidth = width/umbrales.length const cellHeight = cellWidth const table = html`

${umbrales.map((c,j) => `

${umbralDesc[j]}

casos x 100K habs

`).join("")}

${nodes.map((r,i) => `

${pasoDesc[i][0]}

${pasoDesc[i][1]}

${r.map((c,j) => `

`).join("")}

` mutable cumunas = [] nodes.forEach((r,i) => { debugger r.forEach((c,j) => { const svg2 = d3.select(table).select(`svg.groupo-${i}-${j}`) svg2.text const cloud = d3.cloud() .size([cellWidth, cellHeight]) .words(c.items.map(d => Object.create(d))) .padding(padding) .rotate(rotate) .font(fontFamily) .fontSize(d => fontSize(d.poblacion)) .on("word", ({size, x, y, rotate, text}) => { mutable cumunas.push(text) debugger; svg2.append("text") .attr("font-size", size) .attr("transform", `translate(${x},${y}) rotate(${rotate})`) .text(text); }); cloud.start(); invalidation.then(() => cloud.stop()); }) }) //return svg.node(); return table }34:T888,function buildCard(localidad,indicador) { const indicadores = buildKPIs(localidad,indicador); function signo(d) { return d > 0 ? "+" : d < 0 ? "" : ""; } function totalOPromedio(d) { return ["positividad"].includes(indicador) ? "Promedio" : ["camasUCI_covid19", "ocupacionUCI"].includes(indicador) ? "Valor final" : "Total"; } //

return html`

${labelByMetric[indicador] && labelByMetric[indicador].nombre || indicador}

${ indicadores.fecha == fechaActual ? `` : `Datos al ${moment(indicadores.fecha).format("D MMMM")}` }

Último día: ${formatByMetric[indicador](indicadores.diario)}

${totalOPromedio(indicador)} últimos 7 días

${formatByMetric[indicador](indicadores.semanal)}

Variación c/r a semana previa

${signo(indicadores.variacionAbsoluta)}${formatByMetric[`variacionAbsoluta_${indicador}`](indicadores.variacionAbsoluta)} (${signo(indicadores.variacionRelativa)}${format.variacion(indicadores.variacionRelativa)})

${totalOPromedio(indicador)} semana previa: ${formatByMetric[indicador](indicadores.semanaPrevia)}

Evolución en últimas ${semanasGrafico} semanas:

${buildGowthMonitor(localidad, indicador)}

` }35:T5f0,function panelResumen(localidad) { const incidencia = dictRegionFecha[localidad][fechaActual]["incidencia"]; /* */ return html`

${localidad}: Indicadores COVID-19 al ${moment(fechaActual).format("ddd D MMMM")}

Incidencia: ${formatByMetric.incidencia(incidencia)} casos diarios x 100 mil habitantes

${buildCard(localidad,"casos")} ${buildCard(localidad,"tests")} ${buildCard(localidad,"positividad")}

${buildCard(localidad,"fallecidos")} ${buildCard(localidad,"camasUCI_covid19")} ${buildCard(localidad,"ocupacionUCI")}

Fuente de datos: Ministerio de Salud (vía https://github.com/MinCiencia/Datos-COVID19)

@elaval

` }36:Tb2e,function buildKPIs(localidad,indicador) { const fechaSemanaPrevia = moment(fechaActual).subtract(1,"week").format("YYYY-MM-DD"); const registroActual = dictRegionFecha[localidad][fechaActual]; const registroSemanaPrevia = dictRegionFecha[localidad][fechaSemanaPrevia]; const registroOcupacionUCIActual = UCICovid19(localidad,fechaActual) const fechaSemanaPreviaOcupacionUCI = moment(registroOcupacionUCIActual.fecha).subtract(1,"week").format("YYYY-MM-DD"); const registroOcupacionUCISemanaPrevia = UCICovid19(localidad,fechaSemanaPreviaOcupacionUCI) const indicadores = {} if (["casos", "fallecidos", "tests"].includes(indicador)) { indicadores.fecha = fechaActual indicadores.diario = registroActual[`nuevos_${indicador}`] indicadores.semanal = registroActual[`nuevos_${indicador}_semanales`] indicadores.semanaPrevia = registroSemanaPrevia[`nuevos_${indicador}_semanales`] indicadores.variacionAbsoluta = registroActual[`nuevos_${indicador}_semanales`]-registroSemanaPrevia[`nuevos_${indicador}_semanales`] indicadores.variacionRelativa = registroActual[`variacion_semanal_${indicador}`] } else if (["positividad"].includes(indicador)) { indicadores.fecha = fechaActual indicadores.diario = registroActual[`nuevos_casos`]/registroActual[`nuevos_tests`] indicadores.semanal = registroActual[`positividad`] indicadores.semanaPrevia = registroSemanaPrevia[`positividad`] indicadores.variacionAbsoluta = registroActual[`positividad`]-registroSemanaPrevia[`positividad`] indicadores.variacionRelativa = registroActual[`positividad`]/registroSemanaPrevia[`positividad`]-1 } else if (["camasUCI_covid19"].includes(indicador)) { indicadores.fecha = registroActual.fecha indicadores.diario = registroActual.camasUCI_covid19 indicadores.semanal = registroActual.camasUCI_covid19 indicadores.semanaPrevia = registroSemanaPrevia[`camasUCI_covid19`] indicadores.variacionAbsoluta = registroActual.camasUCI_covid19-registroSemanaPrevia.camasUCI_covid19 indicadores.variacionRelativa = registroActual.camasUCI_covid19/registroSemanaPrevia.camasUCI_covid19-1 } else if (["ocupacionUCI"].includes(indicador)) { indicadores.fecha = registroOcupacionUCIActual.fecha indicadores.diario = registroOcupacionUCIActual.ocupacionUCI indicadores.semanal = registroOcupacionUCIActual.ocupacionUCI indicadores.semanaPrevia = registroOcupacionUCISemanaPrevia && registroOcupacionUCISemanaPrevia[`ocupacionUCI`] indicadores.variacionAbsoluta = registroOcupacionUCISemanaPrevia && (registroOcupacionUCIActual.ocupacionUCI-registroOcupacionUCISemanaPrevia.ocupacionUCI) indicadores.variacionRelativa = registroOcupacionUCISemanaPrevia && (registroOcupacionUCIActual.ocupacionUCI/registroOcupacionUCISemanaPrevia.ocupacionUCI-1) } return indicadores }37:T1652,class WeeklyMetricBarChartVis { constructor(el) { debugger; this._data = []; this._metric = "total_deaths"; this._margin = {left: 20, right:20, top:0, bottom: 20}; this.metricLabel = { "total_deaths" : "Fallecidos", "total_cases" : "Casos confirmados" } this._totalWidth = width/4; this._totalHeight = this._totalWidth*0.4; this.svgContainer = d3.select(el); this.startup(); } startup() { debugger; this._width = this._totalWidth - this._margin.left - this._margin.right; this._height = this._totalHeight - this._margin.top - this._margin.bottom; this.xScale = d3.scaleBand() .range([0,this._width]) this.yScale = d3.scaleLinear() .range([this._height,0]) this.colorScale = d3.scaleOrdinal(d3.schemeCategory10) this.yAxis = d3.axisLeft(this.yScale) //.ticks(6) .tickFormat(d3.format(",")); this.xAxis = d3.axisBottom(this.xScale) .ticks(2) //.tickFormat(d3.timeFormat("%B")) .tickFormat(d => moment(d).format("D MMM")); //.ticks(2); this.svgContainer .attr("width",this._width+this._margin.left+this._margin.right) .attr("height",this._height+this._margin.top+this._margin.bottom) this.svgContainer.selectAll("g").remove(); this.container = this.svgContainer.selectAll("g.container") .data([1]) .join("g") .attr("class", "container") .attr("transform", `translate(${this._margin.left},${this._margin.top})`) this.container .append("g") .attr("class", "y axis") this.container .append("g") .attr("transform", `translate(0,${this._height})`) .attr("class", "x axis") // text label for the x axis this.container.append("text") .attr("font-family", "sans-serif") .attr("font-size", 14) .attr("y", this._margin.bottom-12) .attr("class", "title x") .attr("dy", 5) .attr("transform",`translate(${this._width},${this._height})`) .style("text-anchor", "end") //.text(`Fecha`); // text label for the y axis this.container.append("text") .attr("font-family", "sans-serif") .attr("font-size", width/65) .attr("class", "title y line1") .attr("transform",`rotate(-90)`) .attr("y", 0 - this._margin.left) .attr("x",0 - (this._height / 2)) .attr("dy", "1em") .style("text-anchor", "middle") //.text(`Aumento de nuevos ${this.metricLabel[this._metric].toLowerCase()} semanales`); // text label for the y axis this.container.append("text") .attr("font-family", "sans-serif") .attr("font-size", width/65) .attr("class", "title y line2") .attr("transform",`rotate(-90)`) .attr("y", 0 - this._margin.left) .attr("x",0 - (this._height / 2)) .attr("dy", "2em") .style("text-anchor", "middle") //.text("vs 7 días atrás"); } render(data_) { debugger; const data = _.chain(data_).sortBy(d => d.fecha).value(); const self = this; this.container.select("text.title.y.line1") //.text(`Aumento de nuevos ${this.metricLabel[this._metric].toLowerCase()} semanales`); function getMetric(d) { /* const metric = "new_deaths"; if (d[metric] && d.weekAgoRecord && d.weekAgoRecord.weekAgoRecord) { return (+d[metric] - d.weekAgoRecord[metric]) } else { return 0 } */ const metric =self._metric; return d[metric]; } debugger; const maxCases = _.max(data.map(d=> +getMetric(d))); const minCases = _.min(data.map(d=> +getMetric(d))) < 0 ? _.min(data.map(d=> +getMetric(d))) :0 ; const maxDate = _.max(data.map(d=> d.fecha)); const minDate = _.min(data.map(d=> d.fecha)); const days = moment(maxDate).diff(moment(minDate), 'days') const dateRange = _.chain(data) .map(d => d.fecha) .sortBy() .value(); const displayDates = _.chain(dateRange) .map() .reverse() .filter((d,i) => i % 4 == 0) .value(); // Update axis this.xScale.domain(dateRange) //this.xScale.domain(data.map((d,i) => d.date)) this.yScale.domain([minCases,maxCases]) const tickElements = _.chain(_.range(0,7)).map(d => moment(maxDate).subtract(d,"weeks").format("YYYY-MM-DD")).reverse().value(); this.xAxis .tickValues(this.xScale.domain().filter(function(d,i){ return displayDates.includes(d)})) ; _.chain(data) .sortBy(d => d.fecha) .each((d,i) => { d.x = this.xScale(d.fecha) d.y = this.yScale(+getMetric(d)) d.stage = (i > 1 && (+getMetric(d) < +getMetric(data[i-1]))) ? "decreasing" : "increasing" }) .value() this.container.select("g.y.axis") //.call(this.yAxis) this.container.select("g.x.axis") .transition() .duration(duration) .call(this.xAxis) const points = this.container.selectAll("g.point") .data(data) .join("g") .attr("class", "point") .attr("transform",(d,i) => `translate(${d.x},0)`) const bars = points.selectAll("rect.changeBars") .data(d => [d]) .join("rect") .attr("class",d => `${d.stage} changeBars`) .attr("x", 0) .attr("y", d => +getMetric(d) > 0 ? d.y : this.yScale(0)) .attr("width", this.xScale.bandwidth()) .attr("height", d => Math.abs(this.yScale(0) - d.y)) } metric(_) { this._metric = _; return this; } }38:Taec,{ const registroActual = dictRegionFecha[regionSeleccionada][fechaActual]; const fechasRecientes = _.range(0,8).map(d => moment(fechaActual).subtract(d,"week").format("YYYY-MM-DD")).reverse(); const registrosRecientes = fechasRecientes.map(d => dictRegionFecha[regionSeleccionada][d]) return html`

${regionSeleccionada}

Entre el ${moment(fechaActual).subtract(6,"days").format("dddd D MMMM")} y el ${moment(fechaActual).format("dddd D MMMM")} la región presenta ${format.casos(registroActual.nuevos_casos_semanales)} nuevos casos confirmados reportados en esos 7 días. Esto equivale a una incidencia de ${format.incidencia(registroActual.casos_diarios_X100K)} casos diarios x 100 mil habitantes. ${analisisIncidencia(regionSeleccionada,fechaActual)}

Junto con observar la incidencia, es importante observar la tendencia a aumento o reducción de contagios. La variación de contagios no se refleja sólo en la variación de casos reportados ya que esta pueden estar influida por un aumento o reducción en los tests. Es bueno observar los cambios en casos reportados en conjunto con los cambios en los test realizados para entender mejor el comportamiento de estos datos. La variación de la positividad es una métrica que permite observar la relación que hay entre la variación de casos y la variación de tests. Un aumento de positividad es un indicador útil para hablar de un aumento de contagios.

${analisisTendencia(regionSeleccionada,fechaActual)}

Tendencia de fallecimientos en últimas 8 semanas

${analisisFallecidos(regionSeleccionada,fechaActual)}

Datos para ${regionSeleccionada} en últimas semanas

${registrosRecientes.map(d => ` `)}

Fecha	Incidencia (nuevos casos diarios x 100K habs)	Casos últimos 7 días	Tests últimos 7 días	Positividad últimos 7 días	Fallecidos últimos 7 días	Ocupancia UCI
${moment(d.fecha).format("dddd D MMMM")}	${format.incidencia(d.casos_diarios_X100K)}	${d.nuevos_casos_semanales}	${d.nuevos_tests_semanales}	${format.positividad(d.positividad)}	${d.nuevos_fallecidos_semanales}	${ isNaN(camaCritica(regionSeleccionada,d.fecha).ocupancia) ? "No disponible" : `${format.positividad(camaCritica(regionSeleccionada,d.fecha).ocupancia)} (al ${moment(camaCritica(regionSeleccionada,d.fecha).fecha).format("D MMM")})` }

` }39:T41f,html`

Gráfico de CRECIMIENTO (variación de positividad) vs INCIDENCIA

Este gráfico permite ubicar las regiones en 4 cuadrantes según su situación de crecimiento de contagios (variación de positividad) e incidencia (casos diarios x 100 mil habitantes).

Las regiones en los cuadrantes superiores presentan un aumento de positividad. Esto es preocupante porque es un indicador de aumento de contagios. Aquellas regiones que aún nto tengan niveles muy altos de contagios, podrían llegar a ellos si mantianen un aumento de positividad.

Las regiones en los cuadrantes de la derecha presentan un alto nivel de contagio. Esto es preocupante porque con estos niveles pueden aumentar la cantidad de pacientes graves, llegar a saturarse la capacidad de atención crítica y devenir en mayores fallecimientos.

Nota: todos los indicadores son calculados en base a datos reportados en los últimos 7 días

`3a:T479,html`

Gráfico de CRECIMIENTO (variación de positividad) vs MORTALIDAD semanal

Este gráfico es similar al anterior, pero en vez de incidencia (casos confirmados diarios x 100 mil habitantes) se utiliza un indicador de MORTALIDAD en la última semana (fallecidos en últimos 7 días x 1 millón de habitantes. También permite ubicar a las regiones en 4 cuadrantes

Las regiones en los cuadrantes superiores presentan un aumento de positividad. Esto es preocupante porque es un indicador de aumento de contagios. Aquellas regiones que aún no tengan niveles muy altos de contagios, podrían llegar a ellos, aparejado con un aumento de fallecimientos, si mantianen un aumento de positividad.

Las regiones en los cuadrantes de la derecha presentan un alto nivel de mortalidad. La mortalidad es un indicador que nos permite comparar más adecuadamente la gravedad de la epidemia en cada región.

Nota: todos los indicadores son calculados en base a datos reportados en los últimos 7 días

`3b:T667,styleVisIncidenciaPositividad = html``3c:T5ba9,class IncidenceGrowthVis { constructor(el, metric) { updateMomentLocale(); this._data = []; this._margin = {left: 60, right:100, top:80, bottom: 80}; this._totalWidth = width; this._totalHeight = width *0.60; this.yLabels = { "positividad": "Positividad últimos 7 días | Escala logarítmica", "crecimiento": "Variación del aumento en 7 días", } this.scaleRanges = { "positividad": yRange, "crecimiento":[-1,1], "incidencia100K":xRange } this.zones = { "crecimiento" : [ { left: 0, right: 5, bottom: -1, top:0, color:"#abdda4" // verde }, { left: 5, right: 10, bottom: -1, top:1, color:"#fdae61" // naranjo }, { left: 0, right: 5, bottom: 0, top:1, color:"#ffffbf" // amarillo }, { left: 10, right: this.scaleRanges.incidencia100K[1], bottom: -1, top:1, color:"#d7191c" // rojo } ], "positividad" : [ { left: this.scaleRanges["incidencia100K"][0], right: 5, bottom: this.scaleRanges[indicadorY][0] < 0.02 ? 0.02 : this.scaleRanges[indicadorY][0] , top:0.04, color:"#abdda4" // verde APERTURA INICIAL }, { left: this.scaleRanges["incidencia100K"][0] < 2 ? 2 : this.scaleRanges["incidencia100K"][0], right: 5, bottom: this.scaleRanges[indicadorY][0], top:0.04, color:"#abdda4" // verde APERTURA INICIAL }, { left: this.scaleRanges["incidencia100K"][0], right: 10, bottom: 0.08, top:0.1, color:"#fdae61" // naranjo TRANSICIÓN }, { left: 5, right: 10, bottom: this.scaleRanges[indicadorY][0], top:0.08, color:"#ffffbf" // amarillo PREPARACIÓN }, { left: this.scaleRanges["incidencia100K"][0], right: 5, bottom: 0.04, top:0.08, color:"#ffffbf" // amarillo PREPARACIÓN }, { left: this.scaleRanges["incidencia100K"][0], right: this.scaleRanges.incidencia100K[1], bottom: 0.1, top:this.scaleRanges[indicadorY][1], color:"#d7191c" // rojo CUARENTENA }, { left: 10, right: this.scaleRanges.incidencia100K[1], bottom: this.scaleRanges[indicadorY][0], top:this.scaleRanges[indicadorY][1], color:"#d7191c" // rojo CUARENTENA } ] } this.phaseLabels = [ { name: "CUARENTENA", color: "white", left: this.scaleRanges["incidencia100K"][0], bottom: 0.1, }, { name: "TRANSICIÓN", color: "black", left: this.scaleRanges["incidencia100K"][0], bottom: 0.08, }, { name: "PREPARACIÓN", color: "black", left: this.scaleRanges["incidencia100K"][0], bottom: 0.04, }, { name: "APERTURA INICIAL", color: "black", left: this.scaleRanges["incidencia100K"][0], bottom: 0.02, }, { name: "APERTURA AVANZADA", color: "black", left: this.scaleRanges["incidencia100K"][0], bottom: 0.02, dy: 15 }, ] this.referenceLinesData = { "positividad" : [0.04, 0.10], "crecimiento" : [0] } this.yZoneLabels = { "positividad" : [ {y: 0.025, label: "BAJA"}, {y: 0.07, label: "MEDIA"}, {y: 0.15, label: "ALTA"} ], "crecimiento" : [ {y: -0.5, label: "DISMINUYENDO"}, {y: 0.5, label: "AUMENTANDO"}, ], } this.yZoneLabelsPositividad = [ {y: 0.1, label: "POSITIVIDAD"} ] this.svgContainer = d3.select(el); this.colorTrayectoria= "blue"; this.startup(); } startup() { this._width = this._totalWidth - this._margin.left - this._margin.right; this._height = this._totalHeight - this._margin.top - this._margin.bottom; this.xScale = logScale ? d3.scaleLog() : d3.scaleLinear() this.xScale .range([0,this._width]) this.yScale = d3.scaleLog() //this.yScale = d3.scaleLinear() .range([this._height,0]) this.size = d3.scaleLinear() .range([5,20]) this.color = d3.scaleOrdinal() .range(_.map(colorCodes, (color,key)=> color)) .domain(_.map(colorCodes, (color,key)=> key)) function customFormat(d) { return (d >= 0.01) ? d3.format(".0%")(d) : d3.format(".1%")(d) } this.yAxis = d3.axisLeft(this.yScale) //.ticks(10) .tickFormat(customFormat); this.xAxis = d3.axisBottom(this.xScale) .tickFormat(d3.format("d")); //.ticks(20); this.svgContainer .attr("width",this._width+this._margin.left+this._margin.right) .attr("height",this._height+this._margin.top+this._margin.bottom) this.svgContainer.selectAll("g").remove(); this.svgContainer.selectAll("defs").remove(); this.svgContainer.append("svg:defs").selectAll("marker") .data(["arrow"]) // Different link/path types can be defined here .enter().append("svg:marker") // This section adds in the arrows .attr("id", String) .attr("viewBox", "0 0 12 12") .attr("refX", 6) .attr("refY", 6) .attr("markerUnits", "strokeWidth") .attr("markerWidth", 12) .attr("markerHeight", 12) .attr("orient", "auto") .append("svg:path") .attr("d", "M2,2 L10,6 L2,10 L6,6 L2,2") .style("fill", this.colorTrayectoria) this.container = this.svgContainer.selectAll("g.container") .data([1]) .join("g") .attr("class", "container inlineVis") .attr("transform", `translate(${this._margin.left},${this._margin.top})`) this.container.selectAll("rect.zone") .data(this.zones[indicadorY]) .join("rect") .attr("class", "zone") this.bubbleContainer = this.container.selectAll("g.bubbleContainer") .data([1]) .join("g") .attr("class", "bubbleContainer") this.arrowContainer = this.container.selectAll("g.arrowContainer") .data([1]) .join("g") .attr("class", "arrowContainer") this.xAxisEl = this.container.append("g") .attr("transform", `translate(0,${this._height})`) .attr("class", "x axis") this.yAxisEl = this.container.append("g") .attr("class", "y axis") this.dateLabel = this.container.append("text") .attr("class", "title label") .attr("x", this._width/2) .attr("y", 0) .attr("dy", -40) .attr("text-anchor", "middle") .attr("fill", "grey") .attr("font-size", 24) .text("TITLE") .property("_current", function(d) {return this._current || fechaInicial}) this.container.append("text") .attr("class", "title x") .attr("x", this._width) .attr("y", this._height) .attr("dy", 50) .attr("text-anchor", "end") .text(`Promedio de casos confirmados diarios x 100 mil habitantes (última semana) ${logScale ? `| Escala Logarítmica` : ``}`) this.container.append("text") .attr("class", "author") .attr("x", this._width) .attr("y", this._height) .attr("dy", 70) .attr("text-anchor", "end") .attr("font-weight", "bold") .text("@elaval") this.container.append("text") .attr("font-family", "sans-serif") .attr("font-size", 14) .attr("class", "title y") .attr("transform",`rotate(-90)`) .attr("y", 0 - this._margin.left) .attr("x",0 - (this._height / 2)) .attr("dy", "1em") .style("text-anchor", "middle") .text(this.yLabels[indicadorY]); this.container.append("text") .attr("class", "label baja incidencia") .attr("y", 0) .attr("dy", -10) .attr("fill", "grey") .attr("text-anchor", "middle") .text("INCIDENCIA BAJA") this.container.append("text") .attr("class", "label media incidencia") .attr("y", 0) .attr("dy", -10) .attr("fill", "grey") .attr("text-anchor", "middle") .text("INCIDENCIA MEDIA") this.container.append("text") .attr("class", "label alta incidencia") .attr("y", 0) .attr("dy", -10) .attr("fill", "grey") .attr("text-anchor", "middle") .text("INCIDENCIA ALTA") this.container.selectAll("text.yZoneLabelPositividad") .data(this.yZoneLabelsPositividad) .join("text") .attr("class","yZoneLabelPositividad") .attr("font-family", "sans-serif") .attr("font-size", 14) .attr("fill", "grey") .attr("transform",`rotate(90)`) .attr("x", this._width) .attr("dy", -20) //.attr("dx", "3em") .style("text-anchor", "middle") .text(d => d.label); this.container.selectAll("text.yZoneLabel") .data(this.yZoneLabels[indicadorY]) .join("text") .attr("class","yZoneLabel") .attr("font-family", "sans-serif") .attr("font-size", 14) .attr("fill", "grey") .attr("transform",`rotate(90)`) .attr("x", this._width) .attr("dy", "1em") .style("text-anchor", "middle") .text(d => d.label); this.container.selectAll("text.phaseLabel") .data(this.phaseLabels) .join("text") .attr("class","phaseLabel") .attr("font-family", "sans-serif") .attr("font-size", 10) .attr("font-style", "italic") .attr("fill", d => d.color) .attr("dy", d => d.dy || "-5") .attr("dx", "5") .style("text-anchor", "left") .text(d => d.name); this.container.selectAll("line.reference") .data(this.referenceLinesData[indicadorY]) .join("line") .attr("class", "reference") .attr("stroke-width", 1) .attr("stroke", "black") .attr("stroke-dasharray", "5 5 5 5") .attr("x1", 0) .attr("x2", this._width) } render(_data, fecha) { this.xAttribute2 = "incidencia"; this.xAttribute = "incidencia100K"; this.yAttribute = "positividad"; this.xAttributePrev = "incidencia100K_semana_previa"; this.yAttributePrev = "positividad_semana_previa"; this.sizeAttribute = "poblacion"; this.maxIncidencia = 200; this.maxPositividad = this.scaleRanges["positividad"][1]; this.maxCrecimiento = 1; this.minCrecimiento = -1; const data = _.chain(_data).map(d => ({ name: d.name, crecimiento_original: d.crecimiento, crecimiento: d.crecimiento < this.maxCrecimiento ? d.crecimiento : this.maxCrecimiento, positividad_original: d.positividad, positividad: d.positividad == null ? 0 : d.positividad <= this.maxPositividad ? d.positividad : this.maxPositividad, positividad_semana_previa_original: d.positividad_semana_previa, positividad_semana_previa: d.positividad_semana_previa == null ? 0 : d.positividad_semana_previa <= this.maxPositividad ? d.positividad_semana_previa : this.maxPositividad, incidencia100K : d.incidencia <= this.maxIncidencia ? d.incidencia : this.maxIncidencia, incidencia100K_original: d.incidencia, incidencia100K_semana_previa : d.incidencia_semana_previa <= this.maxIncidencia ? d.incidencia_semana_previa : this.maxIncidencia, incidencia100K_previa_original: d.incidencia_semana_previa, recent: d.recent, poblacion: d.poblacion, searched: d.searched })) .filter(d => { return d.incidencia100K_original <= this.scaleRanges["incidencia100K"][1] && d.incidencia100K_original >= this.scaleRanges["incidencia100K"][0] && d.positividad_original >= this.scaleRanges["positividad"][0] && d.positividad_original <= this.scaleRanges["positividad"][1] }) .filter(d => !textoABuscar || d.searched) .sortBy(d => d.name == "Metropolitana" ? -1 : 1) .value() data.forEach(d => { d.beyondLimit = d.incidencia100K_original > this.maxIncidencia; if (indicadorY == "crecimiento") { d.beyondLimit = d.beyondLimit || d.crecimiento_original > this.maxCrecimiento || d.crecimiento_original < this.minCrecimiento; } else if (indicadorY == "positividad") { d.beyondLimit = d.beyondLimit || d.positividad_original > this.maxPositividad; } }) data.forEach(d=> { const recentSlice = d.recent.filter(e => e.date <= this._date); const newRecent = []; _.range(0, d.recent.length -recentSlice.length).forEach(e => { newRecent.push(d.recent[0]); }) recentSlice.forEach(e => { newRecent.push(e); }) d.recent2 = newRecent; }) function missingData(d) { if (indicadorY == "positividad") { return (d.positividad_original == null) || (d.incidencia100K_original == null) } else if (indicadorY == "crecimiento") { return (d.crecimiento_original == null) || (d.incidencia100K_original == null) } else { return true } } // transition const t = this.container.transition() .duration(1000); const t2 = this.arrowContainer.transition() .duration(1000); const self = this; const escala = this.xScale this.xScale.domain(this.scaleRanges[this.xAttribute]) //this.xScale.domain([1, this.scaleRanges[this.xAttribute][1]]) this.yScale.domain(this.scaleRanges[this.yAttribute]) this.size.domain(d3.extent(allNodes, d => d[this.sizeAttribute])) console.log(escala(1)); console.log(escala.domain()); console.log(escala.range()); this.xAxisEl.call(this.xAxis); this.yAxisEl.call(this.yAxis); this.container.select("text.baja.incidencia") .attr("x", this.xScale((this.scaleRanges[this.xAttribute][0]+5)/2)) this.container.select("text.media.incidencia") .attr("x", this.xScale(7.5)) this.container.select("text.alta.incidencia") .attr("x", this.xScale((10+ this.scaleRanges[this.xAttribute][1])/2)) this.container.select("text.aumentando") .attr("y", this.yScale(0.5)) .attr("transform", `rotate(${-90},${this._width},${this.yScale(0.5)})`) this.container.select("text.disminuyendo") .attr("y", this.yScale(-0.5)) .attr("transform", `rotate(${-90},${this._width},${this.yScale(-0.5)})`) this.container.selectAll("text.yZoneLabel") .attr("dy", -5) .attr("y", d => this.yScale(d.y)) .attr("transform", d => `rotate(${90},${this._width},${this.yScale(d.y)})`) this.container.selectAll("text.yZoneLabelPositividad") .attr("y", d => this.yScale(d.y)) .attr("dy", -30) .attr("transform", d => `rotate(${90},${this._width},${this.yScale(d.y)})`) this.container.selectAll("text.phaseLabel") .attr("y", d => this.yScale(d.bottom)) .attr("x", d => this.xScale(this.scaleRanges[this.xAttribute][0])) this.container.selectAll("line.reference") .attr("y1", d => this.yScale(d)) .attr("y2", d => this.yScale(d)) //this.container.select("text.title.label") //.text(`${this._region} - ${moment(this._date).format("DD MMMM")}`) this.container.select("text.title.label") .text(`Chile por Regiones - ${moment(this._date).format("DD MMMM")}`) /* .transition(t) .textTween(function(d) { const i = d3.interpolateDate(moment(this._current), moment(self._date)) return function(t) { this._current = moment(i(t)).format("YYYY-MM-DD"); return `Chile por Regiones - ${moment(i(t)).format("DD MMMM")}` }; }) */ //.text(`${this._region} - ${moment(this._date).format("DD MMMM")}`) /* this.dateLabel .transition(t) .textTween(function(d) { const i = d3.interpolateDate(moment(this._current), moment(fecha)) return function(t) { this._current = moment(i(t)).format("YYYY-MM-DD"); return moment(i(t)).format("DD MMM") }; //return function(t) { return (this._current = i(t).format("YYYY-MM-DD")); }; }) */ this.container.selectAll("rect.zone") .attr("x",d => this.xScale(d.left)) .attr("y",d => this.yScale(d.top)) .attr("width",d => this.xScale(d.right)-this.xScale(d.left)) //this.yScale(d.rigth-d.left)) .attr("height",d => { const a = this.yScale(d.bottom); const b = this.yScale(d.top); return Math.abs(a-b) })//+this.yScale(d.top)) .attr("fill",d => d.color) const bubbles = this.bubbleContainer.selectAll("g.bubble") .data(data, d => d.name) .join( enter => enter.append("g") .attr("class","bubble") .attr("transform", d => `translate(${this.xScale(d[this.xAttribute])}, ${this.yScale(d[this.yAttribute])})`) .call(enter => enter.transition(t) .attr("transform", d => `translate(${this.xScale(d[this.xAttribute])}, ${this.yScale(d[this.yAttribute])})`)), update => update .call(update => update.transition(t) .attr("transform", d0 => { const d = _.last(d0.recent2) return `translate(${this.xScale(d[this.xAttribute2])}, ${this.yScale(d[this.yAttribute])})` }) ), exit => exit .call(exit => { exit.transition(t) .attr("opacity",0) .remove() exit.select("circle") .transition(t) .attr("r",0) //.attr("transform", d => `translate(0, 0})`) }) ); bubbles .attr("opacity", 0.95) .each(function(d) { if( d.searched) { this.parentNode.appendChild(this); } }) .on("mouseover", function(d) { this.parentNode.appendChild(this); }) console.log(this.arrowContainer.selectAll("g.bubble0").nodes()) const bubbles0 = this.arrowContainer.selectAll("g.bubble0") .data(data, d => d.name) .join("g") .attr("class", "bubble0") .attr("transform", d => { const d0 = d.recent[0]; return `translate(${this.xScale(d0["incidencia"])}, ${this.yScale(d0[this.yAttribute])})` }) .attr("display", d => { debugger; const d0 = d.recent[0]; return d0.date == self._date ? "none" : null }) bubbles.selectAll("circle.prev") .data(d => [d]) .join("circle") .attr("class","prev") .attr("cx",d => this.xScale(d[this.xAttributePrev])-this.xScale(d[this.xAttribute])) .attr("cy",d => this.yScale(d[this.yAttributePrev])-this.yScale(d[this.yAttribute])) .attr("r",d => { return this.size(d.poblacion) }) .attr("opacity", 0) .attr("stroke-width", d=> d.beyondLimit ? 3 : 0.5) .attr("stroke-dasharray", 4) .attr("stroke", d=> d.beyondLimit ? "black" : "black") .attr("fill","none") bubbles.selectAll("circle.target") .data(d => [d]) .join("circle") .attr("class","target") .attr("r",d => { return this.size(d.poblacion) }) .attr("stroke-width", d=> d.beyondLimit ? 3 : 0.5) .attr("stroke", d=> d.beyondLimit ? "black" : "black") .attr("fill",d => "#EEE")// d => this.color(clasificacion(d.incidencia100K, d.crecimiento))) //.attr("fill",d => missingData(d) ? "grey" : d.searched ? "yellow" : "#2b83ba")// d => this.color(clasificacion(d.incidencia100K, d.crecimiento))) const trayectoria = d3.line() .curve(d3.curveBasis) .x(d => d.x) .y(d => d.y) console.log(bubbles0.selectAll("path.vector2").nodes()) bubbles0.selectAll("path.vector2") .data(d => [d]) .join( enter => enter.append("path") .attr("class","vector2") .attr("stroke-width", 2) .attr("stroke", this.colorTrayectoria) .attr("marker-end", "url(#arrow)") .call(enter => enter .attr("d",d => { const items = d.recent2 debugger; return trayectoria(items.map(e => { const d0 = d.recent2[0] return ({ x: this.xScale(e.incidencia)-this.xScale(d0["incidencia"]), y: this.yScale(e.positividad)-this.yScale(d0[this.yAttribute]) }) })) }) ) , update => update .call(update => update.transition(t2) .attr("d",d => { debugger; return trayectoria(d.recent2.map(e => { const d0 = d.recent2[0] return ({ x: this.xScale(e.incidencia)-this.xScale(d0["incidencia"]), y: this.yScale(e.positividad)-this.yScale(d0[this.yAttribute]) }) })) }) ), exit => exit .call(exit => { exit .attr("opacity",0) .remove() }) ) /* bubbles0.selectAll("path.vector2") .data(d => [d]) .join("path") .call(enter => enter .attr("class","vector2") .attr("d",d => { const items = _.take(d.recent2, d.recent2.length-1) debugger; return "" return trayectoria(items.map(e => { const d0 = d.recent2[0] return ({ x: this.xScale(e.incidencia)-this.xScale(d0["incidencia"]), y: this.yScale(e.positividad)-this.yScale(d0[this.yAttribute]) }) })) }) .attr("stroke-width", 2) //.attr("stroke-dasharray", 1.5) .attr("stroke", this.colorTrayectoria) .attr("marker-end", "url(#arrow)") , update => update .call(update => update.transition(t2) .attr("d",d => { debugger; return trayectoria(d.recent2.map(e => { const d0 = d.recent2[0] return ({ x: this.xScale(e.incidencia)-this.xScale(d0["incidencia"]), y: this.yScale(e.positividad)-this.yScale(d0[this.yAttribute]) }) })) }) ), exit => exit .call(exit => { exit .attr("opacity",0) .remove() }) ) */ bubbles.selectAll("rect") .data(d => [d]) .join("rect") bubbles.selectAll("text") .data(d => [d]) .join("text") .attr("dy",d => { return this.size(d.poblacion)+12 }) .attr("font-size",12) .attr("fill", "black") .text(d => d.name) .call(getTextBox); bubbles.selectAll("rect") .attr("x", function(d){return d.bbox.x}) .attr("y", function(d){return d.bbox.y}) .attr("width", function(d){return d.bbox.width}) .attr("height", function(d){return d.bbox.height}) .style("opacity", 0.8) //.style("fill", "#FFE6F0"); .style("fill", "white"); function getTextBox(selection) { selection.each(function(d) { d.bbox = this.getBBox(); }) } } height(_) { this._totalHeight = _; this.startup(); return this; } width(_) { this._totalWidth = _; this.startup(); return this; } title(_) { this._title = _; return this; } region(_) { this._region = _; return this; } date(_) { this._date = _; return this; } }3d:T585d,class IncidenceGrowthQuadrantsVis { constructor(el, metric) { this._data = []; this._margin = {left: 60, right:100, top:80, bottom: 80}; this._totalWidth = width; this._totalHeight = width *0.60; this._attributeX = "incidencia100K"; this.yLabels = { "positividad": "Positividad últimos 7 días | Escala logarítmica", "crecimiento": "Variación del aumento en 7 días", "growth": "CRECIMIENTO (Variación de positividad en 7 días)", } this.xLabels = { "incidencia100K" : "INCIDENCIA (Nuevos casos diarios x 100 mil habitantes, promedio última semana)", "muertes_x_1MM" : "MUERTES DIARIAS x 1 Millón de habitantes (promedio última semana)", } this.scaleRanges = { "positividad": yRange, "crecimiento":[-1,1], "incidencia100K":xRange, "muertes_x_1MM":[0.4, 15], "growth":[-1,1] } this.criticalPoint = { "incidencia100K":10, "muertes_x_1MM":2 } this.zones = { "crecimiento" : [ { left: 0, right: 5, bottom: -1, top:0, color:"#abdda4" // verde }, { left: 5, right: 10, bottom: -1, top:1, color:"#fdae61" // naranjo }, { left: 0, right: 5, bottom: 0, top:1, color:"#ffffbf" // amarillo }, { left: 10, right: this.scaleRanges.incidencia100K[1], bottom: -1, top:1, color:"#d7191c" // rojo } ], "positividad" : [ ] } this.phaseLabels = [ ] this.quadrantLabels = { incidencia100K: [ ["INCIDENCIA MENOS ALTA", "AUMENTANDO CONTAGIOS"], ["INCIDENCIA MUY ALTA", "AUMENTANDO CONTAGIOS"], ["INCIDENCIA MENOS ALTA", "REDUCIENDO CONTAGIOS"], ["INCIDENCIA MUY ALTA", "REDUCIENDO CONTAGIOS"], ], muertes_x_1MM: [ ["MORTALIDAD MENOS ALTA", "AUMENTANDO CONTAGIOS"], ["MORTALIDAD MUY ALTA", "AUMENTANDO CONTAGIOS"], ["MORTALIDAD MENOS ALTA", "REDUCIENDO CONTAGIOS"], ["MORTALIDAD MUY ALTA", "REDUCIENDO CONTAGIOS"], ], } this.xAxisLabel = { "incidencia100K" : "NUEVOS CASOS CONFIRMADOS (Promedio diariox x 100 mil habitantes en última semana)", "muertes_x_1MM" : "MUERTES DIARIAS x 1 Millón de habitantes (promedio última semana)", } this.referenceLinesData = { "positividad" : [0], "crecimiento" : [0], "incidencia100K" : [this.criticalPoint["incidencia100K"]], "incidencia" : [this.criticalPoint[this._attributeX]], "muertes_x_1MM" : [this.criticalPoint["muertes_x_1MM"]], } this.yZoneLabels = { "positividad" : [ ], "crecimiento" : [ {y: -0.5, label: "DISMINUYENDO"}, {y: 0.5, label: "AUMENTANDO"}, ], } this.yZoneLabelsPositividad = [ {y: 0.1, label: "POSITIVIDAD"} ] this.svgContainer = d3.select(el); this.colorTrayectoria= "blue"; this.startup(); } startup() { const self = this; this._width = this._totalWidth - this._margin.left - this._margin.right; this._height = this._totalHeight - this._margin.top - this._margin.bottom; this.xScale = logScale ? d3.scaleLog() : d3.scaleLinear() this.xScale .range([0,this._width]) //this.yScale = d3.scaleLog() this.yScale = d3.scaleLinear() .range([this._height,0]) this.size = d3.scaleLinear() .range([10,10]) this.color = d3.scaleOrdinal() .range(_.map(colorCodes, (color,key)=> color)) .domain(_.map(colorCodes, (color,key)=> key)) function customFormat(d) { return (d >= 0.01) ? d3.format(".0%")(d) : d3.format(".0%")(d) } this.yAxis = d3.axisLeft(this.yScale) //.ticks(10) .tickFormat(customFormat); this.xAxis = d3.axisBottom(this.xScale) .tickFormat(d3.format(".1f")); //.ticks(20); this.svgContainer .attr("width",this._width+this._margin.left+this._margin.right) .attr("height",this._height+this._margin.top+this._margin.bottom) this.svgContainer.selectAll("g").remove(); this.svgContainer.selectAll("defs").remove(); this.svgContainer.append("svg:defs").selectAll("marker") .data(["arrow"]) // Different link/path types can be defined here .enter().append("svg:marker") // This section adds in the arrows .attr("id", String) .attr("viewBox", "0 0 12 12") .attr("refX", 6) .attr("refY", 6) .attr("markerUnits", "strokeWidth") .attr("markerWidth", 12) .attr("markerHeight", 12) .attr("orient", "auto") .append("svg:path") .attr("d", "M2,2 L10,6 L2,10 L6,6 L2,2") .style("fill", this.colorTrayectoria) this.container = this.svgContainer.selectAll("g.container") .data([1]) .join("g") .attr("class", "container inlineVis") .attr("transform", `translate(${this._margin.left},${this._margin.top})`) this.container.selectAll("rect.zone") .data(this.zones[indicadorY]) .join("rect") .attr("class", "zone") this.container.selectAll("g.quadLabels") .data([null]) .join("g") .attr("class", "quadLabels") this.container.select("g.quadLabels").selectAll("g.quadLabel") .data(this.quadrantLabels[this._attributeX]) .join("g") .attr("class", "quadLabel") /* .attr("transform", (d,i) => ` translate(${quadLabelPos(i)[0]}, ${quadLabelPos(i)[1]}) `) */ this.container.select("g.quadLabels").selectAll("g.quadLabel").selectAll("text.line1") .data(d => [d]) .join("text") .attr("text-anchor", "middle") .attr("class", "line1") .text(d => d[0]) this.container.select("g.quadLabels").selectAll("g.quadLabel").selectAll("text.line2") .data(d => [d]) .join("text") .attr("class", "line2") .attr("text-anchor", "middle") .attr("dy", "1em") .text(d => d[1]) this.bubbleContainer = this.container.selectAll("g.bubbleContainer") .data([1]) .join("g") .attr("class", "bubbleContainer") this.arrowContainer = this.container.selectAll("g.arrowContainer") .data([1]) .join("g") .attr("class", "arrowContainer") this.xAxisEl = this.container.append("g") .attr("transform", `translate(0,${this._height})`) .attr("class", "x axis") this.yAxisEl = this.container.append("g") .attr("class", "y axis") this.dateLabel = this.container.append("text") .attr("class", "title label") .attr("x", this._width/2) .attr("y", 0) .attr("dy", -40) .attr("text-anchor", "middle") .attr("fill", "grey") .attr("font-size", 24) .text("TITLE") .property("_current", function(d) {return this._current || fechaInicial}) this.container.append("text") .attr("class", "title x") .attr("x", this._width) .attr("y", this._height) .attr("dy", 50) .attr("text-anchor", "end") .text(`${this.xLabels[this._attributeX]} ${logScale ? `| Escala Logarítmica` : ``}`) this.container.append("text") .attr("class", "author") .attr("x", this._width) .attr("y", this._height) .attr("dy", 70) .attr("text-anchor", "end") .attr("font-weight", "bold") .text("@elaval") this.container.append("text") .attr("font-family", "sans-serif") .attr("font-size", 14) .attr("class", "title y") .attr("transform",`rotate(-90)`) .attr("y", 0 - this._margin.left) .attr("x",0 - (this._height / 2)) .attr("dy", "1em") .style("text-anchor", "middle") .text(this.yLabels["growth"]); this.container.selectAll("text.yZoneLabel") .data(this.yZoneLabels[indicadorY]) .join("text") .attr("class","yZoneLabel") .attr("font-family", "sans-serif") .attr("font-size", 14) .attr("fill", "grey") .attr("transform",`rotate(90)`) .attr("x", this._width) .attr("dy", "1em") .style("text-anchor", "middle") .text(d => d.label); this.container.selectAll("text.phaseLabel") .data(this.phaseLabels) .join("text") .attr("class","phaseLabel") .attr("font-family", "sans-serif") .attr("font-size", 10) .attr("font-style", "italic") .attr("fill", d => d.color) .attr("dy", d => d.dy || "-5") .attr("dx", "5") .style("text-anchor", "left") .text(d => d.name); this.container.selectAll("line.reference") .data(this.referenceLinesData[indicadorY]) .join("line") .attr("class", "reference") .attr("stroke-width", 1) .attr("stroke", "black") .attr("stroke-dasharray", "5 5 5 5") .attr("x1", 0) .attr("x2", this._width) this.container.selectAll("line.referenceX") .data(this.referenceLinesData[this._attributeX]) .join("line") .attr("class", "referenceX") .attr("stroke-width", 1) .attr("stroke", "black") .attr("stroke-dasharray", "5 5 5 5") .attr("y1", 0) .attr("y2", this._height) } render(_data, fecha) { debugger; this.xAttribute2 = "incidencia"; this.xAttribute = this._attributeX; this.yAttribute = "positividad"; this.yAttribute = "growth"; this.xAttributePrev = "incidencia100K_semana_previa"; this.yAttributePrev = "positividad_semana_previa"; this.sizeAttribute = "poblacion"; this.maxIncidencia = 200; this.maxPositividad = this.scaleRanges["positividad"][1]; this.maxCrecimiento = 1; this.minCrecimiento = -1; const minX = _.min(_.map(_data, d => d[this.xAttribute])); this.scaleRanges["muertes_x_1MM"][0] = minX < this.scaleRanges["muertes_x_1MM"][0] ? minX : this.scaleRanges["muertes_x_1MM"][0]; this.scaleRanges["muertes_x_1MM"][0] == this.scaleRanges["muertes_x_1MM"][0] > 0 ? this.scaleRanges["muertes_x_1MM"][0] : 0.1 const data = _.chain(_data).map(d => ({ name: d.name, growth: d.growth, crecimiento_original: d.crecimiento, crecimiento: d.crecimiento < this.maxCrecimiento ? d.crecimiento : this.maxCrecimiento, positividad_original: d.positividad, positividad: d.positividad == null ? 0 : d.positividad <= this.maxPositividad ? d.positividad : this.maxPositividad, positividad_semana_previa_original: d.positividad_semana_previa, positividad_semana_previa: d.positividad_semana_previa == null ? 0 : d.positividad_semana_previa <= this.maxPositividad ? d.positividad_semana_previa : this.maxPositividad, incidencia100K : d.incidencia <= this.maxIncidencia ? d.incidencia : this.maxIncidencia, incidencia100K_original: d.incidencia, muertes_x_1MM: d.muertes_x_1MM, incidencia100K_semana_previa : d.incidencia_semana_previa <= this.maxIncidencia ? d.incidencia_semana_previa : this.maxIncidencia, incidencia100K_previa_original: d.incidencia_semana_previa, recent: d.recent, poblacion: d.poblacion, searched: d.searched })) .filter(d => { return d.incidencia100K_original <= this.scaleRanges["incidencia100K"][1] && d.incidencia100K_original >= this.scaleRanges["incidencia100K"][0] && d.positividad_original >= this.scaleRanges["positividad"][0] && d.positividad_original <= this.scaleRanges["positividad"][1] }) .filter(d => !textoABuscar || d.searched) .sortBy(d => d.name == "Metropolitana" ? -1 : 1) .value() data.forEach(d => { d.beyondLimit = d.incidencia100K_original > this.maxIncidencia; if (indicadorY == "crecimiento") { d.beyondLimit = d.beyondLimit || d.crecimiento_original > this.maxCrecimiento || d.crecimiento_original < this.minCrecimiento; } else if (indicadorY == "positividad") { d.beyondLimit = d.beyondLimit || d.positividad_original > this.maxPositividad; } }) data.forEach(d=> { const recentSlice = d.recent.filter(e => e.date <= this._date); const newRecent = []; _.range(0, d.recent.length -recentSlice.length).forEach(e => { newRecent.push(d.recent[0]); }) recentSlice.forEach(e => { newRecent.push(e); }) d.recent2 = newRecent; }) function missingData(d) { if (indicadorY == "positividad") { return (d.positividad_original == null) || (d.incidencia100K_original == null) } else if (indicadorY == "crecimiento") { return (d.crecimiento_original == null) || (d.incidencia100K_original == null) } else { return true } } // transition const t = this.container.transition() .duration(1000); const t2 = this.arrowContainer.transition() .duration(1000); const self = this; const escala = this.xScale this.xScale.domain(this.scaleRanges[this.xAttribute]) //this.xScale.domain([1, this.scaleRanges[this.xAttribute][1]]) //this.yScale.domain(this.scaleRanges[this.yAttribute]) const maxAbsY = d3.max(data, d => Math.abs(d[this.yAttribute])) this.yScale.domain([-maxAbsY, maxAbsY]) console.log("Y DOMAIN"); console.log(this.yScale.domain()); console.log(data[0][this.yAttribute]); console.log(this.yScale(data[0][this.yAttribute])); debugger; this.size.domain(d3.extent(allNodes, d => d[this.sizeAttribute])) console.log(escala(1)); console.log(escala.domain()); console.log(escala.range()); this.xAxisEl.call(this.xAxis); this.yAxisEl.call(this.yAxis); this.container.select("text.baja.incidencia") .attr("x", this.xScale((this.scaleRanges[this.xAttribute][0]+5)/2)) this.container.select("text.media.incidencia") .attr("x", this.xScale(7.5)) this.container.select("text.alta.incidencia") .attr("x", this.xScale((10+ this.scaleRanges[this.xAttribute][1])/2)) this.container.select("text.aumentando") .attr("y", this.yScale(0.5)) .attr("transform", `rotate(${-90},${this._width},${this.yScale(0.5)})`) this.container.select("text.disminuyendo") .attr("y", this.yScale(-0.5)) .attr("transform", `rotate(${-90},${this._width},${this.yScale(-0.5)})`) this.container.selectAll("text.yZoneLabel") .attr("dy", -5) .attr("y", d => this.yScale(d.y)) .attr("transform", d => `rotate(${90},${this._width},${this.yScale(d.y)})`) this.container.selectAll("text.yZoneLabelPositividad") .attr("y", d => this.yScale(d.y)) .attr("dy", -30) .attr("transform", d => `rotate(${90},${this._width},${this.yScale(d.y)})`) this.container.selectAll("text.phaseLabel") .attr("y", d => this.yScale(d.bottom)) .attr("x", d => this.xScale(this.scaleRanges[this.xAttribute][0])) this.container.selectAll("line.reference") .attr("y1", d => this.yScale(d)) .attr("y2", d => this.yScale(d)) this.container.selectAll("line.referenceX") .attr("x1", d => this.xScale(d)) .attr("x2", d => this.xScale(d)) //this.container.select("text.title.label") //.text(`${this._region} - ${moment(this._date).format("DD MMMM")}`) this.container.select("text.title.label") .text(`Chile por Regiones - ${moment(this._date).format("DD MMMM")}`) /* .transition(t) .textTween(function(d) { const i = d3.interpolateDate(moment(this._current), moment(self._date)) return function(t) { this._current = moment(i(t)).format("YYYY-MM-DD"); return `Chile por Regiones - ${moment(i(t)).format("DD MMMM")}` }; }) */ //.text(`${this._region} - ${moment(this._date).format("DD MMMM")}`) /* this.dateLabel .transition(t) .textTween(function(d) { const i = d3.interpolateDate(moment(this._current), moment(fecha)) return function(t) { this._current = moment(i(t)).format("YYYY-MM-DD"); return moment(i(t)).format("DD MMM") }; //return function(t) { return (this._current = i(t).format("YYYY-MM-DD")); }; }) */ /* this.container.selectAll("rect.zone") .attr("x",d => this.xScale(d.left)) .attr("y",d => this.yScale(d.top)) .attr("width",d => this.xScale(d.right)-this.xScale(d.left)) //this.yScale(d.rigth-d.left)) .attr("height",d => { const a = this.yScale(d.bottom); const b = this.yScale(d.top); return Math.abs(a-b) })//+this.yScale(d.top)) .attr("fill",d => d.color) */ const bubbles = this.bubbleContainer.selectAll("g.bubble") .data(data, d => d.name) .join( enter => enter.append("g") .attr("class","bubble") .attr("transform", d => `translate(${this.xScale(d[this.xAttribute])}, ${this.yScale(d[this.yAttribute])})`) .call(enter => enter.transition(t) .attr("transform", d => `translate(${this.xScale(d[this.xAttribute])}, ${this.yScale(d[this.yAttribute])})`)), update => update .call(update => update.transition(t) .attr("transform", d0 => { const d = _.last(d0.recent2) return `translate(${this.xScale(d[this.xAttribute2])}, ${this.yScale(d[this.yAttribute])})` }) ), exit => exit .call(exit => { exit.transition(t) .attr("opacity",0) .remove() exit.select("circle") .transition(t) .attr("r",0) //.attr("transform", d => `translate(0, 0})`) }) ); bubbles .attr("opacity", 0.95) .each(function(d) { if( d.searched) { this.parentNode.appendChild(this); } }) .on("mouseover", function(d) { this.parentNode.appendChild(this); }) bubbles.selectAll("circle.target") .data(d => [d]) .join("circle") .attr("class","target") .classed("safe",d => d[this.xAttribute] < self.criticalPoint[self.xAttribute] && d.growth <0) .attr("r",d => { return this.size(d.poblacion) }) .attr("stroke-width", d=> d.beyondLimit ? 3 : 0.5) .attr("stroke", d=> d.beyondLimit ? "black" : "black") .attr("fill",d => "#EEE")// d => this.color(clasificacion(d.incidencia100K, d.crecimiento))) //.attr("fill",d => missingData(d) ? "grey" : d.searched ? "yellow" : "#2b83ba")// d => this.color(clasificacion(d.incidencia100K, d.crecimiento))) /* const trayectoria = d3.line() .curve(d3.curveBasis) .x(d => d.x) .y(d => d.y) /* bubbles0.selectAll("path.vector2") .data(d => [d]) .join("path") .call(enter => enter .attr("class","vector2") .attr("d",d => { const items = _.take(d.recent2, d.recent2.length-1) debugger; return "" return trayectoria(items.map(e => { const d0 = d.recent2[0] return ({ x: this.xScale(e.incidencia)-this.xScale(d0["incidencia"]), y: this.yScale(e.positividad)-this.yScale(d0[this.yAttribute]) }) })) }) .attr("stroke-width", 2) //.attr("stroke-dasharray", 1.5) .attr("stroke", this.colorTrayectoria) .attr("marker-end", "url(#arrow)") , update => update .call(update => update.transition(t2) .attr("d",d => { debugger; return trayectoria(d.recent2.map(e => { const d0 = d.recent2[0] return ({ x: this.xScale(e.incidencia)-this.xScale(d0["incidencia"]), y: this.yScale(e.positividad)-this.yScale(d0[this.yAttribute]) }) })) }) ), exit => exit .call(exit => { exit .attr("opacity",0) .remove() }) ) */ bubbles.selectAll("rect") .data(d => [d]) .join("rect") bubbles.selectAll("text") .data(d => [d]) .join("text") .attr("dy",d => { return this.size(d.poblacion)+12 }) .attr("font-size",12) .attr("fill", "black") .text(d => d.name) .call(getTextBox); bubbles.selectAll("rect") .attr("x", function(d){return d.bbox.x}) .attr("y", function(d){return d.bbox.y}) .attr("width", function(d){return d.bbox.width}) .attr("height", function(d){return d.bbox.height}) .style("opacity", 0.8) //.style("fill", "#FFE6F0"); .style("fill", "white"); function quadLabelPos(i) { if (i==0) { return [ (self.xScale([self.criticalPoint[self.xAttribute]])+ self.xScale(self.scaleRanges[self.xAttribute][0]))/2, (self.yScale(0)+ self.yScale(maxAbsY))/2 ] } else if (i==1) { return [ (self.xScale([self.criticalPoint[self.xAttribute]])+ self.xScale(self.scaleRanges[self.xAttribute][1]))/2, (self.yScale(0)+ self.yScale(maxAbsY))/2 ] } else if (i==2) { return [ (self.xScale([self.criticalPoint[self.xAttribute]])+ self.xScale(self.scaleRanges[self.xAttribute][0]))/2, (self.yScale(0)+ self.yScale(-maxAbsY))/2 ] } else if (i==3) { return [ (self.xScale([self.criticalPoint[self.xAttribute]])+ self.xScale(self.scaleRanges[self.xAttribute][1]))/2, (self.yScale(0)+ self.yScale(-maxAbsY))/2 ] } } this.container.select("g.quadLabels").selectAll("g.quadLabel") .data(this.quadrantLabels[this._attributeX]) .join("g") .attr("class", "quadLabel") .attr("transform", (d,i) => ` translate(${quadLabelPos(i)[0]}, ${quadLabelPos(i)[1]}) `) function getTextBox(selection) { selection.each(function(d) { d.bbox = this.getBBox(); }) } } height(_) { this._totalHeight = _; this.startup(); return this; } width(_) { this._totalWidth = _; this.startup(); return this; } title(_) { this._title = _; return this; } region(_) { this._region = _; return this; } date(_) { this._date = _; return this; } attributeX(_) { this._attributeX = _; this.startup(); return this; } }3e:T8be,function analisisIncidencia(region, fecha) { const registroActual = dictRegionFecha[regionSeleccionada][fecha]; const fechasSemanaPrevia = moment(fecha).subtract(1,"week").format("YYYY-MM-DD"); const registrosSemanaPrevia = dictRegionFecha[region][fechasSemanaPrevia]; const tipoIncidencia = registroActual["variacion_semanal_positividad"] < 0 ? registroActual["casos_diarios_X100K"] >= 10 ? `Positividad- Incidencia Alta` : registroActual["casos_diarios_X100K"] < 2 ? `Positividad- Incidencia Baja` : `Positividad- Incidencia Media` : registroActual["casos_diarios_X100K"] >= 10 ? `Positividad+ Incidencia Alta` : registroActual["casos_diarios_X100K"] < 2 ? `Positividad+ Incidencia Baja` : `Positividad+ Incidencia Media` ; const mensajes = { "Positividad- Incidencia Alta" : `Esta es una incidencia muy alta (plan Paso a Paso indica que es necesario estar bajo un umbral de 10 casos x 100 mil habitantes para salir de cuarentena).` , "Positividad- Incidencia Media" : `La incidencia aún no alcanza niveles críticos (plan Paso a Paso indica que bajo un umbral de 10 casos x 100 mil habitantes se puede salir de cuarentena).` , "Positividad- Incidencia Baja" : `La incidencia tiene niveles bajos ${registroActual["casos_diarios_X100K"]} (plan Paso a Paso indica que bajo un umbral de 2 casos x 100 mil habitantes se puede pasar a Apertura Avanzada).` , "Positividad+ Incidencia Alta" : `Esta es una incidencia muy alta (plan Paso a Paso indica que es necesario estar bajo un umbral de 10 casos x 100 mil habitantes para salir de cuarentena).` , "Positividad+ Incidencia Media" : `La incidencia aún no alcanza niveles críticos (plan Paso a Paso indica que bajo un umbral de 10 casos x 100 mil habitantes se puede salir de cuarentena).` , "Positividad+ Incidencia Baja" : `La incidencia tiene niveles bajos (plan Paso a Paso indica que bajo un umbral de 2 casos x 100 mil habitantes se puede pasar a Apertura Avanzada).` , } return mensajes[tipoIncidencia] } 3f:T4c1,function analisisFallecidos(region, fecha) { const semanasRecientes1a4 = _.range(0,4).map(d => moment(fecha).subtract(d,"week").format("YYYY-MM-DD")) const semanasRecientes5a8 = _.range(4,8).map(d => moment(fecha).subtract(d,"week").format("YYYY-MM-DD")) const fallecidosSemanas1a4 = _.reduce(semanasRecientes1a4, (memo,d) => memo + dictRegionFecha[region][d].nuevos_fallecidos_semanales,0) const fallecidosSemanas5a8 = _.reduce(semanasRecientes5a8, (memo,d) => memo + dictRegionFecha[region][d].nuevos_fallecidos_semanales,0) return html`En las últimas 4 semanas (${moment(fecha).subtract(4,"week").add(1,"day").format("D/MMM")} al ${moment(fecha).format("D/MMM")}) se reportaron ${fallecidosSemanas1a4} fallecidos con PCR+, mientras que en las 4 semanas previas a esas (${moment(fecha).subtract(8,"week").add(1,"day").format("D/MMM")} al ${moment(fecha).subtract(4,"week").format("D/MMM")}) se reportaron ${fallecidosSemanas5a8} fallecidos con PCR+. ${fallecidosSemanas1a4/fallecidosSemanas5a8 >1 ? `Se observa tendencia a un aumento de fallecidos al comparar ambos períodos` :`No se observa un aumento de fallecidos al comparar ambos períodos` } ` }40:T597,function resumenReducciones() { const registroActual = dictRegionFecha[regionSeleccionada][fechaActual]; const registroActualRegiones = {} regiones.forEach(d => { registroActualRegiones[d]= dictRegionFecha[d][fechaActual] }) const regionesXDireccionCambio = _.chain(registroActualRegiones) .map((item,key) => item) .groupBy(d => d.variacion_semanal_positividad < 0 ? "reduce" : "no reduce") .value() const numReducen = regionesXDireccionCambio["reduce"].length; const numNoReducen = regionesXDireccionCambio["no reduce"].length; return html`La variación en la positividad (porcentaje de tests PCR que dan un resultado positivo) es un indicador del aumento o reducción de contagios. Al ${moment(fechaActual).format("D MMMM")} en Chile hay ${numReducen} ${numReducen == 1 ? "región que reduce" : "regiones que reducen"} la positividad y ${numNoReducen} que ${numNoReducen == 1 ? "no reduce" : "no reducen"} la positividad.

Reducen:
${regionesXDireccionCambio["reduce"].map(d => `${d.localidad} (${format.variacion(d.variacion_semanal_positividad)})`).join(" ")}
No reducen:
${regionesXDireccionCambio["no reduce"].map(d => `${d.localidad} (+${format.variacion(d.variacion_semanal_positividad)}) `).join(" ")}` }41:T1dc3,function analisisTendencia(region, fecha) { const registroActual = dictRegionFecha[regionSeleccionada][fecha]; const fechasSemanaPrevia = moment(fecha).subtract(1,"week").format("YYYY-MM-DD"); const registrosSemanaPrevia = dictRegionFecha[region][fechasSemanaPrevia]; const tipoCrecimiento = registroActual["variacion_semanal_positividad"] < 0 ? registroActual["variacion_semanal_casos"] < 0 ? registroActual["variacion_semanal_tests"] < 0 ? `Positividad- Casos- Tests-` : `Positividad- Casos- Tests+` : registroActual["variacion_semanal_tests"] < 0 ? `Positividad- Casos+ Tests-` : `Positividad- Casos+ Tests+` : registroActual["variacion_semanal_casos"] < 0 ? registroActual["variacion_semanal_tests"] < 0 ? `Positividad+ Casos- Tests-` : `Positividad+ Casos- Tests+` : registroActual["variacion_semanal_tests"] < 0 ? `Positividad+ Casos+ Tests-` : `Positividad+ Casos+ Tests+` ; const razonVariacionDatosTests = registroActual["variacion_semanal_casos"] / registroActual["variacion_semanal_tests"]; const mensajes = { "Positividad- Casos- Tests-" : `Los tests disminuyeron de ${format.casos(registrosSemanaPrevia["nuevos_tests_semanales"])} a ${format.casos(registroActual["nuevos_tests_semanales"])}. Eso explica una parte de la disminución de casos semanales de ${format.casos(registrosSemanaPrevia["nuevos_casos_semanales"])} a ${format.casos(registroActual["nuevos_casos_semanales"])}.

Sin embargo, los casos disminuyeron en mayor proporción que los tests. Esto se refleja en una disminución de positividad de ${format.positividad(registrosSemanaPrevia["positividad"])} a ${format.positividad(registroActual["positividad"])} (${format.variacion(registroActual.variacion_semanal_positividad)} de disminución).

De mantenerse una reducción sostenida de positividad, los niveles de contagio irán disminuyendo` , "Positividad- Casos- Tests+" : `Los tests aumentaron de ${format.casos(registrosSemanaPrevia["nuevos_tests_semanales"])} a ${format.casos(registroActual["nuevos_tests_semanales"])}. A pesar de esto, disminuyeron los casos semanales de ${format.casos(registrosSemanaPrevia["nuevos_casos_semanales"])} a ${format.casos(registroActual["nuevos_casos_semanales"])}. Esto se refleja en una disminución de positividad de ${format.positividad(registrosSemanaPrevia["positividad"])} a ${format.positividad(registroActual["positividad"])} (${format.variacion(registroActual.variacion_semanal_positividad)} de disminución).

De mantenerse una reducción sostenida de positividad, los niveles de contagio irán disminuyendo` , "Positividad- Casos+ Tests-" : `Alternativa no válida` , "Positividad- Casos+ Tests+" : `Los tests aumentaron de ${format.casos(registrosSemanaPrevia["nuevos_tests_semanales"])} a ${format.casos(registroActual["nuevos_tests_semanales"])}. Esto explica una parte del aumento de casos semanales de ${format.casos(registrosSemanaPrevia["nuevos_casos_semanales"])} a ${format.casos(registroActual["nuevos_casos_semanales"])}.

Sin embargo, el aumento relativo de los casos (${format.variacion(registroActual.variacion_semanal_casos)}) fue ${Math.abs(registroActual.variacion_semanal_positividad) < 0.01 ? "levemente " : ""}menor que el de los tests (${format.variacion(registroActual.variacion_semanal_tests)}). Esto indica ${Math.abs(registroActual.variacion_semanal_positividad) < 0.01 ? "un nivel de contagios relativamente estable" : "una disminución de contagios"} que se refleja en una ${Math.abs(registroActual.variacion_semanal_positividad) < 0.01 ? "leve disminución de positividad" : "disminución de positividad"} de ${format.positividad(registrosSemanaPrevia["positividad"])} a ${format.positividad(registroActual["positividad"])} (${format.variacion(registroActual.variacion_semanal_positividad)} de disminución).

Es importante mantener una reducción sostenida de positividad, para disminuir los niveles de contagio ` , "Positividad+ Casos- Tests-" : `Los tests disminuyeron de ${format.casos(registrosSemanaPrevia["nuevos_tests_semanales"])} a ${format.casos(registroActual["nuevos_tests_semanales"])}. Esto explica una parte de la disminución de casos semanales de ${format.casos(registrosSemanaPrevia["nuevos_casos_semanales"])} a ${format.casos(registroActual["nuevos_casos_semanales"])}.

Sin embargo, la disminución relativa de los casos (${format.variacion(registroActual.variacion_semanal_casos)}) fue menor que la de los tests (${format.variacion(registroActual.variacion_semanal_tests)}) y se observa un aumento de positividad de ${format.positividad(registrosSemanaPrevia["positividad"])} a ${format.positividad(registroActual["positividad"])} (${format.variacion(registroActual.variacion_semanal_positividad)} de aumento).

Es preocupante que la positividad vaya en aumento. De mantenerse una tendencia al alza, los niveles de contagio seguirán aumentando.` , "Positividad+ Casos- Tests+" : `Alternativa no válida` , "Positividad+ Casos+ Tests-" : `Los tests disminuyeron de ${format.casos(registrosSemanaPrevia["nuevos_tests_semanales"])} a ${format.casos(registroActual["nuevos_tests_semanales"])} y a pesar de eso se observa un aumento de casos semanales de ${format.casos(registrosSemanaPrevia["nuevos_casos_semanales"])} a ${format.casos(registroActual["nuevos_casos_semanales"])}. Esto indica un aumento de contagios y se refleja en un aumento de positividad de ${format.positividad(registrosSemanaPrevia["positividad"])} a ${format.positividad(registroActual["positividad"])} (${format.variacion(registroActual.variacion_semanal_positividad)} de aumento).

Es preocupante que la positividad vaya en aumento. De mantenerse una tendencia al alza, los niveles de contagio seguirán aumentando.` , "Positividad+ Casos+ Tests+" : `Los tests aumentaron de ${format.casos(registrosSemanaPrevia["nuevos_tests_semanales"])} a ${format.casos(registroActual["nuevos_tests_semanales"])} y eso explica una parte del aumento de casos semanales de ${format.casos(registrosSemanaPrevia["nuevos_casos_semanales"])} a ${format.casos(registroActual["nuevos_casos_semanales"])}.

Sin embargo, el aumento relativo de los casos (${format.variacion(registroActual.variacion_semanal_casos)}) fue ${razonVariacionDatosTests > 2 ? "mucho ": ""}mayor que el de tests (${format.variacion(registroActual.variacion_semanal_tests)}). Esto indica un aumento de contagios y se refleja en un aumento de positividad de ${format.positividad(registrosSemanaPrevia["positividad"])} a ${format.positividad(registroActual["positividad"])} (${format.variacion(registroActual.variacion_semanal_positividad)} de aumento).

Es preocupante que la positividad vaya en aumento. De mantenerse una tendencia al alza, los niveles de contagio seguirán aumentando.` , } return `${mensajes[tipoCrecimiento]}` }42:T615,function getNodes(date) { const fechaSemanaPrevia = moment(date).subtract(1,"week").format("YYYY-MM-DD"); const recentDates = _.chain(_.range(0,8)) .map(d => moment(date).subtract(d,"day").format("YYYY-MM-DD")) .filter(d => d >= fechaInicial) .reverse() .value(); const nodes = regiones.map(region => ({ name: region, positividad: dictRegionFecha[region] && dictRegionFecha[region][date].positividad, incidencia: dictRegionFecha[region] && dictRegionFecha[region][date]["incidencia"], positividad_semana_previa: dictRegionFecha[region] && dictRegionFecha[region][fechaSemanaPrevia].positividad, incidencia_semana_previa: dictRegionFecha[region] && dictRegionFecha[region][fechaSemanaPrevia]["casos_diarios_X100K"], growth: dictRegionFecha[region] && dictRegionFecha[region][date] && dictRegionFecha[region] && (dictRegionFecha[region][date].positividad/dictRegionFecha[region][fechaSemanaPrevia].positividad) -1, muertes_x_1MM : dictRegionFecha[region] && dictRegionFecha[region][date]["fallecidos_diarios_X1MM"], muertes_x_semana : dictRegionFecha[region] && dictRegionFecha[region][date]["nuevos_fallecidos_semanales"], poblacion: dictRegionFecha[region] && dictRegionFecha[region][date]["poblacion"], searched: false, recent: recentDates.map(f => ({ date:f, positividad: dictRegionFecha[region] && dictRegionFecha[region][f]["positividad"], incidencia: dictRegionFecha[region] && dictRegionFecha[region][f]["incidencia"], })) })) return nodes }43:[{"id":"8f9c73596d6aa63f6657f6e41fae7c897825ab85fc202e1439df47493dbe8fb68f177625e22aa5f6b6ee1fbb11d5d4763f34febb3ba549bf0ea3823a1dac8fb9","href":"https://static.observableusercontent.com/files/8f9c73596d6aa63f6657f6e41fae7c897825ab85fc202e1439df47493dbe8fb68f177625e22aa5f6b6ee1fbb11d5d4763f34febb3ba549bf0ea3823a1dac8fb9","name":"BAC3.txt","type":"text/plain","lastModified":1610578847485.398,"size":371},{"id":"a1712252204bd03f98ed283a116e6886060ecf7294d32b52a4628ff64d521ea6dc42c6dc3bb2cd9a530d27e44d63d901ec1ef71c51b736477f542a2aa7caf0bf","href":"https://static.observableusercontent.com/files/a1712252204bd03f98ed283a116e6886060ecf7294d32b52a4628ff64d521ea6dc42c6dc3bb2cd9a530d27e44d63d901ec1ef71c51b736477f542a2aa7caf0bf","name":"data_incidencia_comunas (25).tsv","type":"text/tab-separated-values","lastModified":1610881452730.536,"size":1632314},{"id":"f2221b55fc23ef3672d1972a7cc8c35f1cd8b5ffb7ed739df2b0aab34b08715e049cd36a4c1a5efe0fb0fa81fcdb0c1f10d254d260a03f6cdd13a4e9ebf02546","href":"https://static.observableusercontent.com/files/f2221b55fc23ef3672d1972a7cc8c35f1cd8b5ffb7ed739df2b0aab34b08715e049cd36a4c1a5efe0fb0fa81fcdb0c1f10d254d260a03f6cdd13a4e9ebf02546","name":"data_incidencia_comunas (33).tsv","type":"text/tab-separated-values","lastModified":1614545127056.78,"size":1872334}] 2e:{"id":"8df5a4ddcccfa397","slug":"covid19-panel-de-indicadores-clave-para-chile","title":"COVID19 - Panel de indicadores clave para Chile","thumbnail":"603adce7cbe7aeda428e61d27b95b0da2e98c9ecd4d5b9daf437a9944ec86caa","access_level":"public","create_time":"$D2020-12-26T13:39:27.699Z","update_time":"$D2021-11-08T19:52:56.369Z","view_time":null,"first_public_time":"$D2020-12-28T02:19:45.092Z","fork":{"id":"ee8b09abfd959d26","slug":"covid19-resumen-de-situacion-por-regiones-en-chile","title":"COVID19 - Resumen de situación por regiones en Chile","owner":{"id":"0843f5dc42ca68a0","login":"elaval","name":"Ernesto Laval"}},"stars":0,"starred":false,"owner":{"type":"team","id":"0843f5dc42ca68a0","login":"elaval","name":"Ernesto Laval","avatar_url":"https://avatars-next.observableusercontent.com/089f0414fc9025dadb05cc06d7a406bc9be10093187c46729cb4ba3a4098dc30","tier":"starter_2024"},"version":10353,"publish_version":10353,"role":null,"authored":false,"authors":[{"type":"individual","id":"e04cd7b5f4351ae9","login":"elaval","name":"Ernesto Laval","avatar_url":"https://avatars-next.observableusercontent.com/089f0414fc9025dadb05cc06d7a406bc9be10093187c46729cb4ba3a4098dc30","tier":null}],"members":[{"type":"individual","id":"e04cd7b5f4351ae9","login":"elaval","name":"Ernesto Laval","avatar_url":"https://avatars-next.observableusercontent.com/089f0414fc9025dadb05cc06d7a406bc9be10093187c46729cb4ba3a4098dc30","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"COVID19 - Panel de indicadores clave para Chile","cells":[{"id":0,"value":"md`# COVID19 - Panel de indicadores clave para Chile`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9996,"value":"{\n //mutable fechaActual = \"2020-05-25\"\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8381,"value":"viewof regionSeleccionada = select({\n title: \"Seleccione una región\",\n description: \"Por defecto se ofrecen datos para todo Chile\",\n options: _.concat(regiones, \"Chile\"),\n value: \"Chile\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9544,"value":"el = panelResumen(regionSeleccionada)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":589,"value":"$30","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":593,"value":"html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":10141,"value":"{\n return html`\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n ${\n dataBAC.map(d => `\n \n \n \n \n \n \n \n \n \n \n \n \n \n `)\n } \n

Región	% BAC	Casos	Tests	Positividad	Casos c/síntomas	Tests c/síntomas	Positividad c/síntomas	Casos BAC	Tests BAC	Positividad BAC
${d.localidad}	${d3.format(\".1%\")(d.BAC)}	${d3.format(\",\")(d.casos)}	${d3.format(\",\")(d.tests)}	${d3.format(\".1%\")(d.positividad)}	${d3.format(\",\")(d.casos_no_bac)}	${d3.format(\",\")(d.tests_no_bac)}	${d3.format(\".1%\")(d.positividad_no_bac)}	${d3.format(\",\")(d.casos_bac)}	${d3.format(\",\")(d.tests_bac)}	${d3.format(\".1%\")(d.positividad_bac)}

\n `\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":10224,"value":"dataChile","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":10109,"value":"dataBAC = {\n const dictBAC = {}\n const data = _.chain(dataChile)\n .filter(d => d.fecha == fechaActual)\n .filter(d => d.localidad !== \"Chile\")\n .value();\n \n bac8Enero.forEach(d => dictBAC[d.localidad] = d)\n \n \n let newData = data.map(d => ({\n localidad: d.localidad,\n fecha: d.fecha,\n BAC: +dictBAC[d.localidad].BAC/100,\n casos : d.nuevos_casos_semanales,\n tests : d.nuevos_tests_semanales,\n casos_no_bac: d.nuevos_casos_semanales - d.nuevos_casos_semanales_sin_sintomas,\n casos_bac: d.nuevos_casos_semanales_sin_sintomas,\n tests_no_bac: Math.round(d.nuevos_tests_semanales * (1 - +dictBAC[d.localidad].BAC/100)),\n tests_bac: Math.round(d.nuevos_tests_semanales * (+dictBAC[d.localidad].BAC/100)),\n positividad : d.nuevos_casos_semanales / d.nuevos_tests_semanales,\n \n }))\n \n newData\n .forEach(d => {\n d.positividad = d.casos / d.tests\n d.positividad_no_bac = d.casos_no_bac / d.tests_no_bac\n d.positividad_bac = d.casos_bac / d.tests_bac\n })\n \n return newData\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":10112,"value":"bac8Enero = FileAttachment(\"BAC3.txt\").csv()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9721,"value":"{\n \n const lastDate = _.chain(dataComunas).map(d => d.date).sortBy().last().value()\n const data = _.chain(dataComunas).filter(d => d.region == regionSeleccionada && d.date == lastDate && d.incidence >= 10).sortBy(d => -d.incidence).value();\n \n const out = html `\n\n \n \n \n \n \n \n \n ${data.map(d => `\n \n \n \n \n \n \n `)}\n

Comuna	Población	Incidencia	Paso
${d.location}	${d3.format(\".1s\")(d.poblacion)} habs.	${d3.format(\".1f\")(d.incidence)}	Paso ${dictPasoComunas[d.location] \|\| dictPasoComunas[aliasComuna[d.location]]}

\n `\n\n return out\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9791,"value":"height = 500","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9793,"value":"fontFamily = \"sans-serif\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9795,"value":"padding = 0","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9797,"value":"rotate = () => (~~(Math.random() * 6) - 3) * 30\n//rotate = () => 0 // () => (~~(Math.random() * 6) - 3) * 30","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9799,"value":"maxFontSize = 20","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9890,"value":"minFontSize = 9","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9934,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":10181,"value":"_.chain(dataComunas).map(d => d.location).uniq().filter(d => !dictPasoComunas[d]).value() //dictPasoComunas","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9965,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9883,"value":"html`\n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9909,"value":"mutable cumunas = [];","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9788,"value":"$33","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9706,"value":"dataComunas = FileAttachment(\"data_incidencia_comunas (33).tsv\").tsv()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9712,"value":"dataPaso = d3.csv(\"https://raw.githubusercontent.com/MinCiencia/Datos-COVID19/master/output/producto74/paso_a_paso_std.csv\")\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9740,"value":"aliasComuna = ({\n \"OHiggins\":\"O'Higgins\",\n\n /*\"Ollague\":\"Ollagüe\",\n \"San Joaquin\":\"San Joaquín\",\n \"Licanten\": \"Licantén\",\n \"Curico\":\"Curicó\",\n \"Rio Claro\":\"Río Claro\",\n \"Vichuquen\":\"Vichuquén\",\n \"Hualane\":\"Hualañé\",\n \"Puren\":\"Purén\",\n \"Vilcun\":\"Vilcún\",\n \"Pucon\":\"Pucón\",\n \"Traiguen\":\"Traiguén\",\n \"Pitrufquen\":\"Pitrufquén\",\n \"Curacautin\":\"Curacautín\",\n */\n\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9759,"value":"correccionesPasos = ({\n\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":10200,"value":" _.chain(dataPaso)\n .groupBy(d => d.comuna_residencia)\n .map((items, comuna) => _.chain(items).filter(d => d.zona == \"Urbana\" || d.zona == \"Total\").value())\n .value()\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9710,"value":"dictPasoComunas = {\n const dict = {};\n \n \n _.chain(dataPaso)\n .groupBy(d => d.comuna_residencia)\n .map((items, comuna) => _.chain(items).filter(d => d.zona == \"Urbana\" || d.zona == \"Total\").sortBy(e => e.Fecha).last().value())\n .each(d => {\n dict[d.comuna_residencia] = correccionesPasos[d.comuna_residencia] || d.Paso;\n dict[eliminaTildes(d.comuna_residencia)] = correccionesPasos[d.comuna_residencia] || d.Paso;\n \n })\n .value()\n \n return dict\n}\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":10185,"value":"_.chain(dataPaso).map(d => d.comuna_residencia).uniq().sortBy().value()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9769,"value":"function eliminaTildes(texto) {\n const rename = {\n \"Aisén\" : \"Aysen\",\n \"Ñuñoa\" : \"Nunoa\",\n \"Ñiquén\": \"Niquen\",\n \"O'Higgins\": \"OHiggins\"\n }\n return rename[texto] || texto.replace(\"á\",\"a\")\n .replace(\"é\",\"e\")\n .replace(\"í\",\"i\")\n .replace(\"ó\",\"o\")\n .replace(\"ú\",\"u\")\n .replace(\"Á\",\"A\")\n .replace(\"ñ\",\"n\")\n .replace(\"ü\",\"u\")\n\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":7862,"value":"html` \n ${data.map(d => `\n \n \n \n \n \n `\n )}\n

${moment(d.fecha).format(\"ddd D MMM\")}

${d.nuevos_casos}

${d.nuevos_tests}

\n `\n \n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":10283,"value":"{\n const fechas = [\n \"2021-01-18\",\n \"2021-01-25\",\n ]\n \n const data = regiones.map(region => {\n return {\n region: region,\n items: fechas.map(fecha => dictRegionFecha[region][fecha][\"nuevos_casos_semanales_con_sintomas\"])\n }\n })\n \n return html`\n \n ${data.map(d => `\n \n \n \n \n \n `\n )}\n

${d.region}

${d.items[0]}

${d.items[1]}

\n `\n \n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":10294,"value":"{\n const fechas = [\n \"2021-01-18\",\n \"2021-01-25\",\n ]\n \n const data = regiones.map(region => {\n return {\n region: region,\n items: fechas.map(fecha => d3.format(\".1%\")(dictRegionFecha[region][fecha][\"positividad\"]))\n }\n })\n \n return html`\n \n ${data.map(d => `\n \n \n \n \n \n `\n )}\n

${d.region}

${d.items[0]}

${d.items[1]}

\n `\n \n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":10292,"value":"{\n const fechas = [\n \"2021-01-24\",\n \"2021-01-25\",\n ]\n \n const data = regiones.map(region => {\n return {\n region: region,\n items: fechas.map(fecha => dictRegionFecha[region][fecha][\"nuevos_casos\"])\n }\n })\n \n return html`\n \n ${data.map(d => `\n \n \n \n \n \n `\n )}\n

${d.region}

${d.items[0]}

${d.items[1]}

\n `\n \n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9492,"value":"semanasGrafico = 12","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9267,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9583,"value":" dictRegionFecha[\"Chile\"][fechaActual];","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9418,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9433,"value":"labelByMetric = ({\n casos: {\n nombre: \"Nuevos casos\",\n descripcion: \"Nuevos casos confirmados\"\n },\n tests: {\n nombre: \"Tests PCR\",\n descripcion: \"Nuevos tests reportados\"\n },\n positividad: {\n nombre: \"Positividad\",\n descripcion: \"Proporción de exámenes positivos\"\n },\n fallecidos: {\n nombre: \"Fallecidos\",\n descripcion: \"Nuevos fallecidos reportados\"\n },\n camasUCI_covid19: {\n nombre: \"Pacientes C19 en UCI\",\n descripcion: \"UCI con pacientes COVID-19\"\n },\n ocupacionUCI: {\n nombre: \"% Ocupación UCI\",\n descripcion: \"Proporción de camas UCI ocupadas\"\n }\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9306,"value":"formatByMetric = {\n d3.formatDefaultLocale(es_ES);\n return ({\n casos: d3.format(\",.0f\"),\n tests: d3.format(\",.0f\"),\n fallecidos: d3.format(\",.0f\"),\n incidencia: d3.format(\".1f\"),\n positividad: d3.format(\".2%\"),\n camasUCI_covid19: d3.format(\",.1f\"),\n ocupacionUCI: d3.format(\".1%\"),\n variacionRelativa: d3.format(\".2%\"),\n variacionAbsoluta_casos: d3.format(\",.0f\"),\n variacionAbsoluta_tests: d3.format(\",.0f\"),\n variacionAbsoluta_fallecidos: d3.format(\",.0f\"),\n variacionAbsoluta_incidencia: d3.format(\",.0f\"),\n variacionAbsoluta_positividad: d3.format(\",.2%\"),\n variacionAbsoluta_camasUCI_covid19: d3.format(\",.1f\"),\n variacionAbsoluta_ocupacionUCI: d3.format(\",.1%\"),\n})\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9691,"value":"buildKPIs(\"Chile\",\"camasUCI_covid19\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9281,"value":"$36","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9168,"value":"function buildGowthMonitor(localidad, indicador) { \n \n const datosSemanales = [\"ocupacionUCI\"].includes(indicador)\n ? obtenerDatosSemanalesUCI(localidad)\n : obtenerDatosSemanales(localidad)\n \n const ultimaSemana = _.maxBy(datosSemanales, d => d.fecha)[\"fecha\"]\n\n \n const data = _.chain(datosSemanales)\n .filter(d => d.fecha >= moment(ultimaSemana).subtract(semanasGrafico,\"weeks\").format(\"YYYY-MM-DD\"))\n .value()\n debugger;\n\n \n const out = html`\n

\n\n\n

\n \n

\n `\n\n const visEl = d3.select(out).select(\"div.vis svg\");\n const visObj = new WeeklyMetricBarChartVis(visEl.node());\n visObj.metric(indicador).render(data)\n\n \n return out\n \n \n \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9166,"value":"$37","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9700,"value":"obtenerDatosSemanalesUCI(\"Chile\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9154,"value":"function obtenerDatosSemanales(localidad) {\n return _.chain(dictRegion[localidad])\n .filter(d => d.fecha <= fechaActual)\n .reverse()\n .filter((d,i) => i % 7 == 0 && d.nuevos_casos_semanales )\n .map(d => ({\n localidad : d.localidad,\n fecha: d.fecha,\n casos: d.nuevos_casos_semanales,\n tests: isNaN(d.nuevos_tests_semanales) ? null : d.nuevos_tests_semanales,\n fallecidos: d.nuevos_fallecidos_semanales,\n incidencia: d.casos_diarios_X100K,\n positividad: d.positividad,\n camasUCI_covid19 : d.camasUCI_covid19\n }))\n .value()\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9349,"value":"function obtenerDatosSemanalesUCI(localidad) {\n \n return _.chain(dictRegion[localidad])\n .filter(d => d.fecha <= fechaActual && d.ocupacionUCI)\n .reverse()\n .filter((d,i) => i % 7 == 0 && d.nuevos_casos_semanales )\n .map(d => ({\n localidad : d.localidad,\n fecha: d.fecha,\n ocupacionUCI: d.ocupacionUCI,\n }))\n .value()\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9654,"value":"obtenerDatosSemanalesUCI(\"Chile\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9657,"value":"obtenerDatosSemanales(\"Chile\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8333,"value":"html`${dataChile ? resumenReducciones() : \"Cargando datos\"}`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8339,"value":"$38","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9008,"value":"{\n const lastDate = _.chain(dictCamasUCI[\"Chile\"]).map((item, fecha) => fecha).sortBy().last().value()\n \n const recordChile = dictCamasUCI[\"Chile\"][lastDate]\n const recordRegión = dictCamasUCI[regionSeleccionada][lastDate]\n \n return html`\n

Camas Críticas al ${moment(lastDate).format(\"D MMMM YYYY\")}

\n ${format.positividad(recordChile.ocupancia)} de ocupación en todo Chile
\n ${format.positividad(recordRegión.ocupancia)} de ocupación en la región (${regionSeleccionada})\n `\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9027,"value":"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8867,"value":"html`

Gráfico de positividad vs incidencia

\nEste gráfico permite ubicar a las distintas regiones en un espacio definido por 2 variables:

\nPositividad: Proporción de tests PCR que dan resultado positivo
\nIncidencia: Promedio de nuevos casos diarios x 100 mil habitantes

\n\nLa incidencia refleja el nivel de contagios en la región (aspiramos a que sea lo más bajo posible)
\nSi la positividad es alta (ej > 5%) es un indicador de que no estamos haciendo suficientes tests para poder identificar adecuadamente a los casos infectados. Con una positividas alta, la incidencia puede ser poco precisa y podría ser considerablemente mayor si se hacen más tests.\n

\nEn el gráfico se muestra una línea azul que muestra el \"movimiento\" que ha tenido la región en los últimos 7 días.\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":10071,"value":"{\n //mutable fechaActual = \"2021-01-30\"\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":6356,"value":"vis = {\n const out = html`

\n \n \n

`;\n \n\n \n \n return out;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":7052,"value":"md`Notas:\n* El tamaño de las burbujas representa la población de la región.\n\n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8886,"value":"$39","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8089,"value":"visQuad = {\n const out = html`

\n \n \n

`;\n \n\n \n \n return out;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8892,"value":"$3a","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8196,"value":"visQuadFallecidos = {\n const out = html`

\n \n \n

`;\n \n\n \n \n return out;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1402,"value":"md`## CSS Styles`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8134,"value":"html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":5838,"value":"html`\n\n`\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":85,"value":"style_bootstrap","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":4097,"value":"style_fontawesome","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":218,"value":"$3b","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":4832,"value":"md`# Vis`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":7701,"value":"renderer = {\n \n visObj.date(fechaActual).render(nodes);\n\n}\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8091,"value":"\nrendererQuad = {\n \n visQuadrantObj.date(fechaActual).attributeX(\"incidencia100K\").render(quadNodes);\n\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8198,"value":"\nrendererQuadFallecidos = {\n \n visQuadrantFallecidosObj.date(fechaActual).attributeX(\"muertes_x_1MM\").render(quadNodes);\n\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":7593,"value":"threshold = 0.05","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":7587,"value":"function getTrend(d) {\n const fromItem = _.first(d.recent);\n const toItem = _.last(d.recent);\n \n const positivityChange = toItem.positividad/ fromItem.positividad;\n const incidenceChange = toItem.incidencia/ fromItem.incidencia;\n \n const direction = (\n //(incidenceChange > (1+threshold)) ||\n (positivityChange > (1+2*threshold))\n \n ) ? 1 \n \n : (\n (positivityChange < (1-threshold)) \n // && incidenceChange < (1-threshold)\n ) ? -1\n : 0\n \n return direction\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":7596,"value":"nodes = allNodes","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8124,"value":"allNodes = getNodes(fechaActual)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8123,"value":"quadNodes = getNodes(fechaActual)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":6354,"value":"$3c","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8084,"value":"$3d","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8086,"value":"visQuadrantObj = {\n const visEl = d3.select(visQuad).select(\"svg\");\n \n return new IncidenceGrowthQuadrantsVis(visEl.node());\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8200,"value":"visQuadrantFallecidosObj = {\n const visEl = d3.select(visQuadFallecidos).select(\"svg\");\n \n return new IncidenceGrowthQuadrantsVis(visEl.node());\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":6441,"value":"visObj = {\n const visEl = d3.select(vis).select(\"svg\");\n \n return new IncidenceGrowthVis(visEl.node());\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1407,"value":"md`## Config Params`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":7210,"value":"viewof xRange = rangeSlider({\n min: 1,\n max: 200,\n // Note that values must be specified as array of length 2.\n value: this ? this.value : [1, Math.ceil(rangeIncidencia[1]+10)],\n // Custom slider CSS, replaces all styles.\n\n format: '.1f',\n title: 'Rango para escala de Incidencia',\n description: 'Modifique si desea cambiar la escala visible',\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":7222,"value":"viewof yRange = rangeSlider({\n min: 0,\n max: .5,\n // Note that values must be specified as array of length 2.\n value: this ? this.value : [0.005, _.max([Math.ceil((rangePositividad[1]+0.01)*100)/100, .12])],\n \n\n\n // Custom slider CSS, replaces all styles.\n\n format: '.2%',\n title: 'Rango para la escala de positividad',\n description: 'Modifique si desea cambiar la escala visible.',\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8350,"value":"format = {\n d3.formatDefaultLocale(es_ES)\n return {\n \"positividad\": d3.format(\".1%\"),\n \"incidencia\": d3.format(\".1f\"),\n \"variacion\": d3.format(\".1%\"),\n \"casos\": d3.format(\",.0d\"),\n\n }\n}\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8686,"value":"fechaInicial = _.min(dictRegion[\"Chile\"].map(d => d.fecha))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8330,"value":"mutable fechaActual = _.max(dictRegion[\"Araucanía\"].map(d => d.fecha))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9992,"value":"_.max(dictRegion[\"Araucanía\"].map(d => d.fecha))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9988,"value":"_.last(dictRegion[\"Chile\"])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8762,"value":"indicadorY = \"positividad\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":7259,"value":"logScale = true","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":7869,"value":"textoABuscar = \"\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":6411,"value":"colorCodes = ({\n baja_incidencia_bajo_crecimiento: \"green\",\n media_incidencia_bajo_crecimiento: \"orange\",\n alta_incidencia_bajo_crecimiento: \"red\",\n baja_incidencia_alto_crecimiento: \"yellow\",\n media_incidencia_alto_crecimiento: \"orange\",\n alta_incidencia_alto_crecimiento: \"red\",\n \n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":5770,"value":"transitionTime = 1000","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2884,"value":"locale_es_ES = d3.json(\"https://raw.githubusercontent.com/d3/d3-time-format/master/locale/es-ES.json\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":840,"value":"// Base trasition duration during transitions \nduration = 500","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1384,"value":"md`## Data`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9108,"value":"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":10265,"value":"_.last(dictRegion[\"Araucanía\"])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8324,"value":"import {dataChile, dictRegion, dictRegionFecha, ordenRegiones} from \"@elaval/data-covid-19-chile\"\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8364,"value":"regiones = _.chain(ordenRegiones).map((order,key) => ({region:key, order:order})).sortBy(d => d.order).map(d => d.region).value()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":7400,"value":"rangePositividad = d3.extent(_.chain(dataChile).filter(d => d.fecha >= moment(fechaActual).subtract(1,\"week\").format(\"YYYY-MM-DD\")).map(d => d.positividad).value(), d => d)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":7407,"value":"rangeIncidencia = d3.extent(_.chain(dataChile).filter(d => d.fecha >= moment(fechaActual).subtract(1,\"week\").format(\"YYYY-MM-DD\")).map(d => d.casos_diarios_X100K).value(), d => d)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1397,"value":"md`## Aux functions`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8508,"value":"$3e","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8615,"value":"$3f","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8386,"value":"$40","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8437,"value":"$41","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":10345,"value":"dictRegionFecha[\"Chile\"][\"2021-04-18\"]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8665,"value":"$42","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":6406,"value":"clasificacion = (incidencia, crecimiento) => {\n debugger;\n if (incidencia < 5 && crecimiento < 1) {\n return \"baja_incidencia_bajo_crecimiento\"\n } else if (incidencia < 10 && crecimiento < 0) {\n return \"media_incidencia_bajo_crecimiento\"\n } else if (incidencia >= 10 && crecimiento < 0) {\n return \"alta_incidencia_bajo_crecimiento\"\n } else if (incidencia < 5 && crecimiento >= 0) {\n return \"baja_incidencia_alto_crecimiento\"\n } else if (incidencia < 10 && crecimiento >= 0) {\n return \"media_incidencia_alto_crecimiento\"\n } else if (incidencia >= 10 && crecimiento >= 0) {\n return \"alta_incidencia_alto_crecimiento\"\n } else return null\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":3997,"value":"function enCuarentena(item) {\n return item.lockdowns.find(d => {\n const fromDate = moment(d.start_date);\n const toDate = moment(d.end_date).add(1, \"day\")\n return moment(new Date()).isBetween(fromDate, toDate)\n }) ? true : false\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9089,"value":"UCICovid19(\"Chile\",\"2020-12-28\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9022,"value":"function camaCritica(localidad,fecha) {\n \n const maxFecha = _.chain(dictCamasUCI[localidad])\n .keys()\n .filter(d => d <= fecha)\n .max()\n .value()\n \n \n \n const datosPorFecha = {\n localidad: localidad,\n fecha: maxFecha,\n ocupancia: dictCamasUCI[localidad][maxFecha].ocupancia\n }\n \n return datosPorFecha || {}\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9652,"value":"UCICovid19(\"Chile\",\"2020-12-28\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9123,"value":"function UCICovid19(localidad,fecha) {\n \n const record = _.chain(dictRegionFecha[localidad])\n .map((item, fecha) => item)\n .filter(d => d.fecha <= fecha && d.ocupacionUCI)\n .maxBy(d => d.fecha)\n .value()\n \n \n return record\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1387,"value":"md`## Code Libraries`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":6953,"value":"import {Scrubber} from \"@mbostock/scrubber\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":7207,"value":"import {rangeSlider}from \"@beerdrinker/range-slider\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":83,"value":"import {style_bootstrap, style_fontawesome} from \"@elaval/utils\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":12,"value":"_ = require(\"lodash\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":7,"value":"d3 = Object.assign(await require(\"d3@6\"), {cloud: await require(\"d3-cloud@1\")})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8491,"value":"es_ES = ({\n \"decimal\": \",\",\n \"thousands\": \".\",\n \"grouping\": [3],\n \"currency\": [\"$\", \"\"],\n \"dateTime\": \"%a %b %e %X %Y\",\n \"date\": \"%d/%m/%Y\",\n \"time\": \"%H:%M:%S\",\n \"periods\": [\"AM\", \"PM\"],\n \"days\": [\"Domingo\", \"Lunes\", \"Martes\", \"Miércoles\", \"Jueves\", \"Viernes\", \"Sábado\"],\n \"shortDays\": [\"Dom\", \"Lun\", \"Mar\", \"Mi\", \"Jue\", \"Vie\", \"Sab\"],\n \"months\": [\"Enero\", \"Febrero\", \"Marzo\", \"Abril\", \"Mayo\", \"Junio\", \"Julio\", \"Agosto\", \"Septiembre\", \"Octubre\", \"Noviembre\", \"Diciembre\"],\n \"shortMonths\": [\"Ene\", \"Feb\", \"Mar\", \"Abr\", \"May\", \"Jun\", \"Jul\", \"Ago\", \"Sep\", \"Oct\", \"Nov\", \"Dic\"]\n });","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8493,"value":"d3.formatDefaultLocale(es_ES)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":249,"value":"moment = require('moment@2.24.0/moment.js')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2331,"value":"momentLocaleConfig = {\n updateMomentLocale()\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":10326,"value":"function updateMomentLocale() {\n moment.locale('es'); // 'en'\n \n moment.updateLocale('es', {\n weekdays : [\n \"Domingo\", \"Lunes\", \"Martes\", \"Miércoles\", \"Jueves\", \"Viernes\", \"Sábado\"\n ]\n});\n \n moment.updateLocale('es', {\n months : [\n \"Enero\", \"Febrero\", \"Marzo\", \"Abril\", \"Mayo\", \"Junio\", \"Julio\",\n \"Agosto\", \"Septiembre\", \"Octubre\", \"Noviembre\", \"Diciembre\"\n ]\n});\n \n moment.updateLocale('es', {\n monthsShort : [\n \"Ene\", \"Feb\", \"Mar\", \"Abr\", \"May\", \"Jun\",\n \"Jul\", \"Ago\", \"Sep\", \"Oct\", \"Nov\", \"Dic\"\n ]\n});\n \n moment.updateLocale('es', {\n weekdaysShort : [\"Dom\", \"Lun\", \"Mar\", \"Mie\", \"Jue\", \"Vie\", \"Sab\"]\n});\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":333,"value":"import {input, autoSelect,text, select, date, radio, button, number, slider, checkbox} from '@jashkenas/inputs'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8952,"value":"googleAnalytics('G-FR2T9RDZ35')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8951,"value":"googleAnalytics = UA => {\n const script = document.createElement('script');\n script.src = 'https://www.googletagmanager.com/gtag/js?id=${UA}';\n script.type = 'text/javascript';\n script.async = true;\n\n script.onload = () => {\n window.dataLayer = window.dataLayer || [];\n function gtag() {\n var dataLayer = window.dataLayer;\n dataLayer.push(arguments);\n }\n gtag('js', new Date());\n\n gtag('config', UA);\n };\n document.body.appendChild(script);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"}],"files":"$W43","stdlib":"1","titling":"auto"}} 2f:"$2e:body"