Viewbox er en attribut, der ofte bruges til oprettelse af SVG-former. Hvis du tænker på dokumentet som et lærred, er visningsboksen en del af det lærred, du vil seeren skal se. Selvom siden kan dække hele computerskærmen, kan figuren kun eksistere i en tredjedel af det samlede.
Viewbox giver dig mulighed for at fortælle parseren at zoome ind på den tredje. Det eliminerer det ekstra hvide rum. Tænk på visningsboksen som en virtuel tilgang til at beskære et billede. Uden den vises din grafik en tredjedel af dens faktiske størrelse.
Viewbox værdier
For at beskære et billede skal du oprette punkter på billedet for at få nedskæringerne. Det samme gælder, når du bruger attributten til visning af boks. Værdisindstillingerne for visningsboksen inkluderer:
Minx-Begyndelsen x koordinatMiny-Begyndelsen y koordinatbredde-Bredden af viewboxenhøjde-Højde i visningsboksen
Syntaxen for visning af boksværdier er:
viewBox = "0 0 200 150"
Forsæt ikke bredden og højden af visningsboksen med bredden og den højde, du har angivet for SVG-dokumentet. Når du opretter en SVG-fil, er en af de første værdier, du opretter, dokumentbredden og højden. Dokumentet er et lærred. Visningsboksen kan dække hele lærredet eller bare en del af det.
Denne visning boks dækker hele siden.
Denne visning boks dækker halvdelen af siden starter i øverste højre hjørne.
Din form har også højde- og breddeopgaver.
Det er et dokument, der dækker 800 x 400 px med en viewbox, der starter i øverste højre hjørne og udvider halvdelen af siden. Formen er et rektangel, der begynder i øverste højre hjørne af visningsboksen og bevæger 100 px til venstre og 50 px ned.
Hvorfor Indstil en Viewbox?
SVG gør meget mere end blot tegne en form. Det kan skabe en figur oven på en anden for en skyggeeffekt. Det kan forvandle en form, så den glider i en retning. For de avancerede filtre skal du forstå og bruge visningsboksen attributtet.
