Gabonese Flag Fixer es-419 Explainer

Explicador de Corrector de la bandera gabonesa

**Objetivo de este acertijo **:

Usar el método de atributo .attr() para definir las posiciones 'x' e 'y' de un rectángulo SVG.

Tutorial de la solución:

El método de atributo .attr() se usa para definir o modificar los atributos de formas SVG. Toma dos argumentos: el nombre del atributo para cambiar y el valor del atributo. Para definir la posición de un rectángulo SVG, usa .attr() para definir el valor de 'x' e 'y'. El atributo 'x' define la cantidad de espacio a la izquierda de un rectángulo. El atributo 'y' define la cantidad de espacio en la parte superior de una forma.

En el código de inicio, greenStripe ya tiene valores para 'x' e 'y', pero son incorrectos. En este acertijo, cambiarás esos valores para que greenStripe esté en la posición correcta.

Para completar el acertijo, cambia los valores 'x' e 'y' a 0.

Solución del código de ejemplo:

(Pulsa a continuación para revelar)


greenStripe.attr('x',0).attr('y',0);

Conceptos de JavaScript: variable

Conceptos de D3: atributo

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


var greenStripe = svg.append('rect').attr('fill','#4CAF50').attr('width',90).attr('height',33);

var yellowStripe = svg.append('rect').attr('fill','#FFEB3B').attr('x',0).attr('y',33).attr('width',90).attr('height',33);

var blueStripe = svg.append('rect').attr('fill','#2196F3').attr('x',0).attr('y',66).attr('width',90).attr('height',33);