SVG tagliato o con troppo spazio vuoto: correggere il viewBox
Trova la causa di bordi SVG tagliati e margini eccessivi. Controlla viewBox, spessori e maschere prima di modificare o ritracciare un logo già corretto.
Risposta rapida
Un SVG tagliato o minuscolo ha spesso un problema di area di disegno. Controlla viewBox, trasformazioni, maschere e spessori. Adatta la pagina al contenuto in un editor vettoriale, mantenendo i margini necessari. Riapri l’esportazione prima di eliminare o ritracciare forme che sono già corrette.
Che cosa controlla il viewBox
I quattro valori indicano x minimo, y minimo, larghezza e altezza nelle coordinate del disegno. Non coincidono necessariamente con le dimensioni CSS visualizzate. Cambiare soltanto la larghezza esterna può ingrandire la finestra senza sistemare i limiti interni errati.
| Sintomo | Possibile causa | Controllo |
|---|---|---|
| Orecchio o lettera tagliata | Disegno fuori dai limiti | viewBox e posizione |
| Logo piccolo con margine enorme | Pagina troppo grande | Adattamento al disegno |
| Contorno spesso troncato | Spessore escluso dai limiti | Margine per tratti ed effetti |
| Editor corretto, export errato | Maschera o ritaglio | Struttura esportata |
Correggere senza deformare
- Duplica l’originale e aprilo in un editor vettoriale.
- Seleziona il disegno visibile. Cerca oggetti lontani che ingrandiscono artificialmente la selezione.
- Adatta la pagina alle forme desiderate, includendo margini intenzionali e spessori dei contorni.
- Verifica maschere e percorsi di ritaglio. Un viewBox più grande non elimina automaticamente questi vincoli.
- Esporta nuovamente SVG e apri quel file nel browser a larghezze diverse.
Non copiare valori universali
Se il disegno si estende davvero da x=20 a 220 e da y=30 a 130, 20 30 200 100 descrive quel rettangolo. Aggiungi margine quando contorni o effetti sporgono. Non incollare questi numeri in un altro file senza misurare: ogni documento ha coordinate e trasformazioni proprie.
Usa il controllo SVG per esaminare la struttura. Dopo la correzione visiva, l’ottimizzatore SVG riduce marcatura inutile, ma non ripara automaticamente la tavola. Mantieni il viewBox e confronta il rendering finale.
Verifiche conclusive
- Nessuna forma importante tocca un ritaglio involontario.
- I margini trasparenti sono voluti.
- Estremità delle linee e curve restano visibili.
- Le proporzioni sono corrette sullo schermo mobile.
- Il file esportato è stato controllato fuori dall’editor.
Domande frequenti
width e height eliminano i margini?
Non necessariamente. Regolano la dimensione mostrata, mentre le coordinate interne possono includere ancora molto spazio vuoto.
Devo vettorializzare nuovamente il logo?
Non se i tracciati sono validi. Correggi prima i limiti del documento. Ritracciare modifica inutilmente la geometria e può mantenere gli stessi margini indesiderati.