Ви не можете вибрати більше 25 тем Теми мають розпочинатися з літери або цифри, можуть містити дефіси (-) і не повинні перевищувати 35 символів.
 
 
 
Shivam Mishra 2f459bc345 chore: update readme links 4 роки тому
.github chore: update action 4 роки тому
docs chore: bump to 1.5.6 4 роки тому
src chore: bump to 1.5.8 4 роки тому
.babelrc [COV, TEST] Add coveralls 7 роки тому
.eslintrc.json Apply suggestions from code review 5 роки тому
.gitignore feat: ignore dist 4 роки тому
.travis.yml [COV, TEST] Add coveralls 7 роки тому
LICENSE Initial commit 7 роки тому
Makefile [COV, TEST] Add coveralls 7 роки тому
README.md chore: update readme links 4 роки тому
package-lock.json chore(deps): bump lodash from 4.17.11 to 4.17.21 (#335) 4 роки тому
package.json chore: bump to 1.6.0 4 роки тому
rollup.config.js feat: use UMD instead of IIFE for browser target (#336) 4 роки тому
yarn.lock chore(deps): bump lodash from 4.17.11 to 4.17.21 (#335) 4 роки тому

README.md

Frappe Charts

GitHub-inspired modern, intuitive and responsive charts with zero dependencies

Explore Demos » Edit at CodeSandbox » Documentation »

Contents

Installation

Via NPM

Install via npm:

$ npm install frappe-charts

and include in your project:

import { Chart } from "frappe-charts"

Or include following for es-modules(eg:vuejs):

import { Chart } from 'frappe-charts/dist/frappe-charts.esm.js'
// import css
import 'frappe-charts/dist/frappe-charts.min.css'
or include within your HTML
<script src="https://cdn.jsdelivr.net/npm/frappe-charts@1.1.0/dist/frappe-charts.min.umd.js"></script>
<!-- or -->
<script src="https://unpkg.com/frappe-charts@1.1.0/dist/frappe-charts.min.umd.js"></script>

Usage

const data = {
    labels: ["12am-3am", "3am-6pm", "6am-9am", "9am-12am",
        "12pm-3pm", "3pm-6pm", "6pm-9pm", "9am-12am"
    ],
    datasets: [
        {
            name: "Some Data", type: "bar",
            values: [25, 40, 30, 35, 8, 52, 17, -4]
        },
        {
            name: "Another Set", type: "line",
            values: [25, 50, -10, 15, 18, 32, 27, 14]
        }
    ]
}

const chart = new frappe.Chart("#chart", {  // or a DOM element,
                                            // new Chart() in case of ES6 module with above usage
    title: "My Awesome Chart",
    data: data,
    type: 'axis-mixed', // or 'bar', 'line', 'scatter', 'pie', 'percentage'
    height: 250,
    colors: ['#7cd6fd', '#743ee2']
})

Or for es-modules (replace new frappe.Chart() with new Chart()):

- const chart = new frappe.Chart("#chart", {
+ const chart = new Chart("#chart", {  // or a DOM element,
                                    // new Chart() in case of ES6 module with above usage
    title: "My Awesome Chart",
    data: data,
    type: 'axis-mixed', // or 'bar', 'line', 'scatter', 'pie', 'percentage'
    height: 250,
    colors: ['#7cd6fd', '#743ee2']
})

If you want to contribute:

  1. Clone this repo.
  2. cd into project directory
  3. npm install
  4. npm run dev

License

This repository has been released under the MIT License


Project maintained by Frappe. Used in ERPNext. Read the blog post.