Wo kommen nicht die in Raphael Javascript versetzt

Question

Ich mag die Raphael Javascript-Bibliothek wirklich, die für den Umgang mit SVG mit Javascript sehr nützlich ist.

Allerdings gibt es einen Offset-Wert, der zu dem erzeugten SVG-Code hinzugefügt wird, die ich nicht verstehe. Weiß jemand, wo kommt es her und wie sie vermieden werden?

Hier ist mein JS-Code:

var paper = Raphael("canvas", 510, 510);
paper.clear();
paper.rect(0, 0, 500, 500, 10).attr({fill: "#fff", stroke: "black"});

Der erzeugte SVG-Code ist

<div id="canvas">
    <svg width="510" height="510">
        <desc>Created with Raphaël</desc>
        <defs/>
        <rect x="0.5" y="0.5" width="500" height="500" r="10" rx="10" ry="10" fill="#ffffff" stroke="#000000"/>
    </svg>
</div>          

Warum das x- und y-Attribut des rect sind 0,5 und nicht 0?

Update: Es scheint, dass die Werte mit dem Code gerundet werden unter:

var round = function (num) {
    return +num + (~~num === num) * .5;
}; 

Kennt jemand den Grund?

Answer 1

Der Ausdruck +num + (~~num === num) * .5 sagt:

1. +num: den Wert der Variablen num als Zahl erhalten;
2. (~~num === num): return true, wenn der bitweise-NOT des bitwise_NOT des Wertes der Variablen num (die mit jeder Bruchkomponente entfernt, das entspricht Math.floor(num) num) genau gleich den Wert der Variablen num ist: das heißt, Rückkehr true wenn num eine ganze zahl ist, false sonst;
3. das Ergebnis von Schritt 1 zu dem Ergebnis von Schritt 2, um dadurch den booleschen Wertes von Schritt 2 in einen numerischen Wert zurückgegeben Zwingen: für den Fall, wenn die variable num den numerischen Wert 0 hat, wird dies in 1 Ergebnis;
4. multiplizieren Sie das Ergebnis aus Schritt 3 durch 0,5.

So wir das Ergebnis (0 + 1) * 0.5 erhalten, die 0,5 ist.

Mit anderen Worten, wird der Code sagen: „Für alle ganzen Zahlen, mit 0,5, für alle Nicht-Zahlen, nichts hinzuzufügen.“

Dies hat einige interessante Ergebnisse, deren Zweck es ist unklar, gelinde gesagt; Sehen Sie seine Anwendung auf die folgenden Werte:

1. 0 -> 0.5;
2. 0.1 -> 0.1;
3. 0.4 -> 0.4;
4. 0.5 -> 0.5;
5. 0.9 -> 0.9;
6. 1.0 -> 1.5;
7. 1.1 -> 1.1;

... und so weiter.

In Bezug auf Warum sie dies tun: Ich habe wirklich keine Ahnung hat. FWIW Ich habe große Mengen von SVG, sowohl statisch als auch dynamisch erzeugt, arbeiten gerne auf Firefox, Safari und Opera, und nichts davon hat jemals diese Art von Albernheit erforderlich.

Wenn jemand jemals den Grund dafür findet heraus, ich würde es gerne wissen: -)

Answer 2

Der Grund kann die für die Zeichnung Koordinatensystem sein: eine 1px schwarze Linie bei x gezogen = 1,0 halb links von 1,0 und halb rechts davon, in einer 2px grauen Linie führte. Mit dem 0.5px Offset ist die Linie zwischen 1,0 und 2,0.