Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/chfw/echarts-scrappeteer

Puppeteer! Scrape all echarts in this web page please!
https://github.com/chfw/echarts-scrappeteer

Last synced: about 1 month ago
JSON representation

Puppeteer! Scrape all echarts in this web page please!

Host: GitHub
URL: https://github.com/chfw/echarts-scrappeteer
Owner: chfw
Created: 2017-09-04T07:58:36.000Z (over 7 years ago)
Default Branch: master
Last Pushed: 2018-01-09T21:19:19.000Z (almost 7 years ago)
Last Synced: 2024-11-02T00:42:13.629Z (about 1 month ago)
Language: JavaScript
Homepage:
Size: 2.43 MB
Stars: 45
Watchers: 4
Forks: 7
Open Issues: 0
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md

Awesome Lists containing this project

awesome-echarts - echarts-scrappeteer - Puppeteer! Scrape all Apache ECharts from this web page please! (Languages / Node.js)

README

# Echarts Scraper Puppeteer

[![Build Status](https://travis-ci.org/chfw/echarts-scrappeteer.svg?branch=master)](https://travis-ci.org/chfw/echarts-scrappeteer) [![codecov](https://codecov.io/gh/chfw/echarts-scrappeteer/branch/master/graph/badge.svg)](https://codecov.io/gh/chfw/echarts-scrappeteer) [![npm version](https://badge.fury.io/js/echarts-scrappeteer.svg)](https://badge.fury.io/js/echarts-scrappeteer)

For svg output, it is required that **echarts 3.8+** is used and the echarts instance
is [renderred as svg](https://ecomfe.github.io/echarts-doc/public/en/tutorial.html#Render%20by%20Canvas%20or%20SVG).

## Introduction

It scrapes all echarts found in a web page as images. And it scrapes 3D charts too. Of course, it supports
[pyecharts](https://github.com/chenjiandongx/pyecharts) as well. Please find the example in later section.

![demo](https://github.com/chfw/echarts-scrappeteer/raw/master/demo.gif)

## Installation

```shell
$ npm i -g echarts-scrappeteer
```

### requirements

Node 7.6.0 or later

## Usage

```shell

Usage: scrappeteer [options]

Options:

-f, --format image format
-o, --output output file name
-w, --wait wait a while before scrapping
-v, --viewPort force puppeteer to set viewport. for echarts gallery site only
-r, --clipRectangle record rectangle when making gif animation
-c, --frameCounts of frames. gif only
-i, --frameInterval frame intervals. gif only
-s, --skipFrames skip initial frames. gif only
-g, --gap time between each gif snapshot. gif only
-h, --help output usage information
```

If the page load speed is slow or if the resulting image is partial, `-w` parameter is
required to delay the scrape action.

Please note that if more than one echarts should be found in a page, `-f` option applies to all.

## Example

### Scrape echarts from a URL

Here is the command for your discretion:

```
$ scrappeteer https://pyecharts.github.io/echarts-china-cities-js/preview.html
```

### Scrape echarts from a local file

```shell
$ scrappeteer render.html
```

Where does the `render.html` come from? It is genereted by pyecharts. Please visit [pyecharts-demo.py](https://github.com/chfw/echarts-scrappeteer/blob/master/pyecharts-demo/pyecharts-demo.py).

![scrape pyecharts](https://github.com/chfw/echarts-scrappeteer/raw/master/scraped-gallery/output.4.png)

## Gallery

### Gif format :fire:

```shell
scrappeteer http://gallery.echartsjs.com/editor.html?c=xrkJtnKJq- -w 2000 -f gif -r 525,50,770,750 -o gf3 -i 300 -c 10 -v 1300,800
```

[![high speed route](https://github.com/chfw/echarts-scrappeteer/raw/master/scraped-gallery/shenzhen.gif)](http://gallery.echartsjs.com/editor.html?c=xrkJtnKJq-)

### Static images

[![step count](https://github.com/chfw/echarts-scrappeteer/raw/master/scraped-gallery/step-count.png)](http://gallery.echartsjs.com/editor.html?c=calendar-effectScatter)
[![pig plan](https://github.com/chfw/echarts-scrappeteer/raw/master/scraped-gallery/pig-plan.png)](http://gallery.echartsjs.com/editor.html?c=xByUX8HuDZ)
[![surface wave](https://github.com/chfw/echarts-scrappeteer/raw/master/scraped-gallery/surface-wave.png)](http://gallery.echartsjs.com/editor.html?c=xHkcYXm9pe)

## LICENSE

ISC