Gráficos SVG - Brython - Soluciones (1)

Se ofrecen a continuación unas posibles soluciones de los ejercicios SVG Brython (1).

Gráficos SVG Brython (1) - 1 - Puntos

SVG Brython (1) 1 1 
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <title>SVG (1) 1 1. Ejercicios SVG (1). Brython. Python. Bartolomé Sintes Marco</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython_stdlib.js"></script>
  <script type="text/python3">
from browser import document
import browser.svg as svg

document["imagen"] <= svg.circle(cx=300, cy=0,   r=5, fill="black")
document["imagen"] <= svg.circle(cx=0,   cy=0,   r=5, fill="blue")
document["imagen"] <= svg.circle(cx=0,   cy=300, r=5, fill="green")
document["imagen"] <= svg.circle(cx=300, cy=300, r=5, fill="red")
  </script>
</head>

<body onload="brython()">
  <svg version="1.1" xmlns="http://www.w3.org/2000/svg"
    width="320" height="320" viewBox="-10 -10 320 320"
    style="border: black 1px solid" id="imagen">
  </svg>
</html>
SVG Brython (1) 1 2 
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <title>SVG (1) 1 2. Ejercicios SVG (1). Brython. Python. Bartolomé Sintes Marco</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython_stdlib.js"></script>
  <script type="text/python3">
from browser import document
import browser.svg as svg

document["imagen"] <= svg.circle(cx=300, cy=0,   r=5, fill="red")
document["imagen"] <= svg.circle(cx=150, cy=0,   r=5, fill="green")
document["imagen"] <= svg.circle(cx=150, cy=150, r=5, fill="black")
document["imagen"] <= svg.circle(cx=300, cy=150, r=5, fill="blue")
  </script>
</head>

<body onload="brython()">
  <svg version="1.1" xmlns="http://www.w3.org/2000/svg"
    width="320" height="320" viewBox="-10 -10 320 320"
    style="border: black 1px solid" id="imagen">
  </svg>
</html>
SVG Brython (1) 1 3 
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <title>SVG (1) 1 3. Ejercicios SVG (1). Brython. Python. Bartolomé Sintes Marco</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython_stdlib.js"></script>
  <script type="text/python3">
from browser import document
import browser.svg as svg

document["imagen"] <= svg.circle(cx=0,   cy=0,   r=5, fill="red")
document["imagen"] <= svg.circle(cx=100, cy=100, r=5, fill="black")
document["imagen"] <= svg.circle(cx=200, cy=200, r=5, fill="blue")
document["imagen"] <= svg.circle(cx=300, cy=300, r=5, fill="green")
  </script>
</head>

<body onload="brython()">
  <svg version="1.1" xmlns="http://www.w3.org/2000/svg"
    width="320" height="320" viewBox="-10 -10 320 320"
    style="border: black 1px solid" id="imagen">
  </svg>
</html>
SVG Brython (1) 1 4 
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <title>SVG (1) 1 4. Ejercicios SVG (1). Brython. Python. Bartolomé Sintes Marco</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython_stdlib.js"></script>
  <script type="text/python3">
from browser import document
import browser.svg as svg

document["imagen"] <= svg.circle(cx=0,   cy=150, r=5, fill="#000")
document["imagen"] <= svg.circle(cx=75,  cy=150, r=5, fill="#333")
document["imagen"] <= svg.circle(cx=150, cy=150, r=5, fill="#555")
document["imagen"] <= svg.circle(cx=225, cy=150, r=5, fill="#777")
document["imagen"] <= svg.circle(cx=300, cy=150, r=5, fill="#999")
  </script>
</head>

<body onload="brython()">
  <svg version="1.1" xmlns="http://www.w3.org/2000/svg"
    width="320" height="320" viewBox="-10 -10 320 320"
    style="border: black 1px solid" id="imagen">
  </svg>
</html>
SVG Brython (1) 1 5 
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <title>SVG (1) 1 5. Ejercicios SVG (1). Brython. Python. Bartolomé Sintes Marco</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython_stdlib.js"></script>
  <script type="text/python3">
from browser import document
import browser.svg as svg

document["imagen"] <= svg.circle(cx=150, cy=50,  r=25, fill="blue")
document["imagen"] <= svg.circle(cx=150, cy=100, r=25, fill="red")
document["imagen"] <= svg.circle(cx=150, cy=150, r=25, fill="black")
document["imagen"] <= svg.circle(cx=150, cy=200, r=25, fill="green")
document["imagen"] <= svg.circle(cx=150, cy=250, r=25, fill="purple")
  </script>
</head>

<body onload="brython()">
  <svg version="1.1" xmlns="http://www.w3.org/2000/svg"
    width="320" height="320" viewBox="-10 -10 320 320"
    style="border: black 1px solid" id="imagen">
  </svg>
