小编Ash*_*ury的帖子

用Kaminari分页跳到midde

假设我有30页与Kaminari分页:

#800 books, 25 per page
=paginate @books, :outer_window => 3, :window => 3
Run Code Online (Sandbox Code Playgroud)

它看起来像这样:

1 2 3 4 ... 30 31 32

没有点击5次就无法进入第16页.

  1. 1*2 3 [4] ... 30 31 32
  2. 1 2 3 4*5 6 [7] ... 30 31 32
  3. 1 2 3 4 5 6 7*8 9 [10] ... 30 31 32
  4. 1 2 3 ... 7 8 9 10*11 12 [13] ... 30 31 32
  5. 1 2 3 ... 10 11 12 13*14 15 [16] ... 30 …

pagination ruby-on-rails kaminari

5
推荐指数
1
解决办法
559
查看次数

使用webaudio生成静态波形

我正在尝试使用webaudio和canvas生成类似于音频编辑应用程序的静态波形.现在我正在加载一个mp3,创建一个缓冲区,迭代getChannelData返回的数据.

问题是..我真的不明白什么是返回.

  1. getChannelData返回的内容 - 是否适合波形?
  2. 如何调整(样本大小?)以获得一个峰值==一秒?
  3. 为什么~50%的值是负数?

    ctx.decodeAudioData(req.response, function(buffer) {
      buf = buffer;
    
    src = ctx.createBufferSource();
    src.buffer = buf;
    
    //create fft
    fft = ctx.createAnalyser();
    
    var data = new Uint8Array(samples);
      fft.getByteFrequencyData(data);
    
    bufferL = buf.getChannelData(0)
      for(var i = 0; i<buf.length; i++){
        n = bufferL[i*(1000)]
          gfx.beginPath();
          gfx.moveTo(i +0.5, 300);
          gfx.lineTo(i +0.5, 300 + (-n*100));
          gfx.stroke();
    
    Run Code Online (Sandbox Code Playgroud)

我正在产生什么:

我正在产生什么:

我想要产生什么:

我想要产生什么:

谢谢

javascript waveform canvas web-audio-api

4
推荐指数
1
解决办法
866
查看次数

限制线的长度

我正在尝试画一条代表“弹弓”的线,并且希望它具有最大拉伸长度。

在 p5 中,我在位置 A 和位置 B 之间画一条线:

line(posA.x, posA.y, posB.x, posB.y);
Run Code Online (Sandbox Code Playgroud)

posA 是鼠标 x 和 y。posB 是画布上圆的位置。

我想要做的是限制线的长度,使其长度永远不会超过 40px,但仍然从圆圈指向鼠标。

javascript processing canvas p5.js

2
推荐指数
1
解决办法
1026
查看次数

我应该在 Rails 中使用 uuid 列类型进行关联吗?

我有一篇带有 UUID 的文章,我想保存它的发布状态以及发布它的用户。

在文章的迁移中,我应该使用什么列类型来引用用户?用户有一个列类型为 :uuid 的 uuid。

我应该t.uuid :published_by在我的文章迁移中做什么?

ruby-on-rails

2
推荐指数
1
解决办法
2378
查看次数

用D3绘制波形

我是d3的新手,觉得有点不知所措。我有一个数组,每个样本包含y1和y2。

waveformData = [[79, 140], [67, 145], [70, 152], ..... ]
Run Code Online (Sandbox Code Playgroud)

目前,我正在绘制它,如下所示:

waveformData.forEach(function(data,i){
    svg.append("line")
        .attr('y1', data[0])
        .attr('y2', data[1])
        .attr('x1', i +0.5)
        .attr('x2', i +0.5)
        .attr("stroke-width", 1)
        .attr("stroke", "green");
}
Run Code Online (Sandbox Code Playgroud)

波形图

它可以工作,但是我并没有在d3的“精神”中做到这一点。有人可以解释如何将d3用于此类用途吗?

javascript svg d3.js

1
推荐指数
1
解决办法
1202
查看次数