2013-07-11 6 views
6

Attualmente sto cercando di disegnare alcuni elementi grafici in svg, il formato della carta è A4, 1 unità logica corrisponde a 1 mm. Così ho impostato il viewport su 297mmx210mm, viewbox come 297x210. Il problema ora è che la larghezza del tratto del grafico che disegno non è più 1 pixel. Ad esempio,Disegna un grafico di larghezza del tratto di 1 pixel in un disegno svg in A4

<!DOCTYPE html> 
<html> 
<body> 
<svg width="297mm" height="210mm" viewBox='0 0 297 210' style="border: 1px solid #cccccc;"> 
    <path stroke="black" fill="none" stroke-width='1' d='M 10 10 L 60 10'/> 
    <path stroke="black" fill="none" stroke-width='1px' d='M 10 30 L 60 30'/> 
    <path stroke="black" fill="none" d='M 10 50 L 60 50'/> 
</svg> 
</body> 
</html> 

Questi 3 linee sopra descritto presentano esattamente la larghezza della stessa linea anche a impostare la corsa-larghezza "1px". È ancora possibile disegnare una linea di larghezza di 1 pixel in tale impostazione?

+0

stroke-width = '0.762' funziona? – Orangepill

+1

non penso che la carta abbia pixel. utilizzare le unità sullo schermo o stampare la svg e guardare le linee sottili appaiono ... – dandavis

+0

di default 1mm = 3.779527559 pixel, quindi se imposto larghezza del tratto = '0.26458' la larghezza della linea è in realtà 1 pixel. Ma per la seconda riga dal momento che ho già impostato la larghezza del tratto come "1px". Dovrebbe essere disegnato con una larghezza di 1 pixel, giusto? – user2469554

risposta

8

Prova questo:

<path stroke="black" fill="none" stroke-width='1px' d='M 10 30 L 60 30' vector-effect="non-scaling-stroke"/> 

vector-effect="non-scaling-stroke" è una SVG 1.2 caratteristica piccolo che costringe il larghezza del tratto di essere esattamente ciò che si specifica, non importa quale sia il ridimensionamento o unità le trasformazioni sono a tutti gli effetti. È supportato da FF e Chrome (forse altri) ma non da IE (finora) purtroppo. Se riesci a conviverci, allora è la soluzione più semplice al tuo problema.

+0

È grandioso! Grazie per l'aiuto. – user2469554