Method perform_render

js/src/widget.ts:836–924

* The perform_render method is called by processLuminoMessage * after the widget's DOM element has been attached to the notebook * output cell. This happens after the initialize of the * FigureModel, and it won't happen at all if the Python FigureWidget * is never displayed in a notebook

()

   * is never displayed in a notebook output cell
   */
  perform_render() {
    var that = this;

    // Wire up message property callbacks
    // ----------------------------------
    // Python -> JS event properties
    this.model.on("change:_py2js_addTraces", () => this.do_addTraces());
    this.model.on("change:_py2js_deleteTraces", () => this.do_deleteTraces());
    this.model.on("change:_py2js_moveTraces", () => this.do_moveTraces());
    this.model.on("change:_py2js_restyle", () => this.do_restyle());
    this.model.on("change:_py2js_relayout", () => this.do_relayout());
    this.model.on("change:_py2js_update", () => this.do_update());
    this.model.on("change:_py2js_animate", () => this.do_animate());

    // MathJax v2 configuration
    // ---------------------
    (window as any)?.MathJax?.Hub?.Config?.({ SVG: { font: "STIX-Web" } });

    // Get message ids
    // ---------------------
    var layout_edit_id = this.model.get("_last_layout_edit_id");
    var trace_edit_id = this.model.get("_last_trace_edit_id");

    // Set view UID
    // ------------
    this.viewID = randstr();

    // Initialize Plotly.js figure
    // ---------------------------
    // We must clone the model's data and layout properties so that
    // the model is not directly mutated by the Plotly.js library.
    var initialTraces = _.cloneDeep(this.model.get("_widget_data"));
    var initialLayout = _.cloneDeep(this.model.get("_widget_layout"));
    if (!initialLayout.height) {
      initialLayout.height = 360;
    }
    var config = this.model.get("_config");
    config.editSelection = false;

    Plotly.newPlot(that.el, initialTraces, initialLayout, config).then(
      function () {
        // ### Send trace deltas ###
        // We create an array of deltas corresponding to the new
        // traces.
        that._sendTraceDeltas(trace_edit_id);

        // ### Send layout delta ###
        that._sendLayoutDelta(layout_edit_id);

        // Wire up plotly event callbacks
        (<Plotly.PlotlyHTMLElement>that.el).on("plotly_restyle", function (update: any) {
          that.handle_plotly_restyle(update);
        });
        (<Plotly.PlotlyHTMLElement>that.el).on("plotly_relayout", function (update: any) {
          that.handle_plotly_relayout(update);
        });
        (<Plotly.PlotlyHTMLElement>that.el).on("plotly_update", function (update: any) {
          that.handle_plotly_update(update);