Raphael javascript中的偏移量在哪里？

Question

我非常喜欢Raphael Javascript库,它对于使用javascript处理SVG非常有用.

但是有一个偏移值被添加到我不理解的生成的svg代码中.有谁知道它来自哪里以及如何避免它？

这是我的JS代码:

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

生成的SVG代码是

<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>          

为什么rect的x和y属性是0.5而不是0？

更新:似乎使用以下代码舍入值:

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

有人知道原因吗？

Answer 1

表达的+num + (~~num === num) * .5是:

1. +num:将变量的值num作为数字;
2. (~~num === num):如果变量值的bitwise_NOT的bitwise-NOT num(删除了任何小数组件的num,相当于Math.floor(num))完全等于变量num的值,则返回true :即,true如果num是整数,则返回,false否则;
3. 将步骤1的结果添加到步骤2的结果中,从而将步骤2返回的布尔值强制转换为数值:对于变量num具有数值0的情况,这将导致1;
4. 将步骤3的结果乘以0.5.

所以我们得到的结果(0 + 1) * 0.5是0.5.

换句话说,代码说"对于所有整数,添加0.5;对于所有非整数,不添加任何内容."

这有一些有趣的结果,其目的至少可以说是模糊的; 考虑其应用于以下值:

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;

...等等.

至于为什么他们这样做:我真的没有最微弱的想法.FWIW我有大量的静态和动态创建的SVG,在Firefox,Safari和Opera上工作愉快,并且它们都不需要这种愚蠢.

如果有人发现了这个原因,我很想知道:-)