如何将音频文件转绘声波图
哈喽!这里是苏苏吖~,在捣鼓音频转波形图的时候,在网上找了一堆的资料都不是很如意,所以就自己捣鼓琢磨了一下,可算是捣鼓出来啦,所以回顾一下过程。
🐱 音频转波形图的实现方式有很多种,并不唯一。
需求分析
简单描述一下就是需要将音频文件实时的转换成音频波形图呈现出来,我这里也没有找到什么很好的库,所以就自己参考着资料实现了一下。
效果的话,还算可以的吧。哈哈。
预览效果如下所示:
实现
下面来看看我的实现代码吧~useAudioVisualizer.js
class AudioVisualizer { constructor(audioUrl, canvas) { this.audioUrl = audioUrl; this.canvas = canvas; this.context = new(window.AudioContext || window.webkitAudioContext)(); this.bufferSize = 4096; // 缓冲区大小 ...
如何手撸一个echarts图表组件
哈喽!这里是苏苏吖~,最近在做项目时,遇到很多图形图表的应用,但是一个一个的去引用显得好笨,再请教了 唐志远 大佬后得到一些感悟,在这里再次回顾一下封装的过程。
🐱 封装方式有很多种,我所做的封装仅仅是方便我自己在项目中使用,所以主要以记录为主,讲解不多。见谅
开始之前
首先,虽然说是在vue3的项目中做的封装,但是基本的封装逻辑是大差不差的。而在我接下来的封装中,封装的逻辑基本是按照 引入依赖——创建钩子函数——定义响应式引用——定义渲染函数——返回对应对象 来进行的。
好啦,请确保已经创建好项目,并安装好了依赖,此处封装的图表库依赖来源于Echarts图形图表库
$ npm install echarts --save
正式开始
不说废话,直接上代码!
首先是useEcharts函数。useEcharts.js
import { ref } from 'vue';import * as echarts from 'echarts';//定义useEcharts函数,接受chartDom和opt ...
小雪
🎀 哈喽,这里是苏苏吖~,苏苏又来更新文章啦!月光洒落窗台,有人得诗,有人得词,有人做文,有人谱曲…
小雪
在小雪的时节,世界仿佛进入了一场梦幻的画卷。雪花纷纷扬扬地飘洒而下,翩翩起舞,轻柔地覆盖着大地,勾勒出一片银白的童话。这是大自然的魔法,一种不经意间的神奇,将平凡的景色点缀得如诗如画。
窗外,一片宁静。树梢上挂满了晶莹的雪珠,屋檐上铺满了银色的雪翘。整个世界都沉浸在这片宁谧的白色世界中,仿佛时间在这一刻凝固。寒冷的空气中,弥漫着雪的清新味道,让人心旷神怡。
小雪是季节的过渡,是冬天的序曲。大地渐渐冷却,冰雪的覆盖让人感受到一种宁静而祥和的氛围。寒风呼啸,却也带着冬日的温柔。这时节,家中的暖意格外珍贵,让人愿意静下心来,品味生活的美好。
走进乡间,田野在小雪的滋润下显得格外宁静。麦田已然金黄,雪花点缀在麦穗上,宛如珍珠般闪烁。农民们忙碌着,为冬季的来临做着准备,而这一片宁静的田园画卷,也是他们勤劳的见证。
小雪是一场自然的盛宴,是生命的细腻之处。每一片雪花都是独一无二的艺术品,它们在空中飘舞,轻盈而灵动,如同天使的芬芳。抬头仰望,雪花在寂静的夜空中翩然飘 ...
我曾见过风
🎀 哈喽,这里是苏苏吖~,苏苏又来更新文章啦!月光洒落窗台,有人得诗,有人得词,有人做文,有人谱曲…
我曾见过风
秋天,风是大地上的旋律,是微妙的情感在空气中流转。我曾见过风,见过它在秋叶间舞动,如一位优雅的舞者,将金黄的叶片轻轻抚摸。那轻柔的触感仿佛是大自然的温柔,用颤动的树叶述说着秋天的故事。
漫步在小径上,我感受到风的微风,轻拂着脸庞,如同柔软的羽毛轻轻触摸。枫叶纷纷飘落,随风而舞,如同一场自然的独舞。我曾见过风,吹拂过金黄的麦浪,让我感受到大地的丰收和生机。那一片片金黄,在风的引领下,跳动着宁静而又充实的乐章。
我曾见过风,穿越城市的高楼大厦,它在城市中流动,扬起街头的尘埃,却又带着清新的空气。风是城市中的音符,吹散了喧嚣,带来了宁静。我在楼顶眺望,看着远处的云卷云舒,感受到风带给城市的生命力。
山间,风吹草动,传来山花的芬芳。我曾站在山巅,俯瞰千山万水,感受到风的力量。风是山的诗,吹拂过每一片叶子,弹奏着大地的交响乐。我曾见过风,吹拂过湖面,湖水泛起涟漪,如同风在水面轻轻流淌。风与水交融,勾勒出一幅宁静而深邃的画卷。
秋天的风,是大自然的笔触,勾勒 ...
Git命令解析及操作流程
哈喽,这里是苏苏吖~,本文将详细介绍Git的命令解析和操作基本流程,话不多说,直接开始!。
Git命令解析
创建仓库
创建仓库的命令用的多的有两种,
一种是本地有项目文件,需要上传到github/gitee时,通过git init初始化仓库
另一种则是直接从远程仓库clone,通过git clone [url]
命令
说明
git init
初始化仓库,在当前目录新建一个Git代码库,基本上是创建一个具有objects,refs/head,refs/tags和模板文件的.git目录。
git clone [url]
拷贝一份远程仓库,也就是下载一个项目和它的整个代码历史。
增删文件
命令
说明
git add [file1] [file2] ...
添加指定文件到暂存区
git add [dir]
添加指定目录到暂存区,包括子目录
git add .
添加当前目录的所有文件到暂存区
git add -p
添加每个变化前,都会要求确认 对于同一个文件的多处变化,可以实现分次提交
git rm [file1] [file2] . ...
Git分布式版本控制工具
哈喽,这里是苏苏吖~,本文将详细介绍Git的Windows系统的安装过程,既方便自己日后查阅,也能提供一些参考。
Git简介
🌺 git是一个分布式版本控制软件,可以有效,高速的处理项目版本管理。
下载Git
打开git官网下载地址Git (git-scm.com),按照如下步骤下载git安装包到自己的电脑:
步骤一、
步骤二、
步骤三、
按照步骤下载完成后,就可以开始安装git了。Let’s go!
Git安装
现在开始跟随步骤一步一步地安装Git吧~
使用许可声明
右键运行下载好的安装包开始安装:
选择安装目录
Git对于安装目录的选择其实没有要求,不过!如果不想C盘日后爆红的话,还是换一个磁盘新建Git文件夹存放。如果需要对磁盘进行分区,请移步:<先欠着…>
选择安装组件
这一步选项的意思已经做好翻译,推荐只需要多勾选第一项就行,其他的可以不管。
选择开始菜单文件
这一步不需要做什么修改,下一步就好
选择Git默认编辑器
Git默认内置了很多编辑器可供选择,根据需要选择就行。
决定初始化新项目的主干名称
不多说,看图!
调整path环境变量
...
遇见就是上上签
🎀 哈喽,这里是苏苏吖~作为一枚曾经的文科生,虽然现在和代码黏在一起,但是!心里总是会有一些话想说出来,因此开设随笔一栏,欢迎大家留言呀!苏苏也会不定时写一写文章发表哒,生活虽然破破烂烂,也许在某个不起眼的角落就隐藏着诗和远方呢,对吧。
遇见就是上上签
有一段时间,我突然想起了一句话:“我们都在错过与遇见,世界很大,我们总是错过,世界又很小,我们总能遇见。”这句话让我深思,揭示了生命中那种错综复杂的缘分与命运。而让我沉醉其中的是,它唤起了我心底深处的信念——遇见就是上上签。
有人说过:“我遇见了春天,遇见了花朵绽放,遇见了温暖。”这句话如诗一般,将遇见的美妙描绘得淋漓尽致。无论是走在人生旅途中,还是在命运的交叉路口,每一次遇见都是一份珍贵的礼物。它们如温暖的阳光般温暖着我们的心灵,如绽放的花朵般美好,给予我们力量和勇气。
每一次遇见都是一次上上签。无论是两个人相遇的瞬间,还是我们与机遇相交的时刻,每一次邂逅都是个体与世界、与命运的纽带。微笑中传递的喜悦,目光中流露的温情,每一次遇见都是一种奇妙的交织。
遇见并不仅限于与人相会 ...
hexo中使用emoji表情
哈喽,这里是苏苏吖~在Hexo搭建博客完成后,就可以开始写文章啦,不过,如果想要在文章中使用各种各样的emoji表情,就需要一点别的插件啦。因为Hexo默认的markdown渲染引擎已经不再支持将Github emoji渲染到静态的html中。下面介绍怎么解决。
安装插件
首先,在博客目录打开终端,输入下列命令:
$ npm un hexo-renderer-marked --save$ npm i hexo-renderer-markdown-it --save$ npm install markdown-it-emoji --save
先卸载掉原来的hexo-renderer-marked,然后下载新的插件hexo-renderer-markdown-it和markdown-it-emoji
✨ hexo-renderer-markdown-it 的速度比Hexo原装插件要快很多很多,而且功能也更加丰富
配置
插件安装完成后,在Hexo博客的站点配置文件_config.yml 添加一下内容:
❗ 不是在主题的_config_butterfly.yml,是在_config.ym ...