向量交点坐标公式_js判断向量叉点 并求出交点坐标

判断线段相交并求交点

.wrapper{width: 500px;height: 500px;margin:0 auto;border: 1px solid #000000;}

.content{position: relative;height: 500px;}

.dot{position: absolute;width:1px;height: 1px;overflow: hidden;font-size:0;line-height: 0; background: #333;}

判断相交并求交点

//*********定义加载模块方法 start **************//

(function(window, undefined) {if(window.define) {return}functionisFunction(obj) {return Object.prototype.toString.call(obj) === "[object Function]"}var MM ={};var initModuleName = "initRun";functionrequire(name) {if (!MM[name]) {throw new Error("Module " + name + " is not defined.")

}var module =MM[name];if (module.inited === false) {

runModule(name)

}returnmodule.ret

}functionrunModule(name) {var exports ={};var module =MM[name];if(isFunction(MM[name].factory)) {var ret =MM[name].factory.apply(undefined, [require, exports, undefined]);

module.ret= ret === undefined ?exports : ret

}else{

module.ret=MM[name].factory

}

module.inited= true}functiondefine(name, deps, factory) {if(MM[name]) {throw new Error("Module " + name + " has been defined already.")

}if(isFunction(deps)) {

factory=deps

}

MM[name]= {factory:factory, inited:false};if (name ===initModuleName) {

runModule(name)

}

}

window.define=define

})(window);//*********定义加载模块方法 end **************//

(function(){/**

* 可以缓存的操作节点*/

var $dom ={

content : $('#content')

}

define('Mode/drawLine',function(require){var drawLine = function(){};

drawLine.prototype={/**

* @根据两坐标画线段

* @param vector1

* @param vector2*/draw :function(vector1 ,vector2){var k = (vector2.y - vector1.y)/((vector2.x - vector1.x));//求斜率k

var y,x ;_lineHtml = [];//用来保存xy变量坐标

var maxX =Math.max(vector2.x,vector1.x),

minX=Math.min(vector2.x,vector1.x),

maxY=Math.max(vector2.y,vector1.y),

minY=Math.min(vector2.y,vector1.y);//利用长度相隔比较大的作为循环确保画的线段质量高些

if((maxX-minX) > (maxY - minY) || (maxX-minX) == (maxY -minY)){for(var i = minX;i

y= k * (i - vector1.x) +vector1.y;

_lineHtml.push('

}

}else{for(var i = minY;i

x= (i - vector1.y)/k + vector1.y;

_lineHtml.push('

}

}

$dom.content.append(_lineHtml.join('')) ;

} ,/**

* @desc求交点坐标具体算法见http://www.cnblogs.com/rubyxie/articles/3548450.html

* @param vector1

* @param vector2

* @param vector3

* @param vector4

* @return {Object}交点坐标*/computeCrossVector :function(vector1 ,vector2,vector3 ,vector4){var crossVector ={},

v1= {"x" : vector2.x - vector1.x , "y" : vector2.y -vector1.y},

v2= {"x" : vector4.x - vector3.x , "y" : vector4.y -vector3.y};var product = v1.x * v2.y - v1.y * v2.x; //两向量的乘积

//计算二阶行列式的两个常数项

var const1 = vector1.x * v1.y - vector1.y *v1.x ;

const2= vector3.x * v2.y - vector3.y *v2.x ;

crossVector.x= (const2 * v1.x - const1 * v2.x)/product;

crossVector.y = (const2 * v1.y - const1 * v2.y)/product;

returncrossVector;

}

,//向量叉乘

crossMul: function(v1, v2) {return v1.x * v2.y - v1.y *v2.x;

}

,

checkLineCross :function(vector1 ,vector2,vector3 ,vector4){var v1 = {x: vector1.x - vector3.x, y: vector1.y -vector3.y},

v2= {x: vector2.x - vector3.x, y: vector2.y -vector3.y},

v3= {x: vector4.x - vector3.x, y: vector4.y -vector3.y},

v= this.crossMul(v1, v3) * this.crossMul(v2, v3),

v1= {x: vector3.x - vector1.x, y: vector3.y -vector1.y},

v2= {x: vector4.x - vector1.x, y: vector4.y -vector1.y},

v3= {x: vector2.x - vector1.x, y: vector2.y -vector1.y};return (v <= 0 && this.crossMul(v1, v3) * this.crossMul(v2, v3) <= 0) ? true : false;

}

};returndrawLine;

});/**

* @desc 模块启动函数*/define('initRun',function(require){var vector1 = {"x" :50 ,"y":100 }, //定义四个向量坐标

vector2 = {"x" :180 ,"y":400},

vector3= {"x" :10 ,"y":104},

vector4= {"x" :200 ,"y":104};var drawMode = require("Mode/drawLine");var line = newdrawMode;

line.draw(vector1,vector2);

line.draw(vector3,vector4);if(line.checkLineCross(vector1,vector2,vector3,vector4)){var cross =line.computeCrossVector(vector1,vector2,vector3,vector4);

$dom.content.append('

交点坐标为：x坐标为 '+ cross.x + ' y坐标 ：'+cross.y+'

');

}else{

alert("这两向量线段未相交");

}

})

})();