# merkletree-viz

**Repository Path**: mirrors_miguelmota/merkletree-viz

## Basic Information

- **Project Name**: merkletree-viz
- **Description**: Merke tree visualization library for browser, works with merkletreejs
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2022-11-14
- **Last Updated**: 2026-04-26

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# merkletree-viz

> Merke tree visualization library for browser, works with [`merkletreejs`](https://github.com/miguelmota/merkletreejs).

## Example

[https://lab.miguelmota.com/merkletree-viz](https://lab.miguelmota.com/merkletree-viz)

### CDN

Available on [jsDelivr](https://www.jsdelivr.com/) CDN:

```html
<script src="https://cdn.jsdelivr.net/npm/merkletree-viz@latest/merkletreeviz.js"></script>
```

## Usage

Import js libs for hash function, merkletreejs, and merkletree-viz

```html
<script src="https://cdn.jsdelivr.net/npm/keccak256@latest/keccak256.js"></script>
<script src="https://cdn.jsdelivr.net/npm/merkletreejs@latest/merkletree.js"></script>
<script src="https://cdn.jsdelivr.net/npm/merkletree-viz@latest/merkletreeviz.js"></script>
```

Generate merkle tree and render visualization

```js
const leaves = ['a', 'b', 'c', 'd'].map(keccak256)
const tree = new MerkleTree(leaves, keccak256)
const viz = new MerkleTreeViz('#viz')
viz.renderTree(tree)
// viz.destroy()
```

<img src="https://user-images.githubusercontent.com/168240/201514143-52cc3627-d606-445d-94f3-e8d515f57b9e.png" width="500px" alt="viz" />

## License

[MIT](LICENSE)