Exámenes - Distribución de dado

En este ejercicio se debe crear un programa que dibuje una gráfica de distribución de los valores obtenidos al lanzar un dado.

Distribución de dado - Comentarios

Distribución de dado - Ejemplos de código HTML

    <p>
      <button type="submit" name="accion" value="dado">
        <img src="img/dados/3.svg" alt="3" width="100">
      </button>
      <svg version="1.1" xmlns="http://www.w3.org/2000/svg"
           width="300" height="320" viewBox="-20 -140 150 160" style="font-size: 10px; border: black 1px solid;">
        <line x1="-10" y1="1" x2="125" y2="1" stroke="black" stroke-width="2" />
        <line x1="-1" y1="10" x2="-1" y2="-130" stroke="black" stroke-width="2" />
        <text x="10" y="15" text-anchor="middle">1</text>
        <text x="30" y="15" text-anchor="middle">2</text>
        <text x="50" y="15" text-anchor="middle">3</text>
        <text x="70" y="15" text-anchor="middle">4</text>
        <text x="90" y="15" text-anchor="middle">5</text>
        <text x="110" y="15" text-anchor="middle">6</text>

        <rect x="0" y="-0" width="20" height="0" fill="lightgray" stroke="black" stroke-width="1" />
        <rect x="20" y="-0" width="20" height="0" fill="lightgray" stroke="black" stroke-width="1" />
        <rect x="40" y="-10" width="20" height="10" fill="lightgray" stroke="black" stroke-width="1" />
        <rect x="60" y="-0" width="20" height="0" fill="lightgray" stroke="black" stroke-width="1" />
        <rect x="80" y="-0" width="20" height="0" fill="lightgray" stroke="black" stroke-width="1" />
        <rect x="100" y="-0" width="20" height="0" fill="lightgray" stroke="black" stroke-width="1" />

        <text x="-10" y="-45" text-anchor="middle">5</text>
        <line x1="0" y1="-50" x2="125" y2="-50" stroke="black" stroke-width="1" stroke-dasharray="4 4" />
        <text x="-10" y="-95" text-anchor="middle">10</text>
        <line x1="0" y1="-100" x2="125" y2="-100" stroke="black" stroke-width="1" stroke-dasharray="4 4" />
      </svg>
    </p>
        <rect x="0" y="-10" width="20" height="10" fill="lightgray" stroke="black" stroke-width="1" />
        <rect x="20" y="-20" width="20" height="20" fill="lightgray" stroke="black" stroke-width="1" />
        <rect x="40" y="-30" width="20" height="30" fill="lightgray" stroke="black" stroke-width="1" />
        <rect x="60" y="-40" width="20" height="40" fill="lightgray" stroke="black" stroke-width="1" />
        <rect x="80" y="-50" width="20" height="50" fill="lightgray" stroke="black" stroke-width="1" />
        <rect x="100" y="-60" width="20" height="60" fill="lightgray" stroke="black" stroke-width="1" />