| 文件 | 语言 | 大小 | 版本 | 开发者 | 最后更新 | |
| lands/media production | JavaScript | 5.3KB | v1.0.0 | YB | 2024-10-16 | 查看 |
| lands/media source code | JavaScript | 14.0KB | v1.0.0 | YB | 2024-10-16 | 查看 |
- 蓝紫集成开发
const media = (await Lan.import('media')).media(); // create a media management object const image = await media.image('I1'); // load image const video = await media.video('V1'); // load video请参考向导程序：Three.js 着色器。
- 第三方集成
import * as lands from "https://ddzeb.com/lands/media"; const media = lands.media(); // use media ...const lands = await import("https://ddzeb.com/lands/media"); const media = lands.media(); // use media ...第三方集成参考示例（CodePen）：Lands media Demo。
在我们常用的渲染引擎 frag 以及 compute 中已经自带了图像纹理加载功能，但缺少音频以及视频加载以及更复杂的图像处理能力。media 库填补了空白，同时也为其它需要多媒体的场景提供了基础支持。
从 url 地址加载音频，并返回一个 HTMLAudioElement 对象。可选参数 options 包括：
加载成功，返回对象附加属性/方法如下：
- fft_points：
int，FFT 频率数据长度； - fft_buffer()：获取当前 FFT 频率数据，返回 Uint8Array 类型对象。
从 url 地址加载音频，并返回一个 HTMLVideoElement 对象。可选参数 options 包括：
如果非静音播放，返回对象附加属性/方法如下：
- fft_points：
int，FFT 频率数据长度； - fft_buffer()：获取当前 FFT 频率数据，返回 Uint8Array 类型对象。
加载图像，返回 HTMLImageElement 类型对象。返回对象附加属性/方法如下：
- data(width, height)：返回 ImageData 类型对象；
- canvas(width, height)：返回 canvas 类型对象；
- blur(size, width, height)：模糊处理，返回 ImageData 类型对象。
传入六张图像的地址，加载 Cubemap 图像序列。如果是加载蓝紫内置 Cubemap 资源，也可以只传一个参数：
const images = await media.cubemap('C1');将图像、视频或 ImageData 等转换为一个 canvas 对象，width 以及 height 参数可选，用于调整宽高。返回 canvas 对象附加属性/方法如下：
- data()：获取 canvas 图像，返回 ImageData 类型对象。
平均算法进行图像模糊。传入参数 image 为 ImageData 类型对象，返回值也是同样类型。参数 size 控制模糊大小。
加载颜色桶，返回一个 4096 x 3 元素的二维数组，代表 4096 个 rgb 颜色，颜色分量为小数形式。
加载颜色桶为一个 ImageData 类型对象，每一行为一个颜色桶的 4096 个颜色数据。可设置参数 options.flipy = true 将颜色桶顺序设置为反向（即 ImageData 在 Y 方向翻转）。
加载字体，字体被写入 DOM 并返回 FontFace 类型对象。
暂停所有已加载音频及视频的播放。
恢复所有已加载音频及视频的播放。
停止所有已加载音频及视频的播放，并移除媒体源。