Edit in JSFiddle

//=============================================================================
// Sphinx-Chart2EasingScene.js
//=============================================================================

/*:
 * @plugindesc Scène de démonstration du plugin Sphinx-MathEasing
 * @author Sphinx
 *
 * @help
 * //==========================================================================
 * // Plugin : Sphinx-Chart2EasingScene
 * // Date   : 30 décembre 2019
 * // Auteur : Sphinx
 * //==========================================================================
 * 
 * Dépendances :
 *     - Sphinx-Chart2
 * @param background
 * @text Image d'arrière plan de la scène
 * @type file
 * @dir img/titles1/
 * @require 1
 */
//-----------------------------------------------------------------------------
// Game_Interpreter
//
// Commandes de plugin
Sphinx_ChartEasing_Game_Interpreter_pluginCommand = Game_Interpreter.prototype.pluginCommand;
Game_Interpreter.prototype.pluginCommand = function(command, args) {
    Sphinx_ChartEasing_Game_Interpreter_pluginCommand.call(this, command, args);
    if(command === "DEMO_EASING_GRAPH") {
        SceneManager.push(Scene_EasingChart2);
    }
};

//-----------------------------------------------------------------------------
// Scene_EasingChart2
//
// Scène de démonstration du plugin Sphinx-Chart2
function Scene_EasingChart2() {
    this.initialize.apply(this, arguments);
};

Scene_EasingChart2.prototype = Object.create(Scene_Base.prototype);
Scene_EasingChart2.prototype.constructor = Scene_EasingChart2;

Scene_EasingChart2.prototype.initialize = function() {
    Scene_Base.prototype.initialize.call(this);
};

Scene_EasingChart2.prototype.create = function() {
    Scene_Base.prototype.create.call(this);
    this.createBackground();
    this.createTexts();
    this.createButtons();
    this.listEasing = Object.keys(Math.easing);
    this.easing = 0;
};

Scene_EasingChart2.prototype.start = function() {
    Scene_Base.prototype.start.call(this);
    this.drawGraph();
    this.startFadeIn(this.fadeSpeed(), false);
};

Scene_EasingChart2.prototype.terminate = function() {
    Scene_Base.prototype.terminate.call(this);
    SceneManager.goto(Scene_Map);
    this.startFadeOut(this.fadeSpeed(), false);
};

Scene_EasingChart2.prototype.update = function() {
    Scene_Base.prototype.update.call(this);
    if(Input.isTriggered("cancel")) {
        SoundManager.playCancel();
        this.terminate();
    }
};

Scene_EasingChart2.prototype.createBackground = function() {
    this._background = new Sprite_Base();
    background = PluginManager.parameters("Sphinx-Chart2EasingScene")["background"];
    this._background.bitmap = ImageManager.loadTitle1(background);
    this.addChildAt(this._background, 0);
};

Scene_EasingChart2.prototype.createTexts = function() {
    this._titleText = new Sprite_Base();
    this._titleText.x = 0;
    this._titleText.y = 0;
    this._titleText.width = Graphics.boxWidth;
    this._titleText.height = (Graphics.boxHeight - 480) / 2;
    this._titleText.bitmap = new Bitmap(Graphics.boxWidth, (Graphics.boxHeight - 480) / 2);
    this._titleText.bitmap.drawText("Méthodes d'accélération - Math.easing", 0, 16, Graphics.boxWidth - 32, 40, "center");
    this.addChildAt(this._titleText, 1);
    
    this._explicationText1 = new Sprite_Base();
    this._explicationText1.x = 0;
    this._explicationText1.y = Graphics.boxHeight - ((Graphics.boxHeight - 480) / 2);
    this._explicationText1.width = Graphics.boxWidth;
    this._explicationText1.height = (Graphics.boxHeight - 480) / 4;
    this._explicationText1.bitmap = new Bitmap(Graphics.boxWidth, (Graphics.boxHeight - 480) / 4);
    this._explicationText1.bitmap.fontSize = 18;
    this._explicationText1.bitmap.drawText("Naviguez entre les graphiques grâce aux flèches.", 0, 8, Graphics.boxWidth - 32, 20, "center");
    this.addChildAt(this._explicationText1, 2);
    
    this._explicationText2 = new Sprite_Base();
    this._explicationText2.x = 0;
    this._explicationText2.y = Graphics.boxHeight - ((Graphics.boxHeight - 480) / 4);
    this._explicationText2.width = Graphics.boxWidth;
    this._explicationText2.height = (Graphics.boxHeight - 480) / 4;
    this._explicationText2.bitmap = new Bitmap(Graphics.boxWidth, (Graphics.boxHeight - 480) / 4);
    this._explicationText2.bitmap.fontSize = 18;
    this._explicationText2.bitmap.drawText("gauche et droite de votre clavier.", 0, 8, Graphics.boxWidth - 32, 20, "center");
    this.addChildAt(this._explicationText2, 3);
};

