SVG 04
======
Reeksen maken met range met stapgrootte
---------------------------------------
We zagen reeds dat we met range reeksen konden maken. De eerste parameter van de functie range()
gaf de startwaarde aan, de tweede parameter van de functie range() gaf de stop-waarde aan. Er is
echter ook een derde parameter die de stapgrootte aangeeft. Een voorbeeld::
for x in range(0,100, 10):
for y in range(0, 100, 10):
print(x, y)
Voer dit programma uit, en bekijk de uitvoer.
Opgave 18
---------
Pas je programma uit opgave 17 aan, zodanig dat cirkels getekend worden op een regelmatige afstand
van elkaar met behulp van de range functie met 3 parameters: ``range(0, 300, 30)`` voor cx, ``range(0, 200, 20)`` voor cy.
Lijsten in lijsten
------------------
Lijsten in Python kunnen ook weer andere lijsten bevatten::
landen = [["België", 165880, 11.5], "Nederland", 188876, 17.4]
Bovenstaande lijst bevat twee lijsten, en deze lijsten bevatten telkens drie elementen: een string, een
integer en een float.
Je mag lijsten ook over meerdere regels splitsen, zoals in dit voorbeeld::
landen = [
["België", 165880, 11.5],
["Nederland", 188876, 17.4],
]
Bij gebruik van een “for-loop” kan je de elementen uit je sublijst rechtstreeks toekennen aan variabelen
in de loop-constructie zelf::
for naam, besmettingen, inwoners in landen:
print(naam, besmettingen, inwoners)
Opgave 19
---------
Pas je programma uit opgave 17 aan, zodanig dat cirkels voor ieder land getekend worden, waarbij de
straal van de cirkel het aantal inwoners van het land representeert. Gebruik de voorlaatste en laatste
elementen uit de lijst als x- en y-coördinaten van je cirkels::
landen = [
["België", 165880, 11.5, 100, 125],
["Nederland", 188876, 17.4, 200, 125],
["Duitsland", 335679, 83.2, 300, 125],
]
Kleuren in SVG
--------------
Tot nu toe gebruikte we de namen van kleuren om de SVG-elementen in te kleuren::
Aangezien het aantal namen voor kleuren beperkt is, kan je ook op een andere manier kleuren
uitdrukken. In SVG kan je de functie :func:`rgb()` gebruiken, die je als parameters kleurwaarden voor rood,
groen en blauw dient door te geven. Onderstaand voorbeeld toont achtereenvolgens een rode, groene,
blauwe en gele cirkel (combinatie van rood en groen)::
In het bovenstaande voorbeeld werd telkens de waarde 255 gebruikt: Dit is de maximale
kleurintensiteit, met andere woorden de meest heldere versie van de kleur. Lagere waardes geven
minder intensiteit. 0 komt overeen met zwart. In onderstaand voorbeeld zien we achtereenvolgens een
zeer heldere rode cirkel, een heldere cirkel, een donkerrode cirkel en een zwarte cirkel::
< circle cx = "0" cy = "125" r = "50" fill = "rgb(255,0,0)" />
< circle cx = "100" cy = "125" r = "50" fill = "rgb(200,0,0)" />
< circle cx = "200" cy = "125" r = "50" fill = "rgb(60,0,0)" />
< circle cx = "300" cy = "125" r = "50" fill = "rgb(0,0,0)" />
Opgave 20
---------
Pas je programma uit opgave 19 aan, zodanig dat de kleur van de cirkels het aantal besmettingen in het
land representeert::
landen = [
["België", 165880, 11.5, 100, 125],
["Nederland", 188876, 17.4, 200, 125],
["Duitsland", 335679, 83.2, 300, 125],
]
Tekst in SVG
------------
SVG laat ook toe om tekst te tonen in je tekening. Onderstaande code toont de tekst “COVID-19” op
coördinaten (20, 35)::
COVID-19
Opgave 21
---------
Pas je programma uit opgave 20 aan, zodanig dat de namen van de landen bij de cirkels getoond
worden.
Transparantie
-------------
Verder kan je ook transparante figuren gebruiken door de :func:`rgba()` functie te gebruiken. Hierbij geeft de
laatste parameter de transparantie aan. Onderstaand voorbeeld toont een half-transparante cirkel::
Onderstaand voorbeeld toont een bijna volkomen doorzichtige cirkel::
Opgave 22
---------
Pas je programma uit opgave 21 aan, zodanig dat de cirkels half-transparant getoond worden. Dit maakt
overlappende cirkels makkelijker zichtbaar.
Opgave 23
---------
In onderstaande lijst werden de x- en y-coördinaten bijgewerkt. Gebruik deze coördinaten om de positie
van de cirkels te bepalen. Voeg Japan en Angola toe aan de lijst en verifieer dat de plot overeenkomt
met je verwachtingen::
landen = [
["België", 165880, 11.5, 50.51, 4.21],
["Nederland", 188876, 17.4, 52.22, 4.53],
["Duitsland", 335679, 83.2, 52.31, 13.23],
]