调整音乐游戏的音量

Question

我正在构建一个在背景中播放音乐的游戏，当您在游戏中前进时，音乐会变为不同的音轨。问题是一些轨道太大了。反正有没有把它调整到我想要的那么大？

Link to Source

Link to Game

我正在寻找一种解决方案，我不必更改整个代码以匹配声音的某些部分并手动调整。

先感谢您。

Answer 1

从我的角度来看，你有两个选择;将你的游戏normalized的所有音频文件的响度提升到同一级别（均衡，压缩，限制等），或者，如果可用，你可以使用webaudio api构建一个限制器并将其连接到你的音频源。

选项1：响度标准化

响度标准化是将音频的平均响度设置为一定水平，这意味着您的音频文件将调整其响度级别，以使平均响度符合您的要求。简单来说，它会减小或增加音量，使声音达到您所需的水平。如果您将所有曲目的响度调到一定水平，他们肯定会保持在一定的音量范围内。

它可以通过音频规范化软件完成，维基百科建议ReplayGain，Sound Check和EBU R128;但是，你可以通过谷歌搜索找到其他人。

选项2：Webaudio限制器使用DynamicsCompressorNode

如果您能够在代码中使用webaudio api，那么使用简单的limiter也是一种选择。当然，那里有一系列不同类型的限制器，但我不打算讨论它们的差异和好处。

可以通过连接在DynamicsCompressorNode上连接的音频源来完成。

我发现这个blog which dig a little deeper into the limiter on webaudio和bellow是我从博客中获取的关于如何使用动态压缩器节点构建限制器的片段。

var context = new AudioContext();
var audio = document.getElementById('audio');
var label = document.getElementById('maximize-db');
var reduction = document.getElementById('reduction');
var source = context.createMediaElementSource(audio);
var preGain = context.createGain();
var limiter = context.createDynamicsCompressor();
limiter.threshold.value = 0.0; // this is the pitfall, leave some headroom
limiter.knee.value = 0.0; // brute force
limiter.ratio.value = 20.0; // max compression
limiter.attack.value = 0.005; // 5ms attack
limiter.release.value = 0.050; // 50ms release
source.connect(preGain);
preGain.connect(limiter);
limiter.connect(context.destination);
var dbToGain = function(db) {
  return Math.exp(db * Math.log(10.0) / 20.0);
}
var maximize = (function(db) {
  preGain.gain.value = dbToGain(db);
  label.textContent = db;
  return arguments.callee;
})(0);
var showReduction = (function() {
  reduction.style.width = (dbToGain(limiter.reduction.value) * 288) + "px";
  window.requestAnimationFrame(arguments.callee);
})();

html, body {
  font-size: 12px;
  font-family: "Open Sans";
  background: white;
}

.controls {
  padding: 6px 16px;
  border-radius: 5px;
  background: #424242;
  color: #f0f0f0;
  display: inline-block;
  width: 288px;
  white-space: nowrap;
}

.controls input {
  width: 200px;
}

.controls span, .controls input {
    vertical-align: middle;
    padding: 0;
    margin: 0;
}

#reduction {
  margin-top: 4px;
  margin-bottom: 2px;
  width: 288px;
  height: 2px;
  background: green;
}

a {
  text-decoration: none;
  color: #666;
}

p {
  color: #CCC;
}

audio {
  width: 320px;
}

<h1>Web Audio HardLimiter</h1>
<div class="controls">
  <span>Maximize</span>
  <input type="range" value="0" step="1" min="0" max="12" oninput="maximize(this.value);">
  <span class="value" id="maximize-db">6</span> <span class="unit">dB</span>
  <div id="reduction"></div>
</div>
<div>
  <h3><a href="http://www.audiotool.com/track/never-ending_passion/" target="audiotool">Never-ending Passion</a> by The Three Pauls</h3>
  <audio id="audio" crossorigin controls>
    <source src="http://api.audiotool.com/track/never-ending_passion/play.ogg" type="audio/ogg">
    <source src="http://api.audiotool.com/track/never-ending_passion/play.mp3" type="audio/mpeg">
    Your browser does not support the audio tag.
  </audio>
</div>
<p>Does not work in Safari.</p>