The avatar for @cpietsch
Christopher Pietsch
Visualization, Prototypes, ML, Data wrangling and Art.
Public
Edited
Mar 2, 2020
Fork of Audio waveform with brush
2 stars
Insert cell
md`# Audio sample slicer`
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
{
if(storage.samples[file.name]){
var extent = storage.samples[file.name].map(t => t / blockSize * audioContext.sampleRate)
//normalizedChart.move(extent)
return extent
}
}
Insert cell
Insert cell
Insert cell
selection
Insert cell
Insert cell
Insert cell
Insert cell
{
storage.name = input.name
}
Insert cell
Insert cell
Insert cell
Insert cell
audiobuffer = await fetch(wavBlobUrl)
.then(response => response.arrayBuffer())
.then(arrayBuffer => audioContext.decodeAudioData(arrayBuffer))
Insert cell
samples = 300;
Insert cell
Insert cell
audiobuffer
Insert cell
rawData = audiobuffer.getChannelData(0);
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
mutable storage = defaultStorage
Insert cell
{
mutable storage = JSON.parse(await Files.text(upload))
}
Insert cell
audioContext = new (window.AudioContext || window.webkitAudioContext)();
Insert cell
import {chart as normalizedChart, selectionEnd as selection}
with {normalizedData as data}
from "@cpietsch/bar-chart-on-simple-array"
Insert cell
import {fileInput} from "@mbostock/file-input"
Insert cell
import {localStorage} from "@mbostock/safe-local-storage"
Insert cell
//storage = JSON.parse(localStorage.getItem(await input.name)) || { samples: {}, name: "" }
Insert cell
import {form} from "@mbostock/form-input"
Insert cell
import {download} from "@mbostock/lazy-download"
Insert cell
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more