Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/kainstar/image-to-text
a pure front-end website transform image file to text.
https://github.com/kainstar/image-to-text
Last synced: about 1 month ago
JSON representation
a pure front-end website transform image file to text.
- Host: GitHub
- URL: https://github.com/kainstar/image-to-text
- Owner: kainstar
- License: gpl-3.0
- Created: 2018-05-14T05:22:35.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2022-02-02T07:28:26.000Z (almost 3 years ago)
- Last Synced: 2024-12-10T10:03:10.060Z (about 1 month ago)
- Language: JavaScript
- Homepage: https://blog.kainstar.moe/image-to-text/
- Size: 4.43 MB
- Stars: 173
- Watchers: 5
- Forks: 33
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- awesome-notes - image-to-text `a pure front-end website transform image file to text. https://blog.kainstar.moe/image-to-text/`
- awesome - kainstar/image-to-text - a pure front-end website transform image file to text. (JavaScript)
- awesome - kainstar/image-to-text - a pure front-end website transform image file to text. (JavaScript)
README
# image-to-text
一个纯前端的图片转字符画工具
[仓库地址](https://github.com/kainstar/image-to-text)
[项目地址](https://blog.kainstar.moe/image-to-text/)
## 项目说明
- 纯前端项目，不依赖服务器
- 支持 jpg，png，gif 三种格式图片
- 使用 canvas 来实现单帧图片的解析、缩放和生成，使用gif.js合并单帧图片为gif图片
- 可等比缩放图片
- 可自定义文字和背景颜色
- 可自定义转换时使用的字符
- 部分方法实现参考已在源码中标明出处
## 项目使用技术栈
- webpack
- React
- gif.js （生成gif图片用）
## 项目结构
```
├─ src
│ ├─ component 组件文件
│ ├─ style 样式文件
│ ├─ tools 图片解析、转化工具文件
│ ├─ App.jsx
│ ├─ index.js
│ └─ index.html
├─ static
│ └─ js
│ └─ gif.worker.js gif.js生成图片依赖文件
├─ webpack
│ └─ webpack 配置文件
└ 其他文件
```
## 效果演示
### 基本功能
### 图片大小缩放
### 设置颜色（文字和背景）
### 自定义转换字符
## 本地运行
### 开发模式
```bash
npm i
npm run dev
```
### 项目打包
```bash
npm run build
```
### 发布到github pages
```bash
npm run deploy
```