</html>
SVG Brython (1) 1 6 
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <title>SVG (1) 1 6. Ejercicios SVG (1). Brython. Python. Bartolomé Sintes Marco</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython_stdlib.js"></script>
  <script type="text/python3">
from browser import document
import browser.svg as svg

document["imagen"] <= svg.circle(cx=150, cy=150, r=150, fill="black")
document["imagen"] <= svg.circle(cx=150, cy=150, r=125, fill="white")
document["imagen"] <= svg.circle(cx=150, cy=150, r=100, fill="black")
document["imagen"] <= svg.circle(cx=150, cy=150, r=75,  fill="white")
document["imagen"] <= svg.circle(cx=150, cy=150, r=50,  fill="black")
document["imagen"] <= svg.circle(cx=150, cy=150, r=25,  fill="white")
  </script>
</head>

<body onload="brython()">
  <svg version="1.1" xmlns="http://www.w3.org/2000/svg"
    width="320" height="320" viewBox="-10 -10 320 320"
    style="border: black 1px solid" id="imagen">
  </svg>
</html>

Gráficos SVG Brython (1) - 2 - Líneas

SVG Brython (1) 2 1 
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <title>SVG (1) 2 1. Ejercicios SVG (1). Brython. Python. Bartolomé Sintes Marco</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython_stdlib.js"></script>
  <script type="text/python3">
from browser import document
import browser.svg as svg

document["imagen"] <= svg.line(x1=0,    y1=-150, x2=0,   y2=150, stroke="green", stroke_width=1)
document["imagen"] <= svg.line(x1=-150, y1=0,    x2=150, y2=0,   stroke="green", stroke_width=1)
  </script>
</head>

<body onload="brython()">
  <svg version="1.1" xmlns="http://www.w3.org/2000/svg"
    width="320" height="320" viewBox="-160 -160 320 320"
    style="border: black 1px solid" id="imagen">
  </svg>
</html>
SVG Brython (1) 2 2 
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <title>SVG (1) 2 2. Ejercicios SVG (1). Brython. Python. Bartolomé Sintes Marco</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython_stdlib.js"></script>
  <script type="text/python3">
from browser import document
import browser.svg as svg

document["imagen"] <= svg.line(x1=0,    y1=-75,  x2=150, y2=-75, stroke="blue", stroke_width=1)
document["imagen"] <= svg.line(x1=-150, y1=75,   x2=0,   y2=75,  stroke="blue", stroke_width=1)
document["imagen"] <= svg.line(x1=75,   y1=0,    x2=75,  y2=150, stroke="blue", stroke_width=1)
document["imagen"] <= svg.line(x1=-75,  y1=-150, x2=-75, y2=0,   stroke="blue", stroke_width=1)
  </script>
</head>

<body onload="brython()">
  <svg version="1.1" xmlns="http://www.w3.org/2000/svg"
    width="320" height="320" viewBox="-160 -160 320 320"
    style="border: black 1px solid" id="imagen">
  </svg>
</html>
SVG Brython (1) 2 3 
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <title>SVG (1) 2 3. Ejercicios SVG (1). Brython. Python. Bartolomé Sintes Marco</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython_stdlib.js"></script>
  <script type="text/python3">
from browser import document
import browser.svg as svg

document["imagen"] <= svg.line(x1=-150, y1=0,   x2=0,   y2=-150, stroke="purple", stroke_width=1)
document["imagen"] <= svg.line(x1=-150, y1=150, x2=150, y2=-150, stroke="purple", stroke_width=1)
document["imagen"] <= svg.line(x1=0,    y1=150, x2=150, y2=0,    stroke="purple", stroke_width=1)
  </script>
</head>

<body onload="brython()">
  <svg version="1.1" xmlns="http://www.w3.org/2000/svg"
    width="320" height="320" viewBox="-160 -160 320 320"
    style="border: black 1px solid" id="imagen">
  </svg>
</html>
SVG Brython (1) 2 4 
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <title>SVG (1) 2 4. Ejercicios SVG (1). Brython. Python. Bartolomé Sintes Marco</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython_stdlib.js"></script>
  <script type="text/python3">
from browser import document
import browser.svg as svg

document["imagen"] <= svg.line(x1=-150, y1=-150, x2=-50, y2=-50, stroke="chocolate", stroke_width=1)
document["imagen"] <= svg.line(x1=150,  y1=-150, x2=50,  y2=-50, stroke="chocolate", stroke_width=1)
document["imagen"] <= svg.line(x1=-150, y1=150,  x2=-50, y2=50,  stroke="chocolate", stroke_width=1)
document["imagen"] <= svg.line(x1=150,  y1=150,  x2=50,  y2=50,  stroke="chocolate", stroke_width=1)
  </script>
