&meterstyle
Optional audio meter style type
Last updated
Was this helpful?
Optional audio meter style type
Last updated
Was this helpful?
General Option! (&push
, &room
, &view
, &scene
, &director
)
&meter
Example: &meterstyle=3
Default
a green dot in the right-corner that only shows in the guest / director view
1
| (no value given)
will show the VU-style meter that the director has by default already
2
will show a green-border around the guest's video when they are talking
3
will show a little green dot in the top-right corner when the guest's talking; this is default for the guest's view already
4
no meter is shown, but a data-attribute named data-loudness
is applied to the video element. This can be targeted with CSS to do custom styles via OBS browser source or with &css
5
has the audio-only background image pulse larger in size when that specific guest is speaking
If you add this to a director's/guest's URL, it will show an optional audio style type, when a guest is talking.
For guests and directors, there is a default meter style that shows a green dot in the top right for when someone is speaking.
When using any &meterstyle
effect, I now include a data attribute called data-speaking
to the video element. It will be either 0, 1, or 2. 0 is quiet, 1 is whispering, and 2 is loud. &meterstyle=4
includes a fine-grain option already for loudness as an attribute, but for basic CSS needs, this option might be more approachable.
You can use this attribute to use CSS to customize your own effects when someone speaks. You can further target what is CSS used based on a specific guest by using each video's stream ID data attribute as well.
The meter will not appear if audio is not yet playing/active, or is audio-processing is disabled (&noap). This might be the case with certain mobile devices as well.
A common request is a green box around the activer speaker
When using &meterstyle=4
or greater, the background of an audio-only element is transparent now; not black. I also specifically hide the video-control bar when using &meterstyle=4
, but you can use &videocontrols
to add them back in if needed.
It can be used in conjunction with &bgimage
to specific a custom background image for the video, which will pulse in size. ie: &meterstyle=5&bgimage=./media/avatar1.png