• 35648

    文章

  • 23

    评论

  • 20

    友链

  • 最近新加了很多技术文章,大家多来逛逛吧~~~~
  • 喜欢这个网站的朋友可以加一下QQ群,我们一起交流技术。

d3---要封装的函数

欢迎来到阿八个人博客网站。本 阿八个人博客 网站提供最新的站长新闻,各种互联网资讯。 喜欢本站的朋友可以收藏本站,或者加QQ:我们大家一起来交流技术! URL链接:https://www.abboke.com/jsh/2019/0820/107221.html 1190000020119271

两个点之间的直线长度

function length(x0,y0,x1,y1){
    x0-=x1;y0-=y1;
    return Math.sqrt(x0*x0+y0*y0)
}

一段直线从两端相向缩短r长度

function faceToface(dot0,dot1,r){
      let difX=dot0[0]-dot1[0],
          difY=dot0[1]-dot1[1]
      let bigR=Math.sqrt(difX*difX+difY*difY)
      let changeY=Math.abs(difY/bigR*r)
      let changeX=Math.abs(difX/bigR*r)
      let x0=dot0[0]>dot1[0]?dot0[0]-changeX:dot0[0]+changeX
      let y0=dot0[1]>dot1[1]?dot0[1]-changeY:dot0[1]+changeY
      let x1=dot1[0]>dot0[0]?dot1[0]-changeX:dot1[0]+changeX
      let y1=dot1[1]>dot0[1]?dot1[1]-changeY:dot1[1]+changeY
      return [[x0,y0],[x1,y1]]
}

实例验证的代码

let circles=[[100,300],[300,100]]
let cut=faceToface(circles[0].slice(),circles[1].slice(),50)
console.log(cut)
this.svg.selectAll('.circle').data(circles).join(enter=>{
            enter.append('circle')
                         .attr('cx',d=>d[0])
                         .attr('cy',d=>d[1])
                         .attr('r',50)
                         .attr('fill','none')
                         .attr('stroke','#000')
 })
 this.svg.append('path')
         .attr('d',d3.line()(circles))
         .attr('stroke','yellow')
 this.svg.append('path')
         .attr('d',d3.line()(cut))
         .attr('stroke','red')

相关文章

暂住......别动,不想说点什么吗?
  • 全部评论(0
    还没有评论,快来抢沙发吧!