Graphing Plugin

Library for Calculator (Graphing)

Version vom 10.08.2024. Aktuellste Version

Dieses Skript sollte nicht direkt installiert werden. Es handelt sich hier um eine Bibliothek für andere Skripte, welche über folgenden Befehl in den Metadaten eines Skriptes eingebunden wird // @require https://update.greasyfork.org/scripts/503150/1425281/Graphing%20Plugin.js

// ==UserScript==
// @name         Graphing Plugin
// @namespace    https://greasyfork.org/en/users/1291009
// @author       BadOrBest
// @license      MIT
// @version      1.2
// @match        *://*/*
// @grant        GM_addStyle
// @grant        GM_setValue
// @grant        GM_getValue
// @grant        GM_deleteValue
// @grant        GM_registerMenuCommand
// @grant        GM.registerMenuCommand
// @require      https://cdnjs.cloudflare.com/ajax/libs/mathjs/13.0.3/math.min.js
// @require      https://cdnjs.cloudflare.com/ajax/libs/Chart.js/4.4.1/chart.min.js
// ==/UserScript==

(function() {
    'use strict';

    let chartInstance = null;

    // Function to initialize or update the graph
    function updateGraph() {
        const graphData = GM_getValue('graphData', []);
        const ctx = document.getElementById('graphCanvas').getContext('2d');

        if (chartInstance) {
            chartInstance.destroy();
        }

        chartInstance = new Chart(ctx, {
            type: 'line',
            data: {
                datasets: graphData.map(data => ({
                    label: data.label,
                    data: data.points,
                    borderColor: data.color || 'blue',
                    borderWidth: 1,
                    fill: false
                }))
            },
            options: {
                scales: {
                    x: {
                        type: 'linear',
                        position: 'bottom'
                    }
                }
            }
        });
    }

    // Function to toggle the graph display
    function toggleGraph() {
        let canvas = document.getElementById('graphCanvas');
        if (!canvas) {
            canvas = document.createElement('canvas');
            canvas.id = 'graphCanvas';
            canvas.style.position = 'fixed';
            canvas.style.bottom = '0';
            canvas.style.right = '0';
            canvas.style.zIndex = '9999';
            document.body.appendChild(canvas);
        } else {
            canvas.style.display = canvas.style.display === 'none' ? 'block' : 'none';
            if (canvas.style.display === 'block') {
                updateGraph();
            }
        }
    }

    // Function to clear the graph data
    function clearGraph() {
        GM_setValue('graphData', []);
        const canvas = document.getElementById('graphCanvas');
        if (canvas) {
            canvas.style.display = 'none';
        }
        if (chartInstance) {
            chartInstance.destroy();
            chartInstance = null;
        }
    }

    // Function to process user input and update graph data
    function addGraphData() {
        const expression = prompt('Enter a mathematical expression (e.g., y=x^2):');
        if (expression) {
            const xValues = Array.from({ length: 100 }, (_, i) => i - 50); // X values from -50 to 50
            const yValues = xValues.map(x => math.evaluate(expression.replace(/x/g, x))); // Evaluate expression

            const newGraphData = GM_getValue('graphData', []);
            newGraphData.push({
                label: `Graph ${newGraphData.length + 1}`,
                points: xValues.map((x, i) => ({ x, y: yValues[i] }))
            });

            GM_setValue('graphData', newGraphData);
            updateGraph();
        }
    }

    // Register menu commands for graphing actions
    GM_registerMenuCommand('Clear Graph', clearGraph);
    GM_registerMenuCommand('Add Graph Data', addGraphData);

    // Listen for custom events to control the graph
    window.addEventListener('graphControlEvent', (event) => {
        const { action } = event.detail;
        if (action === 'toggle') {
            toggleGraph();
        }
    });

    // Initialize or update the graph display if needed
    if (GM_getValue('graphData', []).length > 0) {
        updateGraph();
    }
})();