How to use the raphael.pathIntersection function in raphael

To help you get started, we’ve selected a few raphael examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github jacky6024 / flowdesigner / src / Canvas.js View on Github external
function dragEnd (event) {
            const currentTool=context.currentTool;
            if(!currentTool || !(currentTool instanceof SelectTool)){
                return;
            }
            const bounds = selectionBox.getBBox();
            selectionBox.remove();
            context.startSelect();
            const allFigures=context.allFigures;
            let connectionSelections=[],figureSelections=[];
            for (let i=0 ;i < allFigures.length; i++) {
                let figure=allFigures[i];
                if(figure instanceof Connection){
                    let selectionPath='M'+bounds.x+' '+bounds.y+ ' L'+(bounds.x+bounds.width)+' '+bounds.y+' L'+(bounds.x+bounds.width)+' '+(bounds.y+bounds.height)+' L'+bounds.x+' '+(bounds.y+bounds.height)+' L'+bounds.x+' '+bounds.y;
                    let figurePath=figure.path.attr('path');
                    let dot=Raphael.pathIntersection(figurePath,selectionPath);
                    if(dot.length>0){
                        connectionSelections.push(figure);
                    }
                }else{
                    let element=figure.rect;
                    let figureBounds = element.getBBox();
                    if (figureBounds.x >= bounds.x && figureBounds.x <= bounds.x2 || figureBounds.x2 >= bounds.x && figureBounds.x2 <= bounds.x2) {
                        if (figureBounds.y >= bounds.y && figureBounds.y <= bounds.y2 || figureBounds.y2 >= bounds.y && figureBounds.y2 <= bounds.y2) {
                            figureSelections.push(figure);
                        }
                    }
                }
            }
            if(figureSelections.length>0){
                figureSelections.forEach((figure,i)=>{
                    context.addSelection(figure);
github jacky6024 / flowdesigner / src / Connection.js View on Github external
let toFigurePathInfo=this.to.getPathInfo(true);
                dot=Raphael.pathIntersection(toFigurePathInfo,lastLine);
                if(dot.length>0){
                    x2=dot[0].x,y2=dot[0].y;
                    if(x10){
                x1=dot[0].x,y1=dot[0].y;
                line1StartPoint='M'+dot[0].x+' '+dot[0].y;
            }
            if(this.to){
                let lastLine='M'+x2+' '+y1+' L'+x2+' '+y2;
                let toFigurePathInfo=this.to.getPathInfo(true);
                dot=Raphael.pathIntersection(toFigurePathInfo,lastLine);
                if(dot.length>0){
                    x2=dot[0].x,y2=dot[0].y;
                    if(y1
github jacky6024 / flowdesigner / src / Connection.js View on Github external
_buildFromFigureIntersetion(path,c){
        if(c){
            const fromRect=this.from.rect;
            let x1=fromRect.attr('x'),y1=fromRect.attr('y'),w1=fromRect.attr('width'),h1=fromRect.attr('height');
            x1+=w1/2,y1+=h1/2-10;
            let x=path.x,y=path.y;
            path=[];
            path.push(['M',x1,y1]);
            path.push(['L',x,y]);
        }
        const fromFigurePathInfo=this.from.getPathInfo(true);
        let dot=Raphael.pathIntersection(fromFigurePathInfo,path);
        if(dot.length>0){
            let p={x:path[1][1],y:path[1][2]};
            return {x:dot[0].x,y:dot[0].y};
        }
        return null;
    }
    _buildToFigureIntersetion(path,c){
github jacky6024 / flowdesigner / src / Connection.js View on Github external
_buildCurveLinePathInfo(){
        const fromRect=this.from.rect;
        let x1=fromRect.attr('x'),y1=fromRect.attr('y'),w1=fromRect.attr('width'),h1=fromRect.attr('height');
        x1+=w1/2,y1+=h1/2-10;
        let x2=this.endX,y2=this.endY,w2=0,h2=0,pathInfo=null;
        if(this.to){
            const toRect=this.to.rect;
            x2=toRect.attr('x'),y2=toRect.attr('y'),w2=toRect.attr('width'),h2=toRect.attr('height');
            x2+=w2/2,y2+=h2/2-10;
        }
        const fromFigurePathInfo=this.from.getPathInfo(true);
        let dis1=Math.abs((x1+w1/2)-(x2-w2/2)),dis2=Math.abs((y1+h1/2)-(y2-h2/2));
        let line1StartPoint='M'+x1+' '+y1;
        if(dis1>=dis2){
            let firstLine=line1StartPoint+' L'+x2+' '+y1;
            let dot=Raphael.pathIntersection(fromFigurePathInfo,firstLine);
            if(dot.length>0){
                x1=dot[0].x,y1=dot[0].y;
                line1StartPoint='M'+dot[0].x+' '+dot[0].y;
            }
            if(this.to){
                let lastLine='M'+x1+' '+y2+' L'+x2+' '+y2;
                let toFigurePathInfo=this.to.getPathInfo(true);
                dot=Raphael.pathIntersection(toFigurePathInfo,lastLine);
                if(dot.length>0){
                    x2=dot[0].x,y2=dot[0].y;
                    if(x1
github jacky6024 / flowdesigner / src / Connection.js View on Github external
}
                }
            }
            let dx=x2-x1,dy=y2-y1;
            pathInfo=line1StartPoint+' L'+(x1+dx/2)+' '+y1+' L'+(x1+dx/2)+' '+(y1+dy)+' L'+x2+' '+y2;
        }else{
            let firstLine=line1StartPoint+' L'+x1+' '+y2;
            let dot=Raphael.pathIntersection(fromFigurePathInfo,firstLine);
            if(dot.length>0){
                x1=dot[0].x,y1=dot[0].y;
                line1StartPoint='M'+dot[0].x+' '+dot[0].y;
            }
            if(this.to){
                let lastLine='M'+x2+' '+y1+' L'+x2+' '+y2;
                let toFigurePathInfo=this.to.getPathInfo(true);
                dot=Raphael.pathIntersection(toFigurePathInfo,lastLine);
                if(dot.length>0){
                    x2=dot[0].x,y2=dot[0].y;
                    if(y1
github jacky6024 / flowdesigner / src / Connection.js View on Github external
_buildToFigureIntersetion(path,c){
        if(c){
            const toRect=this.to.rect;
            let x2=toRect.attr('x'),y2=toRect.attr('y'),w2=toRect.attr('width'),h2=toRect.attr('height');
            x2+=w2/2,y2+=h2/2-10;
            let x=path.x,y=path.y;
            path=[];
            path.push(['M',x,y]);
            path.push(['L',x2,y2]);
        }
        const toFigurePathInfo=this.to.getPathInfo(true);
        let dot=Raphael.pathIntersection(toFigurePathInfo,path);
        if(dot.length>0){
            let p={x:path[0][1],y:path[0][2]};
            return {x:dot[0].x,y:dot[0].y};
        }
        return null;
    }