Graphing Plugin

Library for Calculator (Graphing)

此腳本不應該直接安裝,它是一個供其他腳本使用的函式庫。欲使用本函式庫,請在腳本 metadata 寫上: // @require https://update.gf.qytechs.cn/scripts/503150/1425747/Graphing%20Plugin.js

  1. // ==UserScript==
  2. // @name Graphing Plugin
  3. // @namespace https://gf.qytechs.cn/en/users/1291009
  4. // @author BadOrBest
  5. // @license MIT
  6. // @version 1.4
  7. // @description A library for adding and managing graphs on any webpage.
  8. // @grant none
  9. // @require https://cdnjs.cloudflare.com/ajax/libs/mathjs/13.0.3/math.min.js
  10. // @require https://cdnjs.cloudflare.com/ajax/libs/Chart.js/4.4.1/chart.min.js
  11. // ==/UserScript==
  12.  
  13. (function(global) {
  14. 'use strict';
  15.  
  16. console.log('Graphing Library loaded');
  17.  
  18. global.GraphingLibrary = {
  19. chartInstance: null,
  20.  
  21. createCanvas: function() {
  22. let canvas = document.getElementById('graphCanvas');
  23. if (!canvas) {
  24. canvas = document.createElement('canvas');
  25. canvas.id = 'graphCanvas';
  26. canvas.style.position = 'fixed';
  27. canvas.style.bottom = '0';
  28. canvas.style.right = '0';
  29. canvas.style.zIndex = '9999';
  30. canvas.style.width = '600px'; // Set canvas width
  31. canvas.style.height = '400px'; // Set canvas height
  32. document.body.appendChild(canvas);
  33. console.log('Canvas created');
  34. }
  35. return canvas;
  36. },
  37.  
  38. updateGraph: function() {
  39. console.log('Updating graph');
  40. const graphData = JSON.parse(localStorage.getItem('graphData') || '[]');
  41. const canvas = this.createCanvas();
  42. const ctx = canvas.getContext('2d');
  43.  
  44. if (this.chartInstance) {
  45. this.chartInstance.destroy();
  46. }
  47.  
  48. this.chartInstance = new Chart(ctx, {
  49. type: 'line',
  50. data: {
  51. datasets: graphData.map(data => ({
  52. label: data.label,
  53. data: data.points,
  54. borderColor: data.color || 'blue',
  55. borderWidth: 1,
  56. fill: false
  57. }))
  58. },
  59. options: {
  60. scales: {
  61. x: {
  62. type: 'linear',
  63. position: 'bottom'
  64. }
  65. }
  66. }
  67. });
  68. },
  69.  
  70. toggleGraph: function() {
  71. const canvas = this.createCanvas();
  72. canvas.style.display = canvas.style.display === 'none' ? 'block' : 'none';
  73. if (canvas.style.display === 'block') {
  74. this.updateGraph();
  75. }
  76. console.log('Toggled graph display');
  77. },
  78.  
  79. clearGraph: function() {
  80. localStorage.setItem('graphData', JSON.stringify([]));
  81. const canvas = document.getElementById('graphCanvas');
  82. if (canvas) {
  83. canvas.style.display = 'none';
  84. }
  85. if (this.chartInstance) {
  86. this.chartInstance.destroy();
  87. this.chartInstance = null;
  88. }
  89. console.log('Cleared graph data');
  90. },
  91.  
  92. addGraphData: function(expression) {
  93. if (expression) {
  94. try {
  95. const xValues = Array.from({ length: 100 }, (_, i) => i - 50); // X values from -50 to 50
  96. const yValues = xValues.map(x => math.evaluate(expression.replace(/x/g, x))); // Evaluate expression
  97.  
  98. const newGraphData = JSON.parse(localStorage.getItem('graphData') || '[]');
  99. newGraphData.push({
  100. label: `Graph ${newGraphData.length + 1}`,
  101. points: xValues.map((x, i) => ({ x, y: yValues[i] }))
  102. });
  103.  
  104. localStorage.setItem('graphData', JSON.stringify(newGraphData));
  105. this.updateGraph();
  106. console.log('Added graph data');
  107. } catch (error) {
  108. alert('Error evaluating expression: ' + error.message);
  109. console.error('Error evaluating expression:', error);
  110. }
  111. }
  112. }
  113. };
  114.  
  115. // Initialize or update the graph display if needed
  116. if (JSON.parse(localStorage.getItem('graphData') || '[]').length > 0) {
  117. GraphingLibrary.toggleGraph();
  118. }
  119.  
  120. })(window);

QingJ © 2025

镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址