【SVG篇一】SVG基本形状转换成path

前言

之前文章有介绍过svgo的不错的svg压缩工具,其实,svg基本形状转换成path,也是一种压缩方式,不但可以压缩,而且可以做一些路径动画,路径动画下一篇详细介绍,本文主要介绍一下svg基本形状如何转换成path。

SVG path 路径

svg形状很简单,常见的形状一般如下:

【音视频处理】音频文件裁剪与上传

前言

本文接上文,是音视频处理专题文章,上节说了视频上传截取封面。本文介绍音频上传。(最近发现张鑫旭大神也更新了类似文章,本文借鉴其文章,作为音频上传专题文章)

原理

其实音频截取原理也是ArrayBuffer转AudioBuffer 然后创建一个空的AudioBuffer,复制现有的通道数据前3秒的数据,然后复制的内容写入到这个空的AudioBuffer,于是我们就得到了一个剪裁后的音频Buffer数据了。

案例

【音视频处理】纯js实现上传视频,截取关键帧作为封面,上传后端保存

前言

本篇文章是上一篇文章的一个应用。实现视频上传,截取关键帧,并上传给后端保存。这个场景比较多见,今天就说说实现方式吧。原理很简单,就是通过canvas获取某一帧的base64格式,然后转换为file格式,再通过ajax上传给服务端,保存缩略图。

案例

直接上案例吧:

html

<input type="file"/>

首先创建一个video,然后再选取视频文件之后,自动添加到body中

JS 文件base64、File、Blob、ArrayBuffer 介绍及互转

前言

今天介绍一下文件的二进制家族js,file,base64,File,Blob,ArrayBuffer。 案例,假如有一个需求,我们通过解析等方式拿到了文件的二进制uint8array 或者base64或者blob,我们如何通过ajax提交给后端接口呢?

二进制互转

1. file对象转base64

  let reader = new FileReader();
  reader.readAsDataURL(file[0])
  console.log(reader)