はじめる

インストール

npm install plonkjs

曲を書く

曲はオブジェクトです。テンポ、いくつかの楽器、そして順番に演奏するパターンのセクションでできています。

import type { Song } from "plonkjs";

export const theme: Song = {
  bpm: 112,
  swing: 0.12,
  instruments: {
    lead: { wave: "square", decay: 0.14, sustain: 0.35, volume: 0.15, echo: 0.3 },
    bass: { wave: "sawtooth", octave: -1, volume: 0.22, filter: { cutoff: 380, q: 9, sweep: 1400 } },
    kick: { wave: "sine", drop: 24, decay: 0.12, sustain: 0, volume: 0.5 },
    hat: { wave: "noise", decay: 0.03, sustain: 0, volume: 0.08, filter: { cutoff: 9000 } },
  },
  sections: {
    a: {
      lead: "C5 . E5 G5 . E5 C5 . | D5 . F5 A5 . F5 D5 .",
      bass: "C3 . . C3 . . G2 . | D3 . . D3 . . A2 .",
      kick: "x . . . x . . .",
      hat: ". . x . . . x .",
    },
  },
  order: ["a", "a"],
};

1 ステップは 16 分音符です。記法の全体は曲とパターンに、音の設定はすべて楽器にあります。

鳴らす

import { Player } from "plonkjs";
import { theme } from "./theme";

const player = new Player();
player.play(theme, { fade: 1 }); // 1 秒かけてフェードイン。止めるまでループします

ブラウザは、プレイヤーがクリック、タップ、キー入力をするまで音を出しません。クリックをきっかけに音楽を始めるか、Player を早めに作っておいてください。ブラウザが音を許可した時点で鳴り始めます。

止める、雰囲気を変える

player.tempo(1.15); // 途切れずに 15% 速く
player.layer("kick", 0); // キックをフェードアウト
player.stop(1); // 1 秒かけて全体をフェードアウト

これらをゲームと結びつける方法はゲームに反応する音楽で紹介しています。ゲームエンジンと組み合わせる場合は、そのオーディオコンテキストを渡すと音量とミュートを共有できます。ゲームエンジンと組み合わせるを見てください。