canvas

又吹风_Bassy

介于 NanoVG 和 Skia 之间：C++17 可嵌入式 2D 渲染库 WhatsCanvas 全面介绍原创整理 | 关键词：WhatsCanvas、C++17、2D 渲染、跨平台、Canvas、NanoVG、Skia

HTML5 Canvas：从画图到游戏开发在聊 Canvas 之前，先看看网页游戏是怎么一路发展过来的：Flash 已经退出历史舞台，HTML5 Canvas 成了网页游戏与可视化的事实标准。AI 时代的爆发（three.js 3D 场景、物理大模型可视化）更是把 Canvas 推到了前台。

敲敲敲敲暴你脑袋

升级啦！纯前端打包下载离线地图之前写了篇文《不用钱！纯前端打包下载离线瓦片地图》，爬取开放的瓦片底图，写入jszip压缩包，进行下载离线瓦片底图。

用原生 HTML5 视频与 Canvas 实现浏览器端视频抽帧封面视频封面生成的流程并不是“修改 video.currentTime 后立刻截图”。视频定位、解码和画面更新都是异步的：需要先加载元数据，再跳转到目标时间，等待 seeked 事件，最后将当前视频画面绘制到 Canvas 并导出图片。

cos-design BubbleField：用 Canvas 做一个「会呼吸」的深海气泡场发布日期：2026-07-28 标签：前端 / React / Canvas / 组件库 / cos-design / 视觉特效 / 物理仿真

cos-design RippleWater & SmokeFog：水面涟漪与烟雾雾气怎么做发布日期：2026-07-24 标签：前端 / React / WebGL / Canvas / 组件库 / cos-design / 视觉特效

cos-design WeatherBackground：用 Canvas 做一个「会变天」的背景引擎发布日期：2026-07-22 标签：前端 / React / Canvas / 组件库 / cos-design / 视觉特效 / Open-Meteo

随风一样自由

【前端+Canvas+航天】长征十号乙火箭回收全流程动画长征十号乙（CZ-10B）是中国航天科技集团研制的新型重复使用液体运载火箭，采用5米直径两级串联构型。2026年7月10日，长征十号乙在海南商业航天发射场成功首飞，实现了全球首次运载火箭海上网系回收。

从零构建 AI 学术论文助手（四）：PDF.js 实时截图 + Gemini 视觉分析系列文章第四篇。本篇讲一个看似简单但暗坑极多的功能：在网页上展示 PDF，允许用户拖拽框选任意区域截图，然后发给 AI 解读图表和公式。

网页 UI 终于能进游戏和 3D 场景了：HTML-in-Canvas 为什么重要如果只用一句话解释 HTML-in-Canvas：它让真实网页 UI 既保留“网页该有的好用”，又能进入 Canvas、WebGL、WebGPU 的视觉世界。

HTML5 Canvas 基础：从按帧动画到 ECharts 数据可视化这一次让我们将目光转向前端绘画的基础，Canvas 标签。Canvas（画布）是HTML5中一个非常重要的元素，它提供了一个可以通过JavaScript绘制图形的区域.

HTML-in-Canvas 深度解析：让 Canvas 真正「吃上」HTML 这碗饭做过 Canvas 项目的同学，应该都经历过这种痛苦：HTML-in-Canvas 是 WICG 正在推进的一项实验性 Web 标准，目标很简单：

🚀 手把手用 HTML5 Canvas 从零打造飞机大战游戏，代码全开源！摘要：本文从 Canvas 基础 API 讲起，手把手带你用纯 JavaScript + Canvas 2D 打造一个完整的飞机大战游戏，涵盖视差滚动、粒子特效、碰撞检测、难度递增等核心机制。

想要成为糕糕手

从零到一：CSS 3D 旋转立方体完全指南🌟 这是一篇带你亲手搭建 3D 旋转立方体的硬核笔记——从元素类型聊到 flex 布局，从定位深入 3D 变换，最后用动画让立方体转起来。全文逻辑闭环、图文并茂，读完你不仅能复刻经典案例，更能掌握一套举一反三的 CSS 3D 心法。建议收藏慢慢啃，边看边动手～ 🧩

用pixi.js实现fabric.js(七)：框选、ActiveObject和控制点前面我们已经实现了StaticCanvas，让我们能够看到各个元素出现在画布上的效果，然后我们实现了事件系统，让画布上的元素可以拖拽，但是，编辑器最重要的操作：编辑元素、框选元素等，我们还没有实现，而这一章，我们将逐步实现这些编辑功能，让这个画布的功能更加完善，进一步靠近fabric。

HTML5 Canvas 从入门到游戏实战HTML5 Canvas 是前端领域一块极具魅力的技术阵地——它把浏览器变成了一个像素级的画布，数据可视化、网页游戏、炫酷动效，都能在 Canvas 上施展拳脚。本文从零开始梳理 Canvas 的核心概念，并通过一个完整的飞机大战游戏和 ECharts 数据可视化案例，串联起 Canvas 的实用知识体系。

Darling噜啦啦

Canvas 游戏开发与数据可视化实战：从飞机大战到 ECharts 报表本文带你深入 HTML5 Canvas 的核心原理，从基础绘制到帧动画，从碰撞检测到完整游戏开发，再到 ECharts 数据可视化——一文掌握前端图形编程的两大核心场景。

【HTML】JavaScript Canvas 图像截取与保存完整指南在前端开发中，我们经常遇到这样的需求：需要从画布（Canvas）中截取特定区域，并将该区域保存为独立的图片文件。本文将详细介绍如何使用 JavaScript 实现这一功能，涵盖从图像绘制、区域选择、数据截取到最终保存下载的完整流程。

用pixi.js实现fabric.js(六)：从线性代数的角度理解编辑器交互在上一章中，我们已经实现了部分Canvas类的功能，但是仅仅是实现了事件系统相关的功能，还有很多交互功能，我们并没有实现，在实现这些交互功能之前，我们需要了解一些前置知识，以帮助理解如何实现这些交互功能。本文的目的，就是让大家来了解这些前置知识。

我做了一面互联网摸鱼墙：从无限 Canvas 到本地生产环境最近，我做了一个叫「摸鱼表格」的小项目。它看起来像表格，却没有表头、公式、筛选和工作任务。这里有的，只是一面可以无限拖动、缩放和探索的公共格子墙。