使用D3.js在最小和最大数之间生成二维数组

时间:2018-01-05 14:50:25

标签: javascript arrays excel d3.js svg

我是D3.js的新手所以请耐心等待。下图显示了我要绘制的内容,它是在Excel中创建的。每个物体都有这条美丽的曲线。

enter image description here

我根据这个公式得到了这条流畅的线条。我将获得X,Alpha和Beta的参数,并根据我必须使用下面的公式找到y - > y = Alpha(1-2.71828 *( - Beta * x)),x必须是通过递增100从最小100到消耗量生成的数字。

在Excel中,我可以像这样生成X的数字,并为每个

找到y
100     1.28E-01
200     0.256638873
300     0.384674585
400     0.51252152
500     0.640179956
600     0.76765017
700     0.894932441
800     1.022027046
900     1.14893426
1,000   1.275654361
1,100   1.402187624
1,200   1.528534325

但是在JS基础上,如何生成X应该在0到花费的数量之间增加100,它应该创建二维数组,以便为​​每个对象提供X,Y。例如,如果min为0且max为20000,如何在min和max之间生成数组,增量为100?

如何根据生成的X计算Y?你能给我一些指导,以便创建这个二维数组来使用D3.js绘制这一行吗?

name    alpha        beta       max_x_val   spend
BAN1    140.3       3.86E-05    28,675.00   29,919.00
BAN2    115.31      2.08E-05    32,302.00   28,367.00
BAN3    5.07E-05    19,740.00   16,972.00
ADJ4    91.8        0.000029119 25,855.00   27,112.00
ADJ5    90.3        2.81E-05    25,793.00   23,883.00

我可以使用下面的代码绘制线条,只有我可以为每个对象创建二维数组才能很好地工作。

$( document ).ready(function() {
   var bezierLine = d3.svg.line()
    .x(function(d) { return d[0]; })
    .y(function(d) { return d[1]; })
    .interpolate("basis");

var svg = d3.select("#bezier-demo")
    .append("svg")
    .attr("width", 300)
    .attr("height", 150);

svg.append('path')
    .attr("d", bezierLine([ [0.1, 0.13], [0.2, 0.26], [0.3, 0.38], [0.4, 0.51], [0.5, 0.64], [0.6, 0.77]]))
    .attr("stroke", "red")
    .attr("stroke-width", 1)
    .attr("fill", "none")
    .transition()
        .duration(2000)
        .attrTween("stroke-dasharray", function() {
            var len = this.getTotalLength();
            return function(t) { return (d3.interpolateString("0," + len, len + ",0"))(t) };
        });
});

1 个答案:

答案 0 :(得分:2)

您正在寻找的是d3.range()功能。它产生一个算术级数,使用简单的a = tf.Variable([3, 4, 5, -1, 6, -1, 7, 8]) tf.global_variables_initializer().run() mask = tf.equal(a, -1) indices = tf.reshape(tf.where(mask), (-1,)) tf.scatter_update(a, indices, [11, 12]).eval() # array([ 3, 4, 5, 11, 6, 12, 7, 8], dtype=int32) ,您可以将其增强为二维数组:

.map()