Scene_EasingChart2.prototype.createButtons = function() {
    var bitmap = ImageManager.loadSystem('ButtonSet');
    var buttonLeft = new Sprite_Button();
    buttonLeft.bitmap = bitmap;
    buttonLeft.setColdFrame(48, 0, 48, 48);
    buttonLeft.setHotFrame(48, 48, 48, 48);
    buttonLeft.rotation = 90 * Math.PI / 180;
    buttonLeft.anchor.x = 0.5;
    buttonLeft.anchor.y = 0.5;
    buttonLeft.x = 16 + 24;
    buttonLeft.y = (Graphics.boxHeight - 48) / 2;
    buttonLeft.setClickHandler(Scene_EasingChart2.prototype.goToLeft.bind(this));
    this.addChild(buttonLeft);
    
    var buttonRight = new Sprite_Button();
    buttonRight.bitmap = bitmap;
    buttonRight.setColdFrame(96, 0, 48, 48);
    buttonRight.setHotFrame(96, 48, 48, 48);
    buttonRight.rotation = 90 * Math.PI / 180;
    buttonRight.anchor.x = 0.5;
    buttonRight.anchor.y = 0.5;
    buttonRight.x = Graphics.boxWidth - 16 - 24;
    buttonRight.y = (Graphics.boxHeight - 48) / 2;
    buttonRight.setClickHandler(Scene_EasingChart2.prototype.goToRight.bind(this));
    this.addChild(buttonRight);
};

Scene_EasingChart2.prototype.goToLeft = function() {
    this.easing--;
    if(this.easing < 0) this.easing = this.listEasing.length - 1;
    this.drawGraph();
};

Scene_EasingChart2.prototype.goToRight = function() {
    this.easing++;
    if(this.easing >= this.listEasing.length) this.easing = 0;
    this.drawGraph();
};

Scene_EasingChart2.prototype.drawGraph = function() {
    categories = [ this.listEasing[this.easing] ];
    xLabels = [];
    datas = [ [] ];
    for(i = 0; i <= 150; ++i) {
        xLabels.push(i);
        datas[0].push(Math.easing[this.listEasing[this.easing]](i, 0, 150, 150));
    }
    if(this.chart) {
        this.chart.destroy();
    }
    console.log(this.listEasing[this.easing], datas);
    this.chart = new SphinxChart2({
        type: "line",
        title: "Easing - " + this.listEasing[this.easing].capitalize(),
        categoriesLabels: categories,
        xAxisLabels: xLabels,
        datas: datas,
        options: {
            easing: this.listEasing[this.easing],
            duration: 1,
            background: "transparent",
            forceMinToZero: false,
            position: {
                x: 88,
                y: (Graphics.boxHeight - 480) / 2,
                width: 640,
                height: 480,
            },
            padding: {
                top: 10,
                left: 25,
                right: 25,
                bottom: 25,
            }
        }
    });
    this.addChildAt(this.chart, 4);
};

Scene_EasingChart2.prototype.fastForwardRate = function() {
    return 3;
};

Scene_EasingChart2.prototype.isFastForward = function() {
    return (Input.isPressed('ok') || Input.isPressed('shift') || TouchInput.isPressed());
};

Scene_EasingChart2.prototype.updateFade = function() {
    if(this._fadeDuration > 0) {
        var d = this._fadeDuration;
        if(this.isFastForward()) {
            d -= this.fastForwardRate() - 1;
            this._fadeDuration -= this.fastForwardRate();
        } else {
            this._fadeDuration--;
        }
        if(this._fadeSign > 0) {
            this._fadeSprite.opacity -= this._fadeSprite.opacity / d;
        } else {
            this._fadeSprite.opacity += (255 - this._fadeSprite.opacity) / d;
        }
    }
};

Scene_EasingChart2.prototype.fadeSpeed = function(ignoreFast) {
    return 30;
};