regorxxx / Statistics-Framework-SMP

A helper script for Spider Monkey Panel and foobar2000 which allows to easily create customizable charts on demand, applying basic filtering, sorting and distribution settings.

Home Page:https://regorxxx.github.io/foobar2000-Framework-SMP.github.io/scripts/statistics-framework-smp/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Statistics-Framework-SMP

version CodeFactor CodacyBadge GitHub
A helper script for Spider Monkey Panel and foobar2000 which allows to easily create customizable charts on demand, applying basic filtering, sorting and distribution settings.

image

Features

  • Create charts: bars, scatter, line.
  • Colors, axis, background, margins, labels and points are customizable.
  • Built-in color palettes using Chroma and ColorBrewer, also colorblind friendly presets.
  • Data may be filtered, sorted or sliced on the fly.
  • Data may be fit to a distribution or shown 'as is' (with selected sorting).
  • Multiple series can be drawn on the same chart.
  • Built-in menus to customize charts.

statistics1

Usage

First create the chart object. In this case 2 series are added:

const chart = new _chart({
	data: [
		[{x:'A', y: 10},{x:'B', y: 4},{x:'C', y: 6},{x:'D', y: 7},{x:'E', y: 3}], 
		[{x:'A', y: 3},{x:'B', y: 7},{x:'C', y: 4},{x:'D', y: 2},{x:'E', y: 5}]
	],
	dataManipulation: {sort: null, filter: null, slice: null, distribution: null},
	background: {color: RGB(200,200,200)},
	margin: {left: _scale(20), right: _scale(10), top: _scale(10), bottom: _scale(15)},
	axis: {
		x: {show: true, color: RGB(0,0,0), width: _scale(2), ticks: 'auto', labels: true, key: 'Cities'}, 
		y: {show: true, color: RGB(0,0,0), width: _scale(2), ticks: 5, labels: true, key: 'Population'}
	},
	x: 0,
	w: window.Width,
	y: 0,
	h: window.Height,
	title: window.Name + ' - ' + 'Graph 1 {cities - population}',
	tooltipText: '\n\n(This is additional info)'
});

Then, you may want to associate it to the panel callbacks or event listeners for painting, resizing, mouse...:

function on_paint(gr) {
	if (!window.Width || !window.Height) {return;}
	chart.paint(gr);
}

function on_size() {
	const w = window.Width;
	const h = window.Height;
	const x = 0;
	const y = 0;
	if (!w || !h) {return;}
	chart.changeConfig({x, y, w, h});
}

function on_mouse_move(x, y, mask) {
	chart.move(x,y);
}

function on_mouse_leave(x, y, mask) {
	chart.leave();
};

A menu can also be added:

include('helpers\\statistics_xxx_menu.js'); // menu_xxx.js must also be present!
bindMenu(chart);
function on_mouse_rbtn_up(x, y) {
	chart.rbtn_up(x,y);
	return true; // left shift + left windows key will bypass this callback and will open default context menu.
}

statistics3

There are more usage examples on the 'examples' folder.

Other implementations

  1. Timeline-SMP: Interactive Timeline of your library. Configurable by Title Format.
  2. Playlist-Manager-SMP: A playlist manager for foobar2000.
  3. World-Map-SMP: Displays current artist's country on the world map.

Installation

Since the framework only requires 1 file, i.e. the main one, you can simply include it along any other script where you will use the charts. The helpers will be loaded automatically.

When using the extra menus, the menu framework file must be present too.

carbon

About

A helper script for Spider Monkey Panel and foobar2000 which allows to easily create customizable charts on demand, applying basic filtering, sorting and distribution settings.

https://regorxxx.github.io/foobar2000-Framework-SMP.github.io/scripts/statistics-framework-smp/

License:GNU Affero General Public License v3.0


Languages

Language:JavaScript 100.0%