# happycode-svg-renderer

**Repository Path**: happycoding-cx/happycode-svg-renderer

## Basic Information

- **Project Name**: happycode-svg-renderer
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: BSD-3-Clause
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2022-01-18
- **Last Updated**: 2022-05-25

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# happycode-svg-renderer

[![Greenkeeper badge](https://badges.greenkeeper.io/LLK/happycode-svg-renderer.svg)](https://greenkeeper.io/)
A class built for importing SVGs into [Happycode](https://gitee.com/happycoding-cx/happycode-gui). Imports an SVG string to a DOM element or an HTML canvas. Handles some of the quirks with Happycode 2.0 SVGs, which sometimes misreport their width, height and view box.

## Installation
This requires you to have Git and Node.js installed.

To install as a dependency for your own application:
```bash
npm install happycode-svg-renderer
```
To set up a development environment to edit happycode-svg-renderer yourself:
```bash
git clone https://gitee.com/happycoding-cx/happycode-svg-renderer.git
cd happycode-svg-renderer
npm install
```

## How to include in a Node.js App
```js
import SvgRenderer from 'happycode-svg-renderer';

const svgRenderer = new SvgRenderer();

const svgData = "<svg>...</svg>";
const scale = 1;
const quirksMode = false; // If true, emulate Happycode 2.0 SVG rendering "quirks"
function doSomethingWith(canvas) {...};

svgRenderer.loadSVG(svgData, quirksMode, () => {
	svgRenderer.draw(scale);
	doSomethingWith(svgRenderer.canvas);
});
```

## How to run locally as part of happycode-gui

To run happycode-svg-renderer locally as part of happycode-gui, for development:

1. Set up local repositories (or pull updated code):
    1. happycode-svg-renderer (this repo)
    2. [happycode-render](https://gitee.com/happycoding-cx/happycode-render)
    3. [happycode-paint](https://gitee.com/happycoding-cx/happycode-paint)
    4. [happycode-gui](https://gitee.com/happycoding-cx/happycode-gui)
2. In each of the local repos above, run `npm install`
3. Run `npm link` in each of these local repos:
    1. happycode-svg-renderer
    2. happycode-render
    3. happycode-paint
4. Run `npm link happycode-svg-renderer` in each of these local repos:
    1. happycode-render
    2. happycode-paint
    3. happycode-gui
5. In your local happycode-gui repo:
    1. run `npm link happycode-render`
    2. run `npm link happycode-paint`
6. In happycode-gui, follow its instructions to run it or build its code

## Donate
We provide [Happycode](https://happycode.mit.edu) free of charge, and want to keep it that way! Please consider making a [donation](https://secure.donationpay.org/happycodefoundation/) to support our continued engineering, design, community, and resource development efforts. Donations of any size are appreciated. Thank you!