JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.1.9/require.min.js"></script>
<div>
  <div id='plot'>
  </div>
  <div id='image'>
  </div>
</div>

JavaScript

require.config({
  paths: {
    jquery: '//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min',
    d3: 'https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.13/d3',
    plotly: 'https://cdn.plot.ly/plotly-1.5.1.min.js?noext'
  },
  shim: {
    plotly: {
      deps: ['d3', 'jquery'],
      exports: 'plotly'
    }
  }
});

require(['jquery', 'd3', 'plotly'], function(jquery, d3, plotly) {
  var pdata = [
    {
      x: [15, 45, 75],
      y: [0.642, 0.658, 0.544],
      type: "scatter",
      mode: "lines",
      name: "Sample"
    }
  ];
  var layout = {
    "xaxis": {
      "range":[0,644],
      "title":"Seconds"
     },
     "yaxis":{
       "range":[0.464,0.719],
       "title":"Loss"
     },
     "height":400,
     "margin":{"b":60,"t":60,"l":60,"r":60},
     "title": "Loss",
     "width":400,
     "autosize":false
  };
  
  var gd = document.getElementById('plot');

  plotly.newPlot(gd, pdata, layout, {displayModeBar: false});
  
  plotly.Snapshot.toImage(gd, {format: 'png'}).once('success', function(url) {
    document.getElementById('image').innerHTML = '<img src="' + url + '"/>'
  });
})