<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>TEST-5</title>
<script src="https://d3js.org/d3.v4.js"></script>
<style type="text/css">
.fixed-cell {
width: 30px;
height: 30px;
position: absolute;
}
</style>
</head>
<body>
<script>
const data = ['Cat', 'Dog', 'Cat', 'Dog', 'Cat', 'Dog'], duration = 1500
d3.select('body')
.selectAll('div')
.data(data)
.enter()
.append('div')
.attr('class', 'fixed-cell')
.style('top', function(d, i) {
return i *40 + 'px'
})
.style('background-color', 'steelblue')
.style('color', 'white')
.style('left', '500px')
.text(d => d)
.transition()
.duration(duration)
.style('left', '10px')
.filter(d => d == 'Cat')
.transition()
.duration(duration)
.style('left', '500px')
</script>
</body>
</html>
5403
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
