Perché la larghezza di ictus SVG: 1 è trasparente?

Question

Sto creando grafici azionari con SVG e sto riscontrando un problema quando ho impostato la larghezza della corsa dei miei elementi del percorso su 1. Invece di rendere le linee più strette, lo rende solo le stesse dimensioni della larghezza della corsa: 2 ma leggermente trasparente. Non posso pubblicarne un'immagine perché non ho abbastanza punti di reputazione ...

Il mio tag SVG sembra così:

<div style="height:300px; width:400px; overflow:hidden">
<svg style="position:relative" height="10000" width="10000" version="1.1" xmlns="http://www.w3.org/2000/svg">
</svg>
</div>

E sto aggiungendo elementi del percorso usando dinamicamente JavaScript/jQuery:

var shape = document.createElementNS("http://www.w3.org/2000/svg", "path");
$(shape).attr({"d":"...",
               "fill":"none",
               "stroke":color,
               "stroke-width":"1"});
$("svg").append(shape);

Ho lasciato fuori il valore per il percorso d attributo come era un po 'lungo. Anche, color è una variabile di stringa che viene determinata in anticipo come "verde", "rosso" o "nero".

C'è qualcosa di sbagliato nel mio codice che sta causando questo o è un problema diverso?