2e:null 2f:["$","title",null,{"children":"Análisis de la Producción Fiscalizada de Colombia para el 2017 | Andres Segura-Tinoco | Observable"}] 34:T59c,doBarChart = (rawdata, svg, xVar, yVar) => { const maxItems = 22; const dataSorted = rawdata .sort( (a,b) => d3.descending(+a[xVar], +b[xVar])) .slice(0, +maxItems); const x = d3.scaleLinear() .domain([0, d3.max(dataSorted, d=> +d[xVar])]) .range([0, width]); const y = d3.scaleBand() .domain(dataSorted.map( d=> d[yVar])) .range([0, dataSorted.length * 16]); const rects = svg.selectAll(".bar") .data(dataSorted); rects.enter() .append("rect") .attr("class", "bar") .attr("x", 0) .attr("y", (d) => y(d[yVar])) .attr("width", d => x(+d[xVar])) .attr("height", 15) .style("fill", "green"); const texts = svg.selectAll(".label") .data(dataSorted); rects.enter() .append("text") .attr("class", "label") .attr("x", d => 0) .attr("y", (d) => y(d[yVar]) + 11) .text( d => (d[yVar] + " : " + d[xVar] + " bbls")) .style("fill", "black") .style("font-size", "8pt") .style("font-family", "calibri"); const height = 420, margin = {left:0, right:10, top: 10, bottom:50}, iwidth = width/2 - margin.left - margin.right, iheight = height - margin.top - margin.bottom; const g = svg.append("g") .attr("transform", `translate(${margin.left}, ${margin.top})`) .call(d3.axisBottom(x)) .attr("transform", `translate(0, ${iheight})`); return svg.node(); }35:T962,doLinearChart = (rawdata, svg, xVar, yVar) => { const maxItems = +currMaxItems; const lineData = data.slice(0, maxItems); const height = 500, margin = {left:50, right:10, top: 10, bottom:60}, iwidth = width/2 - margin.left - margin.right, iheight = height - margin.top - margin.bottom; const x = d3.scaleBand() .domain(lineData.map( d => d[xVar])) .range([iheight, 0]); const y = d3.scaleLinear() .domain([d3.max(lineData, d=> +d[yVar]), 0]) .range([0, iwidth]); const line = d3.line() .x( d=> x(d[xVar])) .y( d=> y(+d[yVar])); const g = svg.append("g") .attr("transform", `translate(${margin.left}, ${margin.top})`) .style("text-anchor", "middle") .style("color", "black") g.append("g") .call(d3.axisBottom(x)) .attr("transform", `translate(0, ${iheight})`); // text label for the x axis g.append("text") .attr("transform", "translate(" + (width/3) + " ," + (height + margin.top - 30) + ")") .style("text-anchor", "middle"); d3.select(svg2) .selectAll("text") .attr("y", -10) .attr("x", -100) .attr("dy", ".35em") .attr("transform", "rotate(-90)") .style("text-anchor", "start"); g.append("g") .call(d3.axisLeft(y)); // text label for the y axis g.append("text") .attr("transform", "rotate(-90)") .attr("y", 1) .attr("x", -80) .attr("dy", "1em") .style("text-anchor", "middle") .style("font-family", "calibri") .style("font-size", "12pt") .text("Oil Prod (bbls)"); g.append("path") .style("stroke", "green") .style("fill", "none") .attr("d", line(lineData)) let tooltip; g.selectAll("circle") .data(lineData).enter() .append("circle") .attr("cx", d => x(d[xVar])) .attr("cy", d => y(+d[yVar])) .attr("r", 4) .style("fill", "#EB9A72") .on("mouseover", function (d) { console.log(d); tooltip.attr("x", x(d[xVar])) .attr("y", y(+d[yVar]) - 15) .text(`Entidad=${d[xVar]}, Oil Prod=${+d[yVar]}`); d3.select(this) .transition() .duration(500); }); tooltip = g.append("text") .style("font-size", "8pt") .style("font-family", "sans-serif") .style("color", "steelblue") .attr("x", -100); return svg.node(); }36:[] 32:{"id":"b443158936c824ff","slug":"produccion-fiscalizada-de-colombia-para-el-2017","title":"Análisis de la Producción Fiscalizada de Colombia para el 2017","thumbnail":"49e3b8e7b5c25c76853ac31b4ed41e895e2facb91573182f4e68e995d0ccb899","access_level":"public","create_time":"$D2018-09-10T17:25:22.461Z","update_time":"$D2018-12-10T17:14:07.080Z","view_time":null,"first_public_time":"$D2018-09-10T17:25:27.865Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"ff46568c68a22740","login":"ansegura7","name":"Andres Segura-Tinoco","avatar_url":"https://avatars-next.observableusercontent.com/4dd59e255febc0a15c606b2e2aaf3a9e2f0d8564dec994ae6b3d391b3804b939","tier":"starter_2024"},"version":543,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"7ecd247516fdac18","login":"ansegura7","name":"Andres Segura-Tinoco","avatar_url":"https://avatars-next.observableusercontent.com/4dd59e255febc0a15c606b2e2aaf3a9e2f0d8564dec994ae6b3d391b3804b939","tier":null}],"members":[{"type":"individual","id":"7ecd247516fdac18","login":"ansegura7","name":"Andres Segura-Tinoco","avatar_url":"https://avatars-next.observableusercontent.com/4dd59e255febc0a15c606b2e2aaf3a9e2f0d8564dec994ae6b3d391b3804b939","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Análisis de la Producción Fiscalizada de Colombia para el 2017","cells":[{"id":0,"value":"md`# Análisis de la Producción Fiscalizada de Colombia para el 2017`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":180,"value":"md`### Estudiante: Andres Segura Tinoco\n ### Código: 201711582\n ### Curso: Visual Analytics\n ### Tarea 2\n ### Fecha: 11/9/2018\n ### Licencia: MIT`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":254,"value":"md`## Información de los datos\n La medición de la producción fiscalizada de hidrocarburos es un proceso que consiste en medir y determinar los volúmenes de petróleo, gas natural y condensados en los puntos de fiscalización de las empresas contratistas que operan en los diferentes lotes petroleros en nuestro país, de acuerdo con procedimientos basados en los Estándares Internacionales del API, ASTM, AGA. Se incluyen los datos de producción fiscalizada mensual de petróleo durante el año 2017. Periodo 2017-enero al 2017-diciembre. Doce (12) ciclos.\n\nDatos proporcionados por Agencia Nacional de Hidrocarburos`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4,"value":"d3 = require(\"d3\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":289,"value":"fulldata = d3.csv(\"https://raw.githubusercontent.com/ansegura7/ProduccionFiscalizadaCol2017/master/data/Colombia-Produccion-Fiscalizada-Petroleo-2017.csv\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":214,"value":"md`## Carga dinámica de los datos`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":187,"value":"md`Por favor, seleccione el tipo de entidad agrupadora de los datos:`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"data = d3.csv(\"https://raw.githubusercontent.com/ansegura7/ProduccionFiscalizadaCol2017/master/data/Colombia-Produccion-Fiscalizada-Petroleo-2017-\" + currEntityType + \".csv\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":193,"value":"viewof currEntityType = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":64,"value":"md`## Filtrado de datos por mes`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":167,"value":"md`Por favor, seleccione el mes para el cual desea analizar la producción acumulada:`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":160,"value":"viewof currMonth = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"svg = DOM.svg(width, 400)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":535,"value":"md`Por favor, seleccione la cantidad de elementos que se mostrarán en el gráfico de Linea:`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":530,"value":"viewof currMaxItems = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":348,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":352,"value":"svg2 = DOM.svg(width, 550)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":139,"value":"md`## Generar grafico`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":217,"value":"createCharts = (xVar, yVar) => {\n yVar = yVar.toUpperCase();\n d3.select(svg).html(\"\");\n d3.select(svg2).html(\"\");\n doBarChart(data, d3.select(svg), xVar, yVar);\n doLinearChart(data, d3.select(svg2), yVar, xVar);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":147,"value":"createCharts(currMonth, currEntityType)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":260,"value":"md`# Readme`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":264,"value":"md`## Objetivo del Proyecto\n Crear una visualización web de la producción petrolera fiscalizada mensual de Colombia para el 2017, que permita agrupar dicha información por diferentes entidades (Departamento, Municipio, Operador y Campo), con el fin de poder analizar y descubrir información tal como: ¿Cuál entidad es la que más barriles de petróleo produce para la Nación y en qué mes? Con lo cual, el Estado puede tomar decisiones asociadas a la inversión de recursos económicos de manera optimo y/o asignación de yacimientos a los operadores más rentables.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":489,"value":"md`## Algunos Insights\n- Departamentos que más petróleo producen: META (420 Kbbls/mes) y CASANARE (160 Kbbls/mes)\n- Municipios que más petróleo producen: PUERTO GAITAN (200 Kbbls/mes), ACACIAS (95K bbls/mes) y CASTILLA NUEVA (76 bbls/mes)\n- Operadores que más petróleo producen: COPETROL LLANOS (325 Kbbls/mes) y COPETROL S.A. (115 325 Kbbls/mes)\n- Campos que más petróleo producen: RUBIALES (119 Kbbls/mes), CASTILLA (75 Kbbls/mes) y CHICHIMENE (52 Kbbls/mes)` ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":268,"value":"md`## Tecnologías Usadas\n Para el desarrollo del proyecto se usaron las siguientes tecnologías:\n - Observable para el desarrollo Web\n - Javascript y el framework d3.js para crear el gráfico de barras y la respectiva interacción con él\n - GitHub para almacenar los datos en el repositorio: https://github.com/ansegura7/ProduccionFiscalizadaCol2017`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":272,"value":"md`## Prerrequisitos y Uso\n El proyecto sólo depende del acceso a los datos almacenados en el repositorio https://github.com/ansegura7/ProduccionFiscalizadaCol2017 y a la disponibilidad del servicio de https://beta.observablehq.com\n\n El gráfico principal depende de 2 filtros, que son Tipo de Entidad y Mes Actual. A partir de estos 2 Combo Boxes, se filtrarán los datos y se actualizará el gráfico, para su respectivo análisis.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":274,"value":"md`## Autores\n El autor de los datos es la \"Agencia Nacional de Hidrocarburos\" del Estado. Los datos están actualizados al 7 de septiembre de 2018 y en el siguiente link se puede acceder a ellos:\n\n https://www.datos.gov.co/Minas-y-Energ-a/Producci-n-Fiscalizada-de-Petr-leo-2017/xhmd-pcpc\n\n El autor de la visualización es Andrés Segura Tinoco, CE 201711582.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":276,"value":"md`## Screeshot\n A continuación, se presenta un pantallazo del proyecto \n https://raw.githubusercontent.com/ansegura7/ProduccionFiscalizadaCol2017/master/screenshot/VA-Tarea2-Screenshot.PNG`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":278,"value":"md`## Licencia\n Este proyecto está bajo la licencia MIT, la cual reza lo siguiente:\n\n\"Copyright (c) 2018 Andres Segura\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\"`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":345,"value":"md`## Fin`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W36","stdlib":"1","titling":"auto"}} 33:"$32:body"