All Projects β†’ qlik-oss β†’ Picasso.js

qlik-oss / Picasso.js

Licence: mit
A charting library streamlined for building interactive visualizations for the Qlik product suites.

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to Picasso.js

Svg Radar Chart
Generate SVG radar charts.
Stars: ✭ 45 (-74.29%)
Mutual labels:  svg, dataviz, chart
Ngx Charts
πŸ“Š Declarative Charting Framework for Angular
Stars: ✭ 4,057 (+2218.29%)
Mutual labels:  svg, dataviz, chart
Wechart
Create all the [ch]arts by cax or three.js - Cax ε’Œ three.js εˆ›ι€ δΈ€εˆ‡ε›Ύ[葨]
Stars: ✭ 152 (-13.14%)
Mutual labels:  svg, chart, canvas
Amcharts4
The most advanced amCharts charting library for JavaScript and TypeScript apps.
Stars: ✭ 907 (+418.29%)
Mutual labels:  svg, dataviz, chart
Nivo
nivo provides a rich set of dataviz components, built on top of the awesome d3 and React libraries
Stars: ✭ 9,550 (+5357.14%)
Mutual labels:  svg, dataviz, canvas
React Native Chart
[NOT MAINTAINED] πŸ“Š Add line, area, pie, and bar charts to your React Native app
Stars: ✭ 1,574 (+799.43%)
Mutual labels:  svg, chart
G2
πŸ“Š A highly interactive data-driven visualization grammar for statistical charts.
Stars: ✭ 11,020 (+6197.14%)
Mutual labels:  svg, canvas
Earthjs
D3 Earth JS
Stars: ✭ 128 (-26.86%)
Mutual labels:  svg, canvas
Alien.js
Future web pattern
Stars: ✭ 141 (-19.43%)
Mutual labels:  svg, canvas
Vue Graph
⚑️ Vue components based on the JUI chart available in Vue.js
Stars: ✭ 114 (-34.86%)
Mutual labels:  svg, canvas
Typesettable
πŸ“ A typesetting library for SVG and Canvas
Stars: ✭ 134 (-23.43%)
Mutual labels:  svg, canvas
Pyecharts Snapshot
renders the output of pyecharts as png, jpeg, gif, svg, eps, pdf and raw base64
Stars: ✭ 142 (-18.86%)
Mutual labels:  svg, chart
Xsound
Web Audio API Library for Synthesizer, Effects, Visualization, Multi-Track Recording, Audio Streaming, Visual Audio Sprite ...
Stars: ✭ 123 (-29.71%)
Mutual labels:  svg, canvas
Pixelfarm
From Vectors to (sub) Pixels, C# 2D Rendering Library
Stars: ✭ 120 (-31.43%)
Mutual labels:  svg, canvas
Zfont
πŸ’¬ Text plugin for Zdog - works with any .ttf font!
Stars: ✭ 126 (-28%)
Mutual labels:  svg, canvas
X6
πŸš€ JavaScript diagramming library that uses SVG and HTML for rendering.
Stars: ✭ 2,686 (+1434.86%)
Mutual labels:  svg, chart
Plutovg
Tiny 2D vector graphics library in C
Stars: ✭ 141 (-19.43%)
Mutual labels:  svg, canvas
Gantt
Gantt chart library using jsx support SVG, Canvas and SSR
Stars: ✭ 148 (-15.43%)
Mutual labels:  svg, canvas
Zeu
A JavaScript library for real-time visualization
Stars: ✭ 1,777 (+915.43%)
Mutual labels:  chart, canvas
Vue Tree Chart
flexible tree chart using Canvas and Svg, powered by D3.js
Stars: ✭ 149 (-14.86%)
Mutual labels:  svg, canvas

CircleCI Coverage Status

picasso.js

A charting library streamlined for building interactive visualizations for the Qlik product suites.

Examples

Getting started

Installing

npm install picasso.js

Usage

import picasso from 'picasso.js';

picasso.chart({
  element: document.querySelector('#container'), // container must have a width and height specified
  settings: {
    scales: {
      budget: { max: 5000, min: 0 },
      sales: { max: 11000, min: 3000, invert: true },
    },
    components: [
      {
        type: 'axis',
        scale: 'budget',
        layout: {
          dock: 'bottom',
        },
      },
      {
        type: 'axis',
        scale: 'sales',
        layout: {
          dock: 'left',
        },
      },
      {
        type: 'point',
        data: [
          { sales: 7456, margin: 0.3, budget: 4557 },
          { sales: 5603, margin: 0.7, budget: 2234 },
          { sales: 8603, margin: 0.6, budget: 4121 },
          { sales: 4562, margin: 0.4, budget: 1234 },
          { sales: 9873, margin: 0.9, budget: 3453 },
        ],
        settings: {
          x: { scale: 'budget', fn: (d) => d.scale(d.datum.value.budget) },
          y: { scale: 'sales', fn: (d) => d.scale(d.datum.value.sales) },
          size: (d) => d.datum.value.margin,
        },
      },
    ],
  },
});

Bubbles

More examples

Run examples locally

See and try out picasso features by starting the development studio by running:

yarn start

Contributing

Please follow the instructions in our contributing guide.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].