Redraw breaks rendering

[koliyo]

Plot redrawing is broken. The following example will show a working plot at first, but after a timer fires which triggers a new render the plot becomes broken

const Plotly = require('react-plotlyjs');

class BrokenPlot extends React.Component {
  constructor() {
    super();
    this.state = {foo: 0};
  }

  componentDidMount() {
    setTimeout(e => {
      this.setState({foo: 1});
    }, 1000);
  }

  render() {
    let layout = {
      title: 'simple example',
      xaxis: {
        title: 'time'
      }
    };
    let config = {
      showLink: false,
      displayModeBar: true
    };

    var trace1 = {
      x: [1, 2, 3, 4],
      y: [10, 15, 13, 17],
      mode: 'markers'
    };

    var trace2 = {
      x: [2, 3, 4, 5],
      y: [16, 5, 11, 9],
      mode: 'lines'
    };

    var trace3 = {
      x: [1, 2, 3, 4],
      y: [12, 9, 15, 12],
      mode: 'lines+markers'
    };

    var data = [ trace1, trace2, trace3 ];

    return (
      <Plotly className="whatever" data={data} layout={layout} config={config}/>
    );
  }
}

This wrapper library should use Plotly.newPlot instead, as described here: http://academy.plot.ly/react/3-with-plotly/

[benjeffery]

This used to work - Plotly has changed some things around. I'll see if there's a solution where we don't have to resort to newPlot.

[benjeffery]

Fixed in v0.3.6 on npm. For now resorting to newPlot - I played around with relayout but that caused issues too. I hope to get time to look into minimal redraw in a few weeks.