Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/rousan/samples-viewer-generator
:tada: A CLI utility tool to generate web app of data visualization samples for presentation purpose
https://github.com/rousan/samples-viewer-generator
boilerplate chart cli data generator viz
Last synced: about 2 months ago
JSON representation
:tada: A CLI utility tool to generate web app of data visualization samples for presentation purpose
- Host: GitHub
- URL: https://github.com/rousan/samples-viewer-generator
- Owner: rousan
- License: mit
- Created: 2018-04-27T08:21:44.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2018-05-02T14:07:18.000Z (over 6 years ago)
- Last Synced: 2024-07-24T23:17:32.627Z (about 2 months ago)
- Topics: boilerplate, chart, cli, data, generator, viz
- Language: CSS
- Homepage: https://rousan.io/samples-viewer-generator
- Size: 1.06 MB
- Stars: 13
- Watchers: 3
- Forks: 0
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
Awesome Lists containing this project
README
[](https://travis-ci.org/rousan/samples-viewer-generator)
[](https://www.npmjs.com/package/samples-viewer-generator)
[](https://www.npmjs.com/package/samples-viewer-generator)
[](https://www.npmjs.com/package/samples-viewer-generator)
[](https://github.com/rousan/samples-viewer-generator/graphs/contributors)
[](https://github.com/rousan/samples-viewer-generator/blob/master/LICENSE)
# samples-viewer-generator
A CLI utility to generate an web app structure as `samples viewer` quickly for `presentation` purpose. It
can be used to present your existing data visualization samples in professional way.
> An utility tool to generate data viz samples viewer web app quickly.
## Demo
[Here](http://rousan.io/samples-viewer-generator/) is the demo.
## Requirements
`node` >= `v4.0.0`
**Note**: If `node` and `npm` are not installed, Install those from [here](https://nodejs.org/en/download/).
## Installation
Install this tool using `npm`:
```bash
$ npm install -g samples-viewer-generator
```
It installs two binaries: `samples-viewer-generator` and `svgen` to your system path.
## Usage
At first you need to create a `config` file in `JSON` format consisting of sample details,
`favicon`, `title` for web app etc. as follows:
The `config.json` file:
```json
{
"site": {
"title": "",
"heading": "",
"logo": " [optional]",
"favicon": " [optional]",
"customCSS": " [optional]"
},
"samples": [
{
"name": "",
"desc": "",
"icon": " [optional]",
"chart": "",
"html": " [optional]",
"js": " [optional]",
"data": " [optional]",
"notes": " [optional]"
}
]
}
```
See [example](https://github.com/rousan/samples-viewer-generator/tree/master/example) folder for more info.
Then you need to run the cli command `svgen` (alias of `samples-viewer-generator`) as follows:
```bash
$ svgen -c config.json -o my-samples-viewer
create : site logo
create : site favicon
create : custom CSS
create : index.html
create : CSS assets
create : JavaScript assets
create : image assets
create : sample Simple column chart
create : sample Area 2D chart with gradient
create : sample Pie chart with legend
create : sample Zoom line dual Y axis chart
create : sample Simple World map
create : site config
```
Voila! Your samples viewer is generated within seconds.
**Note**: You should open the generated web app via any local server or remote one. It wouldn't work, if
you open through
`file://` protocol.
## Contributing
Your PRs and stars are always welcome.
Checkout the [CONTRIBUTING](https://github.com/rousan/samples-viewer-generator/blob/master/CONTRIBUTING.md) guides.