作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我有一个 D3 程序正在构建一个折线图,其中有两条线,我想确定两条线交叉处的坐标。 D3 有这个功能吗?这些数组通常具有不同的长度并且是动态生成的,但总是有一个值,在同一索引处两者都相等。
例如
var line1 = [0,1,2,3,4];
var line2 = [4,3,2,1,0];
在本例中,答案 = 索引 2。如果没有 D3 函数,那么使用 ES6 及更高版本的最佳方法是什么?
最佳答案
D3 有一个非常未知的方法,名为 d3.zip
,我们可以使用它来合并数组并查找所有元素都相等的任何内部数组:
var line1 = [0, 1, 2, 3, 4];
var line2 = [4, 3, 2, 1, 0];
var zip = d3.zip(line1, line2).reduce(function(a, c, i) {
if (c[0] === c[1]) a.push(i);
return a;
}, []);
console.log(zip)
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.7.0/d3.min.js"></script>
d3.zip
的好处在于它可以与多个数组一起使用,并且还能保持较短数组的长度。因此,在更复杂的情况下(索引 6 和 9 中的值相等):
var line1 = [0, 1, 2, 3, 9, 9, 1, 4, 7, 6, 5, 4];
var line2 = [4, 3, 2, 1, 0, 8, 1, 2, 3, 6, 1];
var line3 = [9, 9, 9, 9, 4, 1, 1, 1, 1, 6, 1, 1, 1, 1, 1, 1];
var zip = d3.zip(line1, line2, line3).reduce(function(a, c, i) {
const every = c.every(function(e) {
return e === c[0]
})
if (every) a.push(i);
return a;
}, []);
console.log(zip)
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.7.0/d3.min.js"></script>
关于javascript - 如何将两个数组缩减为存在于同一索引处的单个值?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55704277/
我是一名优秀的程序员,十分优秀!