A simple script for pure javascript charts.

Related tags

Data Visualization mk-charts
Overview

MK Charts

A simple pure Javascript for displaying circle charts.

Demo: https://mkirschen.de/mk-scripts/mk-charts/

Circle charts

alt text

To insert a chart all you need is the following div:

<div class="mkCharts" data-percent="15" />

The other attributes are optional and customize the appearance.

data-type      | default = circle
data-color     | default = #2F4F4F
data-size      | default = 100
data-stroke    | default = 1

Examples

<div class="mkCharts" data-percent="15"></div>
<div class="mkCharts" data-percent="42" data-color="#654321"></div>
<div class="mkCharts" data-percent="83" data-color="pink" data-size="125"></div>
<div class="mkCharts" data-percent="94" data-color="rgb(0,100,200)" data-size="155" data-stroke="3"></div>
You might also like...

Reusable JavaScript library for creating sketchy/hand-drawn styled charts in the browser.

Reusable JavaScript library for creating sketchy/hand-drawn styled charts in the browser.

roughViz.js is a reusable JavaScript library for creating sketchy/hand-drawn styled charts in the browser, based on D3v5, roughjs, and handy. Why? Use

Jan 4, 2023

Create beautiful JavaScript charts with one line of React

React Chartkick Create beautiful JavaScript charts with one line of React See it in action Supports Chart.js, Google Charts, and Highcharts Quick Star

Dec 28, 2022

📊 Interactive JavaScript Charts built on SVG

📊 Interactive JavaScript Charts built on SVG

A modern JavaScript charting library to build interactive charts and visualizations with simple API. Our Partner ApexCharts is now a partner of Fusion

Jan 3, 2023

Create beautiful JavaScript charts with one line of Ruby

Chartkick Create beautiful JavaScript charts with one line of Ruby. No more fighting with charting libraries! See it in action Chartkick 4.0 was recen

Jan 8, 2023

Emprise Javascript Charts

EJSChart 100% Powerful, Clean & Functional Javascript Charts Whether at home, a medium sized or enterprise venture, EJSCharts will seamlessly help you

Jun 3, 2021

Beautiful and interactive javascript charts for Java-based web applications.

Wicked Charts Beautiful and interactive JavaScript charts for Java-based web applications. Check out the Changelog Check out the Feature Overview with

Aug 23, 2022

📊 A highly interactive data-driven visualization grammar for statistical charts.

📊 A highly interactive data-driven visualization grammar for statistical charts.

English | 简体中文 G2 A highly interactive data-driven visualization grammar for statistical charts. Website • Tutorial Docs • Blog • G2Plot G2 is a visua

Dec 30, 2022

Progressive svg pie, donut, bar and line charts

Peity Peity (sounds like deity) is a jQuery plugin that converts an element's content into a mini svg pie, donut, line or bar chart. Basic Usage HTM

Jan 1, 2023

Charts for Raphaël

g.Raphaël - Official charting plugin for Raphaël For more information, see: http://g.raphaeljs.com/ Changelog v0.51 Fixed issues with piechart related

Dec 31, 2022
Owner
Marcus Kirschen
Marcus Kirschen
GitHub
Simple HTML5 Charts using the tag

Simple yet flexible JavaScript charting for designers & developers Documentation Currently, there are two versions of the library (2.9.4 and 3.x.x). V

Chart.js 59.4k Jan 7, 2023
Simple responsive charts

Big welcome by the Chartist Guy Checkout the documentation site at http://gionkunz.github.io/chartist-js/ Checkout this lightning talk that gives you

Gion Kunz 26 Dec 30, 2022
Simple, responsive, modern SVG Charts with zero dependencies

Frappe Charts GitHub-inspired modern, intuitive and responsive charts with zero dependencies Explore Demos » Edit at CodePen » Contents Installation U

Frappe 14.6k Jan 4, 2023
Simple package to facilitate and automate the use of charts in Laravel 5.x using Chartjs v2 library

laravel-chartjs - Chart.js v2 wrapper for Laravel 5.x Simple package to facilitate and automate the use of charts in Laravel 5.x using the Chart.js v2

Felix Costa 473 Dec 15, 2022
A simple ember component for adding Charts

Ember Chart This Ember CLI addon is a simple wrapper for ChartJS (v2.9). Compatibility Ember.js v3.12 or above Ember CLI v2.13 or above Node.js v10 or

Ahmed Omran 136 Oct 24, 2022
JavaScript diagramming library for interactive flowcharts, org charts, design tools, planning tools, visual languages.

GoJS, a JavaScript Library for HTML Diagrams GoJS is a JavaScript and TypeScript library for creating and manipulating diagrams, charts, and graphs. S

Northwoods Software Corporation 6.6k Dec 30, 2022
Attractive JavaScript charts for jQuery

flot About flot is a JavaScript plotting library for engineering and scientific applications derived from Flot: http://www.flotcharts.org/ Take a look

Flot 5.9k Dec 22, 2022
A plugin for the jQuery javascript library to generate small sparkline charts directly in the browser

jQuery Sparklines This jQuery plugin makes it easy to generate a number of different types of sparklines directly in the browser, using online a line

Gareth Watts 1.2k Jan 4, 2023
Create beautiful charts with one line of JavaScript

Chartkick.js Create beautiful charts with one line of JavaScript See it in action Supports Chart.js, Google Charts, and Highcharts Also available for

Andrew Kane 1.2k Jan 2, 2023
Ember Charts 3.5 2.3 L2 JavaScript A powerful and easy to use charting library for Ember.js

Ember Charts A charting library built with the Ember.js and d3.js frameworks. It includes time series, bar, pie, and scatter charts which are easy to

Addepar 793 Dec 7, 2022