MP4视频加载器（VideoMp4Loader）

环境：https & 较新版本浏览器支持

VideoMp4Loader 提供预加载MP4图标

示例

示例源码

<template>
  <div style="height: 400px" class="vw-full vh-full">
    <mb-map :center="[115.124368, 29.216049]" :zoom="10">
      <mb-tianditu-layer :types="tiandituTypes" />
      <mb-video-mp4-loader :videos="videos" />
      <mb-symbol-layer
        id="symbol"
        :data="symbolDataSource"
        :icon-size="1.5"
        icon-image-field="icon"
        icon-rotation-alignment="map"
      />
    </mb-map>
  </div>
</template>

<script setup lang="ts">
const tiandituTypes = ['vec', 'cia']
const videos = [
  {
    name: 'rain',
    url: `${__RESOURCE_URL__}videos/rains-s.mp4`,
    size: [54, 96],
  },
]
const symbolDataSource = [
  {
    coordinates: [115.124368, 29.216049],
    properties: {
      icon: 'rain',
    },
  },
  {
    coordinates: [115.124368, 29.246049],
    properties: {
      icon: 'rain',
    },
  },
  {
    coordinates: [115.124368, 29.186049],
    properties: {
      icon: 'rain',
    },
  },
  {
    coordinates: [115.324368, 29.216049],
    properties: {
      icon: 'rain',
    },
  },
]
</script>

API

PROPS

名称	描述	类型	默认值
videos	视频属性数组 数组中每个对象需包含必需的name属性以及图片相关信息	array<{ name: string; url: string, size?: number[], requestInit?: RequestInit }>	-

组件使用fetch去请求图片数据，如果是跨域请求，请在服务端配置CORS头部，requestInit为fetch的第二个参数

EVENTS

名称	描述	参数
created	地图初始化完成事件	-

SLOTS

名称	描述

METHODS

名称	描述	定义