</head>

<body onload="brython()">
  <svg version="1.1" xmlns="http://www.w3.org/2000/svg"
    width="320" height="320" viewBox="-160 -160 320 320"
    style="border: black 1px solid" id="imagen">
  </svg>
</html>
SVG Brython (1) 2 5 
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <title>SVG (1) 2 5. Ejercicios SVG (1). Brython. Python. Bartolomé Sintes Marco</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython_stdlib.js"></script>
  <script type="text/python3">
from browser import document
import browser.svg as svg

document["imagen"] <= svg.line(x1=-150, y1=50,  x2=150, y2=50,   stroke="steelblue", stroke_width=1)
document["imagen"] <= svg.line(x1=-150, y1=-50, x2=150, y2=-50,  stroke="steelblue", stroke_width=1)
document["imagen"] <= svg.line(x1=-50,  y1=150, x2=-50, y2=-150, stroke="steelblue", stroke_width=1)
document["imagen"] <= svg.line(x1=50,   y1=150, x2=50,  y2=-150, stroke="steelblue", stroke_width=1)
  </script>
</head>

<body onload="brython()">
  <svg version="1.1" xmlns="http://www.w3.org/2000/svg"
    width="320" height="320" viewBox="-160 -160 320 320"
    style="border: black 1px solid" id="imagen">
  </svg>
</html>
SVG Brython (1) 2 6 
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <title>SVG (1) 2 6. Ejercicios SVG (1). Brython. Python. Bartolomé Sintes Marco</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython_stdlib.js"></script>
  <script type="text/python3">
from browser import document
import browser.svg as svg

document["imagen"] <= svg.line(x1=-50, y1=-150, x2=150,  y2=50,  stroke="teal", stroke_width=1)
document["imagen"] <= svg.line(x1=50,  y1=-150, x2=-150, y2=50,  stroke="teal", stroke_width=1)
document["imagen"] <= svg.line(x1=-50, y1=150,  x2=150,  y2=-50, stroke="teal", stroke_width=1)
document["imagen"] <= svg.line(x1=50,  y1=150,  x2=-150, y2=-50, stroke="teal", stroke_width=1)
  </script>
</head>

<body onload="brython()">
  <svg version="1.1" xmlns="http://www.w3.org/2000/svg"
    width="320" height="320" viewBox="-160 -160 320 320"
    style="border: black 1px solid" id="imagen">
  </svg>
</html>

Gráficos SVG Brython (1) - 3 - Rectángulos, polígonos

SVG Brython (1) 3 1 
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <title>SVG (1) 3 1. Ejercicios SVG (1). Brython. Python. Bartolomé Sintes Marco</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython_stdlib.js"></script>
  <script type="text/python3">
from browser import document
import browser.svg as svg

document["imagen"] <= svg.rect(x=0,   y=75, width=150, height=150, stroke="black", stroke_width=1, fill="white")
document["imagen"] <= svg.rect(x=150, y=75, width=150, height=150, stroke="black", stroke_width=1, fill="white")
document["imagen"] <= svg.circle(cx=75,  cy=150, r=50, stroke="black", stroke_width=1, fill="white")
document["imagen"] <= svg.circle(cx=225, cy=150, r=50, stroke="black", stroke_width=1, fill="white")
  </script>
</head>

<body onload="brython()">
  <svg version="1.1" xmlns="http://www.w3.org/2000/svg"
    width="320" height="320" viewBox="-10 -10 320 320"
    style="border: black 1px solid" id="imagen">
  </svg>
</html>
SVG Brython (1) 3 2 
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <title>SVG (1) 3 2. Ejercicios SVG (1). Brython. Python. Bartolomé Sintes Marco</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython_stdlib.js"></script>
  <script type="text/python3">
from browser import document
import browser.svg as svg

document["imagen"] <= svg.rect(x=0,  y=0,   width=300, height=300, stroke="blue", stroke_width=1, fill="white")
document["imagen"] <= svg.rect(x=50, y=100, width=200, height=200, stroke="blue", stroke_width=1, fill="white")
document["imagen"] <= svg.circle(cx=150, cy=50, r=50, stroke="blue", fill="white")
  </script>
</head>

<body onload="brython()">
  <svg version="1.1" xmlns="http://www.w3.org/2000/svg"
    width="320" height="320" viewBox="-10 -10 320 320"
    style="border: black 1px solid" id="imagen">
  </svg>
</html>
SVG Brython (1) 3 3 
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <title>SVG (1) 3 3. Ejercicios SVG (1). Brython. Python. Bartolomé Sintes Marco</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython_stdlib.js"></script>
  <script type="text/python3">
