Das Folgende sind drei Absätze mit unterstrichenem Code. Wenn ich in den Bearbeitungsmodus klicke, wurde die entsprechende Position der linken Maustaste in vcanvas aufgezeichnet. Wie kann ich feststellen, ob der Punkt, auf den ich geklickt habe, auf dem von mir gezeichneten Liniensegment liegt?
//Dies ist der unterstrichene Schlüsselcode
ctx.beginPath();
var x1=parseInt( (quxian[0].GLB-M_qishi)*(Wmax/M_glb));
//速度第一个点的值
var y1=parseInt(main_h-(main_h-space_h)/100*quxian[0].SPEED);
var x2,y2;
for(var i=1;i<quxian.length;i++){
x2=parseInt( (quxian[i].GLB-M_qishi)*(Wmax/M_glb));
y2=parseInt(main_h-(main_h-space_h)/100*quxian[i].SPEED);
ctx.moveTo(x1,y1);
ctx.lineTo(x2,y2);
x1=x2;
y1=y2;
};
//console.log("第一个点："+x1+":::"+y1)
ctx.strokeStyle="green"; //线条颜色
ctx.stroke();
ctx.closePath();
ctx.beginPath();//管压------------------
x1=parseInt( (quxian[0].GLB-M_qishi)*(Wmax/M_glb));
var yy1=parseInt(main_h-(main_h-space_h)/600*quxian[0].GY);
var xx2,yy2;
for(var j=1;j<quxian.length;j++){
xx2=parseInt( (quxian[j].GLB-M_qishi)*(Wmax/M_glb));
yy2=parseInt(main_h- (main_h-space_h)/600*quxian[j].GY);
ctx.moveTo(x1,yy1);
ctx.lineTo(xx2,yy2);
x1=xx2;
yy1=yy2;
};
ctx.strokeStyle="#fff"; //线条颜色
ctx.stroke();
ctx.closePath();
ctx.beginPath();//牵引力----------------
x1=parseInt( (quxian[0].GLB-M_qishi)*(Wmax/M_glb));
var yyy1=parseInt(main_h-(main_h-space_h)/1000*quxian[0].QYL);
var xxx2,yyy2;
for(var k=1;k<quxian.length;k++){
xxx2=parseInt( (quxian[k].GLB-M_qishi)*(Wmax/M_glb));
yyy2=parseInt(main_h-(main_h-space_h)/1000*quxian[k].QYL);
//牵引力需要负数
ctx.moveTo(x1,yyy1);
ctx.lineTo(xxx2,yyy2);
x1=xxx2;
yyy1=yyy2;
}
ctx.strokeStyle="blue"; //线条颜色
ctx.stroke();
ctx.closePath();
//选线事件---------------------------------------------------------------
$("#xuanxian").click(function(){
var canvas = document.getElementById("ri");
var context = canvas.getContext("2d");
canvas.onclick = function(e) {
var bbox = canvas.getBoundingClientRect();
var x = parseInt( e.clientX - bbox.left * (canvas.width/bbox.width));//鼠标点击canvas图像里面的X位置；
var y = parseInt( e.clientY - bbox.top * (canvas.height/bbox.height));
//为什么不是直接e.clientY - bbox.top呢
console.log("点击时鼠标的坐标："+x+"，"+y)
//进行判断
if(true){
//这里执行在线上的事件
}else{
return false;
//这里执行未选中的事件
}
//alert(context.isPointInPath(83365,708));
};
}); 
一般像这种你需要先给线段设定一个可以选取的范围（四个顶点的x,y），就跟写游戏一样。
然后通过获取canvas内的鼠标坐标来判断鼠标位于哪个对象的选取范围，这时你可以考虑用观察者模式来实现事件的绑定。
至于判断坐标是否在范围内的算法 可以用射线法（考虑到线段可能会旋转和缩放）来判定。
这个虽然我很想帮你，但我写好的源码在不久前把电脑硬盘摔坏后就没了。
我给你写下基本思路吧：
1.首先设置范围就看评论里的例子，四个顶点设好了我们基本上就有了活动的区间，至于区间范围有多大看你个人需求。
2.“观察者模式”（发布-订阅者模式）可以网上搜一下基本代码，其实很容易懂的。
3.至于旋转后坐标的算法，点这里（注意这里是逆时针旋转的公式），直接套用就好。
4.射线法你可能需要用到 向量 来计算，请回忆下你的高中数学。
链接我都给你补好了，先慢慢学吧。看上去很烦，但懂了其实就很容易。