Right On Target es-419 Explainer

Explicador de Justo en el blanco

Objetivo de este acertijo: Agregar el círculo de diana al blanco

Tutorial de la solución: Para agregar una nueva forma a la pantalla, debes usar .append(). El argumento .append(). es un string que dice qué tipo de forma quieres crear. En este acertijo, debe ser un 'circle'. Debe tener un radio de 30, por lo que debes definir su atributo 'r' como 30. También debe ser de color rojo. Puedes cambiar el color mediante el atributo 'fill'.

Solución del código de ejemplo:

(Pulsa a continuación para revelar)


let outer = svg.append('circle').attr('r',90).attr('fill','red');

let inner = svg.append('circle').attr('r',60).attr('fill','white');

let bullseye = svg.append('circle').attr('r',30).attr('fill','red');

Conceptos de D3: .append(), .attr('fill',), .attr('r',)

Código adicional (código oculto que se ejecuta antes del código del acertijo):


var svg = canvas.append('g');

svg.attr('transform',`translate(${window.innerWidth/2},${window.innerHeight/2})`);