from browser import document
import browser.svg as svg

document["imagen"] <= svg.circle(cx=75,  cy=75,  r=75, stroke="orangered", stroke_width=1, fill="white")
document["imagen"] <= svg.circle(cx=225, cy=75,  r=75, stroke="orangered", stroke_width=1, fill="white")
document["imagen"] <= svg.circle(cx=75,  cy=225, r=75, stroke="orangered", stroke_width=1, fill="white")
document["imagen"] <= svg.circle(cx=225, cy=225, r=75, stroke="orangered", stroke_width=1, fill="white")
document["imagen"] <= svg.rect(x=75, y=75, width=150, height=150, stroke="orangered", stroke_width=1, fill="none")
  </script>
</head>

<body onload="brython()">
  <svg version="1.1" xmlns="http://www.w3.org/2000/svg"
    width="320" height="320" viewBox="-10 -10 320 320"
    style="border: black 1px solid" id="imagen">
  </svg>
</html>
SVG Brython (1) 3 4 
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <title>SVG (1) 3 4. Ejercicios SVG (1). Brython. Python. Bartolomé Sintes Marco</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython_stdlib.js"></script>
  <script type="text/python3">
from browser import document
import browser.svg as svg

document["imagen"] <= svg.polygon(points="  0,150  75,75 150,150  75,225", stroke="indigo", stroke_width=1, fill="white")
document["imagen"] <= svg.polygon(points="150,150 225,75 300,150 225,225", stroke="indigo", stroke_width=1, fill="white")
document["imagen"] <= svg.circle(cx=150, cy=75,  r=50, stroke="indigo", stroke_width=1, fill="white")
document["imagen"] <= svg.circle(cx=150, cy=225, r=50, stroke="indigo", stroke_width=1, fill="white")
  </script>
</head>

<body onload="brython()">
  <svg version="1.1" xmlns="http://www.w3.org/2000/svg"
    width="320" height="320" viewBox="-10 -10 320 320"
    style="border: black 1px solid" id="imagen">
  </svg>
</html>
SVG Brython (1) 3 5 
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <title>SVG (1) 3 5. Ejercicios SVG (1). Brython. Python. Bartolomé Sintes Marco</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython_stdlib.js"></script>
  <script type="text/python3">
from browser import document
import browser.svg as svg

document["imagen"] <= svg.polygon(points="  0,100 100,0 300,200 200,300", stroke="seagreen", stroke_width=1, fill="none")
document["imagen"] <= svg.polygon(points="300,100 200,0   0,200 100,300", stroke="seagreen", stroke_width=1, fill="none")
document["imagen"] <= svg.circle(cx=150, cy=150,  r=50, stroke="seagreen", stroke_width=1, fill="none")
  </script>
</head>

<body onload="brython()">
  <svg version="1.1" xmlns="http://www.w3.org/2000/svg"
    width="320" height="320" viewBox="-10 -10 320 320"
    style="border: black 1px solid" id="imagen">
  </svg>
</html>
SVG Brython (1) 3 6 
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <title>SVG (1) 3 6. Ejercicios SVG (1). Brython. Python. Bartolomé Sintes Marco</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/brython@3.9.0/brython_stdlib.js"></script>
  <script type="text/python3">
from browser import document
import browser.svg as svg

document["imagen"] <= svg.polygon(points="0,150 150,0 300,150 150,300", stroke="sienna", stroke_width=1, fill="none")
document["imagen"] <= svg.circle(cx=30,  cy=30,  r=30, stroke="sienna", stroke_width=1, fill="white")
document["imagen"] <= svg.circle(cx=270, cy=30,  r=30, stroke="sienna", stroke_width=1, fill="white")
document["imagen"] <= svg.circle(cx=150, cy=90,  r=30, stroke="sienna", stroke_width=1, fill="white")
document["imagen"] <= svg.circle(cx=90,  cy=150, r=30, stroke="sienna", stroke_width=1, fill="white")
document["imagen"] <= svg.circle(cx=210, cy=150, r=30, stroke="sienna", stroke_width=1, fill="white")
document["imagen"] <= svg.circle(cx=150, cy=210, r=30, stroke="sienna", stroke_width=1, fill="white")
document["imagen"] <= svg.circle(cx=30,  cy=270, r=30, stroke="sienna", stroke_width=1, fill="white")
document["imagen"] <= svg.circle(cx=270, cy=270, r=30, stroke="sienna", stroke_width=1, fill="white")
  </script>
</head>

<body onload="brython()">
  <svg version="1.1" xmlns="http://www.w3.org/2000/svg"
    width="320" height="320" viewBox="-10 -10 320 320"
    style="border: black 1px solid" id="imagen">
  </svg>
</html>