https://github.com/capricorncd/guitar-chords
Generate a guitar chords or edit it.
https://github.com/capricorncd/guitar-chords
canvas guitar-chords svg
Last synced: 6 months ago
JSON representation
Generate a guitar chords or edit it.
- Host: GitHub
- URL: https://github.com/capricorncd/guitar-chords
- Owner: capricorncd
- License: mit
- Created: 2024-10-20T14:13:05.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2024-11-10T14:37:35.000Z (12 months ago)
- Last Synced: 2025-05-12T20:25:08.231Z (6 months ago)
- Topics: canvas, guitar-chords, svg
- Language: TypeScript
- Homepage: https://capricorncd.github.io/guitar-chords/playground
- Size: 241 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# guitar-chords
Generate and edit guitar chord diagrams in Canvas or SVG. [View the chord diagrams it generates →](https://capricorncd.github.io/guitar-chords/playground/).
```js
import { GuitarChords } from '@guitar-chords/canvas'
// import { GuitarChords } from '@guitar-chords/svg'
const guitarChords = new GuitarChords({
name: 'C',
matrix: [
[0, 0, 0, 0, 1, 0],
[0, 0, 2, 0, 0, 0],
[3, 4, 0, 0, 0, 0],
],
})
// get canvas element and append to body
document.querySelect('body').append(guitarChords.element)
// get data
console.log(guitarChords.data)
```
## @guitar-chords/canvas
See [libs/canvas](./libs/canvas), README [English](./libs/canvas/README.md) - [中文](./libs/canvas/README_CN.md)
## @guitar-chords/svg
See [libs/svg](./libs/svg), README [English](./libs/svg/README.md) - [中文](./libs/svg/README_CN.md)
## @guitar-chords/editor
TODO