在画布上圈和模糊

时间:2014-01-15 11:39:04

标签: jquery canvas geometry blur

我想使用jcanvas和模糊。 (http://calebevans.me/http://blurjs.com/

这是我的剧本:http://jsfiddle.net/VDC5h/1/

var xStart;
var yStart;
var xStop;
var yStop;
var i=0;
var d=0;
$('#obrazek').click( function(e) {
    if(i==1)
    {
        i=2;
    }
    if(i==0)
    {
        var posX = $(this).offset().left, posY = $(this).offset().top;
        xStart=(e.pageX - posX);
        yStart=(e.pageY - posY);
        i=1;
    }
});
$("#obrazek").on( "mousemove", function(e) {  
    if(i==1)
    {
        var posX = $(this).offset().left, posY = $(this).offset().top;
        xStop=(e.pageX - posX);
        yStop=(e.pageY - posY); 
        $('canvas').drawArc({
            fillStyle: '#fff',
            x: xStart, 
            y: yStart,
            radius: d+1});
        d=Math.sqrt(Math.pow(xStart-xStop,2)+Math.pow(yStart-yStop,2))
        $('canvas').drawArc({
            fillStyle: '#000',
            x: xStart, 
            y: yStart,
            radius: d
        });
        $('#d').html(d);                                
    }
});

如何模糊圈子?我不想要影子:How to draw a blurry circle on HTML5 canvas?

我试过了:

                            $('canvas').drawArc({
                                fillStyle: '#000',
                                x: xStart, 
                                y: yStart,
                                radius: d
                              }).blurjs({
    source: 'body',
    radius: 10
});

当然不起作用:(

0 个答案:

没有答案