31:T5ee,{ // 1. Creación de un área de dibujo (512x90 pixeles) const svg = d3.create("svg") .attr("width",300) .attr("height",300); // 2. Asociamos la colección de círculos a componentes gráficos "circle" var polygon = svg.selectAll("polygon") .data(coleccion_de_triangulos) .enter() .append("polygon"); var polygon_rojo = svg.selectAll("polygon_rojo") .data(coleccion_de_triangulos) .enter() .append("polygon"); // 3. Le decimos a d3 cómo utilizar la información disponible en el arreglo // para setear las propiedades cx, cy, r y fill del componente HTML circle polygon.attr("points", function(d) { d = [[d.eje_x+3, d.eje_y+(3*6)], [d.eje_x+(3*3), d.eje_y+(3*2)], [d.eje_x+(3*5), d.eje_y+(3*6)]] return d ;}) .attr("stroke", function(d) {return d.stroke;} ) .attr("fill", function(d) { return d.fill;}) .attr("stroke-width", function(d) { return d.strokewidth;}) ; polygon_rojo.attr("points", function(d) { d = [[d.eje_x+(3*3)+3, d.eje_y+(3*2)], [d.eje_x+(3*5)+3, d.eje_y+(3*6)], [d.eje_x+(3*7)+3, d.eje_y+(3*2)]] return d ;}) .attr("stroke", function(d) {return d.stroke2;} ) .attr("fill", function(d) { return d.fill2;}) .attr("stroke-width", function(d) { return d.strokewidth;}) ; // 4. Retornamos el canvas return svg.node(); }32:[] 2f:{"title":"1.4 TP-3: Introducción a Observable y D3","cells":[{"id":0,"value":"md`# 1.4 TP-3: Introducción a Observable y D3`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1513,"value":"d3 = require(\"d3@5\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":12,"value":"md`## Ejercicio a)`","pinned":false,"hidden":false,"mode":"ojs"},{"id":46,"value":"html`\n