由于path有自带的api可获得总长度,和某个长度返回的坐标。
var total = d.path.getTotalLength();//返回总长度
var point = d.path.getPointAtLength(num);//返回一个对象,包括x,y
想着进行了line的位置找寻:
svg中《line》的路径上的点的位置找寻方法
//根据line的起始点坐标返回一个对象,得到线段的长度
function GetLineLength(x1,y1,x2,y2){
var obj ={};
obj.x = x1;
obj.y = y1;
obj.length = Math.sqrt((x2 - x1)*(x2 - x1) + (y2- y1)*(y2- y1));
obj.sin = (y1-y2)/obj.length;
obj.cos = (x1-x2)/obj.length;
return obj;
};
//根据上变的函数得到的对象,传入某一长度,返回此长度在line上的x,y的坐标
function GetLintPoint(obj,number){
var point = {};
point.x = obj.x - number*obj.cos;
point.y = obj.y - number*obj.sin;
return obj1;
};
在svg中的line和path根据路径返回x,y的更多相关文章
-
jsp中的basePath和path(绝对路径 相对路径)
在JSP中的如果使用 "相对路径" 则有 可能会出现问题. 因为 网页中的 "相对路径" , 他是相对于 "URL请求的地址" 去寻找资源. ...
-
【js类库Raphaël】基于svg中的path画40%表示的环型图
一.可供参考的文档资料. raphaeljs官网:http://raphaeljs.com/ w3c关于path的介绍:http://www.w3.org/TR/2003/REC-SVG11-200 ...
-
CSS和SVG中的剪切——clip-path属性和<;clipPath>;元素
剪切是什么 剪切是一个图形化操作,你可以部分或者完全隐藏一个元素.被剪切的元素可以是一个容器也可以是一个图像元素.元素的哪些部分显示或隐藏是由剪切的路径来决定的. 剪切路径定义了一个区域,在这个区域内 ...
-
【转】CSS和SVG中的剪切——clip-path属性和<;clipPath>;元素
本文由大漠根据SaraSoueidan的<Clipping in CSS and SVG – The clip-path Property and <clipPath> Elemen ...
-
[翻译svg教程]svg 中的g元素
svg 中的<g>元素用来组织svg元素.如果一组svg元素被g元素包裹了,你可以通过对g元素进行变换(transform),被g元素包裹的元素也将被变换,就好这些被svg包裹的元素是一个 ...
-
关于添加图片到svg中,rails下使用js, 用parseFloat来调整force.on时的位置
注意在代码中用/表示路径...windows中file才是\ 1.<image xlink:href=<%= asset_path 'vnet/virtual_switch.png' %& ...
-
SVG &; convert polygon/polyline to path
SVG & convert polygon/polyline to path SVG Polygon/Polyline to Path Converter https://codepen.io ...
-
[翻译svg教程]svg中的circle元素
svg中的<circle> 元素,是用来绘制圆形的,例如 <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink= ...
-
在 SVG 中添加交互性
原文地址:http://www.ibm.com/developerworks/cn/xml/x-svgint/ SVG 中的交互性可以分为三个领域 -- 链接.事件和脚本.本文将依次讨论这三个领域. ...
随机推荐
-
Android SDK Manager无法更新,内容显示不全的解决办法
最近在初学android开发,在更新SDK的时候遇到了麻烦. 发现Extras文件夹下为空,没有内容,包括sdk列表也不全面,更新也没有反应 解决方法: 1.在SDK Manager下Tools-&g ...
- 创建App IDs时选择App ID Prefix才能勾选push notifications
-
第十六章——处理锁、阻塞和死锁(3)——使用SQLServer Profiler侦测死锁
原文:第十六章--处理锁.阻塞和死锁(3)--使用SQLServer Profiler侦测死锁 前言: 作为DBA,可能经常会遇到有同事或者客户反映经常发生死锁,影响了系统的使用.此时,你需要尽快侦测 ...
-
Stu Website
GIT: 分支的新建与合并 https://git-scm.com/book/zh/v2/Git-分支-分支的新建与合并 分支的管理 https://git-scm.com/book/zh/v1/Gi ...
-
CONSOLE_SCREEN_BUFFER_INFO 结构体
CONSOLE_SCREEN_BUFFER_INFO结构体 来源:https://msdn.microsoft.com/en-us/library/ms682093(v=vs.85).aspx 作用 ...
-
InfiniDB 修改一行的效率?
InfiniDB引擎的DML速度比较慢,无论设置自动提交开关为关闭或开启,插入性能都很糟糕,但更新和删除的效率还可以,并且不支持truncate表操作. 删,改 效率高 插入,效率低(测试,在数据量稍 ...
-
Vivado中VIO核使用
前言 使用场景:在使用In system debug时需要使用按键触发查看相关信号,但不想用板子上的按键. VIO:Virtual input output,即虚拟IO. 主要用作虚拟IO使用:VIO ...
-
Vue(基础七)_webpack使用工具(下)
一.前言 1.webpack.config文件配置 2.webpack打包css文件 ...
-
Python+OpenCV图像处理(九)—— 模板匹配
百度百科:模板匹配是一种最原始.最基本的模式识别方法,研究某一特定对象物的图案位于图像的什么地方,进而识别对象物,这就是一个匹配问题.它是图像处理中最基本.最常用的匹配方法.模板匹配具有自身的局限性, ...
-
WLC5520无法通过无线客户端进行网管故障解决
客户反馈其办公环境中的WLC5520网管需要通过内部有线网络进行管理,通过无线客户端无法进行管理,远程协助其开启WLC5520的无线管理功能后故障解决.