d3 画曲线

准备工作创建画布、创建组之类的省略。
准备数据,并用比例尺扩大到整个画布(画布大小自己设置)

let data = [1,3,4,5,5]
let scale_x = d3.scaleLinear()
	.domain([0, data.length - 1])
	.range([0, this.svgWidth])
let scale_y = d3.scaleLinear()
	.domain([0, d3.max(data)])
	.range([0, this.svgHeight])

曲线生成器:

let curve_generator = d3.line()
	.x( (d) => scale_x(d) )
	.y( (d) => scale_y(d) )
	.curve(d3.curveBasis)

画出 path

svg.append('path')
	.attr('d', curve_generator(data)
	.attr('stroke', 'gray')
	.attr('stroke-width', 2)
	.attr('fill', 'none')

效果

全部评论

相关推荐

不愿透露姓名的神秘牛友
07-07 13:46
点赞 评论 收藏
分享
这算盘打的
程序员小白条:都这样的,都是潜规则,你自己说可以实习一年就行了,实习可以随便跑路的
点赞 评论 收藏
分享
05-26 22:25
门头沟学院 Java
Java小肖:不会是想叫你过去把你打一顿吧,哈哈哈
点赞 评论 收藏
分享
07-07 17:06
已编辑
深圳技术大学 golang
点赞 评论 收藏
分享
不愿透露姓名的神秘牛友
昨天 12:05
点赞 评论 收藏
分享
评论
点赞
收藏
分享

创作者周榜

更多
牛客网
牛客网在线编程
牛客网题解
牛客企业服务