Merge pull request #1664 from plotly/plot-to-new-plot

updating plot to newPlot() in JS docs

Author: Joseph Damiba

_posts/plotly_js/2015-04-05-plotly_js-index.html

@@ -58,7 +58,7 @@ <h1>Plotly JavaScript Open Source Graphing Library</h1>
                       x: 0, y: 0, xref: 'paper', yref: 'paper'
                     }]
                   }
-                  Plotly.plot(document.getElementById('contour-plot'), [trace], layout, {showLink: false});
+                  Plotly.newPlot(document.getElementById('contour-plot'), [trace], layout, {showLink: false});
                 });</code></pre>
 
 
@@ -104,7 +104,7 @@ <h1>Plotly JavaScript Open Source Graphing Library</h1>
                       }
                     };
 
-                    Plotly.plot(document.getElementById('wind-speed'), [trace], layout, {showLink: false});
+                    Plotly.newPlot(document.getElementById('wind-speed'), [trace], layout, {showLink: false});
                 });</code></pre>
 
 

_posts/plotly_js/2015-07-21-plotlyjs-getting-started.html

@@ -64,18 +64,18 @@ <h2 >Start plotting!</h2>
             <pre><code class="hljs html">&lt;div id="tester" style="width:600px;height:250px;"&gt;&lt;/div&gt;</code></pre>
 
             <p>
-                Now you can make interactive plotly.js charts  using <code class="no-padding">Plotly.plot()</code>.
+                Now you can make interactive plotly.js charts  using <code class="no-padding">Plotly.newPlot()</code>.
             </p>
 <pre><code class="hljs javascript">&lt;script&gt;
 	TESTER = document.getElementById('tester');
-	Plotly.plot( TESTER, [{
+	Plotly.newPlot( TESTER, [{
 	x: [1, 2, 3, 4, 5],
 	y: [1, 2, 4, 8, 16] }], {
 	margin: { t: 0 } } );
 &lt;/script&gt;</code></pre>
 
             <p>
-                Now you can pass Plotly.plot() either the ID of the DIV ("tester") or the DIV DOM element (<code class="no-padding">TESTER</code>).
+                Now you can pass Plotly.newPlot() either the ID of the DIV ("tester") or the DIV DOM element (<code class="no-padding">TESTER</code>).
             </p>
 
         </div>

_posts/plotly_js/3d/3d-cone/2018-06-12-basic-3d-cone.html

@@ -21,4 +21,4 @@
   }
 }
 
-Plotly.plot('myDiv',data,layout)
+Plotly.newPlot('myDiv',data,layout)

_posts/plotly_js/3d/3d-cone/2018-06-12-lighting.html

@@ -123,4 +123,4 @@
   margin: {t: 0, b: 0, l: 0, r: 0}
 }
 
-Plotly.plot('myDiv',data,layout) 
+Plotly.newPlot('myDiv',data,layout) 

_posts/plotly_js/3d/3d-cone/2018-06-12-multiple-3d-cone.html

@@ -35,4 +35,4 @@
     width: 800
 }
 
-Plotly.plot('myDiv', data, layout)
+Plotly.newPlot('myDiv', data, layout)

_posts/plotly_js/3d/3d-line/2015-04-09-3d-line-spiral.html

@@ -23,7 +23,7 @@
      c.push(i)
  }
 
-Plotly.plot('myDiv', [{
+Plotly.newPlot('myDiv', [{
      type: 'scatter3d',
      mode: 'lines',
      x: x,

_posts/plotly_js/3d/3d-line/2015-04-09-simple-3d-line+markers.html

@@ -23,7 +23,7 @@
    c.push(i)
 }
 
-Plotly.plot('myDiv', [{
+Plotly.newPlot('myDiv', [{
   type: 'scatter3d',
   mode: 'lines+markers',
   x: x,

_posts/plotly_js/3d/3d-line/2015-04-09-simple-3d-line-plot.html

@@ -15,7 +15,7 @@
 var y = unpack(rows , 'y');
 var z = unpack(rows , 'z'); 
 var c = unpack(rows , 'color');
-Plotly.plot('myDiv', [{
+Plotly.newPlot('myDiv', [{
   type: 'scatter3d',
   mode: 'lines',
   x: x,

_posts/plotly_js/3d/3d-mesh/2016-06-16-cube-mesh.html

@@ -26,4 +26,4 @@
   }
 ];
 
-Plotly.plot('myDiv', data, {});
+Plotly.newPlot('myDiv', data, {});

_posts/plotly_js/3d/3d-mesh/2016-06-16-tetrahedron.html

@@ -23,4 +23,4 @@
   }
 ];
 
-Plotly.plot('myDiv', data, {});
+Plotly.newPlot('myDiv', data, {});

_posts/plotly_js/animations/animations-slider/2017-08-22-adding-sliders.html

@@ -164,7 +164,7 @@
   };
 
   // Create the plot:
-  Plotly.plot('myDiv', {
+  Plotly.newPlot('myDiv', {
     data: traces,
     layout: layout,
     frames: frames,

_posts/plotly_js/animations/animations/2016-09-15-animations-animating-many-frames-quickly.html

@@ -19,7 +19,7 @@
   z[i] = 30 + Math.random() * 10;
 }
 
-Plotly.plot('myDiv', [{
+Plotly.newPlot('myDiv', [{
   x: x,
   y: z,
   mode: 'markers'

_posts/plotly_js/animations/animations/2016-09-15-animations-animating-sequences-of-frames.html

@@ -11,7 +11,7 @@
 
   The third argument of `Plotly.animate` contains animation options. The transition duration defines the amount of time spent interpolating a trace from one state to another (currently limited to scatter traces), while the frame duration defines the total time spent in that state, including time spent transitioning. The example below has two frames, each with their own transition and frame timing.
 ---
-Plotly.plot('myDiv', [{
+Plotly.newPlot('myDiv', [{
   x: [0, 0],
   y: [-1, 1],
 }], {

_posts/plotly_js/animations/animations/2016-09-15-animations-animating-the-layout.html

@@ -16,7 +16,7 @@
   y[i] = x[i] + 0.2 * (Math.random() - 0.5);
 }
 
-Plotly.plot('myDiv', [{
+Plotly.newPlot('myDiv', [{
   x: x,
   y: y,
   mode: 'markers'

_posts/plotly_js/animations/animations/2016-09-15-animations-defining-named-frames.html

@@ -36,7 +36,7 @@
   frames[2].data[0].y[i] = Math.cos(t * Math.PI);
 }
 
-Plotly.plot('myDiv', [{
+Plotly.newPlot('myDiv', [{
   x: frames[0].data[0].x,
   y: frames[0].data[0].y,
   line: {simplify: false},

_posts/plotly_js/animations/animations/2016-09-15-animations-frame-groups-and-animation-modes.html

@@ -49,7 +49,7 @@
   })
 }
 
-Plotly.plot('myDiv', [{
+Plotly.newPlot('myDiv', [{
   // Set up the initial water:
   x: frames[0].data[0].x,
   y: frames[0].data[0].y,

_posts/plotly_js/animations/animations/2016-09-15-animations-object-constancy.html

@@ -20,7 +20,7 @@
 
 var ids = ['1', '2', '3', '4', '5', '6'];
 
-Plotly.plot('myDiv', [{
+Plotly.newPlot('myDiv', [{
   x: [1, 0.5, -0.5, -1, -0.5, 0.5],
   y: [0, 0.866, 0.866, 0, -0.866, -0.866],
   marker:{size:14,

_posts/plotly_js/animations/filled-area-animations/2017-08-22-filled-area-animations.html

@@ -25,7 +25,7 @@
     frames[i].data[0].y = y.slice(0, i+1);
   }
 
-  Plotly.plot('myDiv', [{
+  Plotly.newPlot('myDiv', [{
     x: frames[1].data[0].x,
     y: frames[1].data[0].y,
     fill: 'tozeroy',

_posts/plotly_js/basic/WebGL/2018-08-07-webgl_100000-points.html

@@ -37,4 +37,4 @@
     y: Y
 }]
 
-Plotly.plot('myDiv', data)
+Plotly.newPlot('myDiv', data)

_posts/plotly_js/basic/WebGL/2018-08-07-webgl_1mill-points.html

@@ -38,4 +38,4 @@
     y: Y
 }]
 
-Plotly.plot('myDiv', data)
+Plotly.newPlot('myDiv', data)

_posts/plotly_js/basic/WebGL/2018-08-07-webgl_many-traces.html

@@ -39,4 +39,4 @@
     })
 }
 var layout = {showlegend: false}
-Plotly.plot('myDiv', data = data, layout = layout)
+Plotly.newPlot('myDiv', data = data, layout = layout)

_posts/plotly_js/basic/area/2015-04-09-hoveron.html

@@ -43,4 +43,4 @@
   }
 }
 
-Plotly.plot('myDiv', data, layout) 
+Plotly.newPlot('myDiv', data, layout) 

_posts/plotly_js/basic/bar/2017-05-24-bar-widths.html

@@ -16,4 +16,4 @@
 
 var data = [trace0]
 
-Plotly.plot('myDiv', data);
+Plotly.newPlot('myDiv', data);

_posts/plotly_js/basic/pointcloud/2017-06-15-advanced-pointcloud.html

@@ -166,7 +166,7 @@
 
 
 // 'Open sans',verdana,arial,sans-serif
-Plotly.plot('myDiv', plotData.data, plotData.layout).then(function() {
+Plotly.newPlot('myDiv', plotData.data, plotData.layout).then(function() {
 
   var plotArea = document.querySelector('.gl-container div').getBoundingClientRect()
 

_posts/plotly_js/basic/sankey/2017-05-22-add_links.html

@@ -49,5 +49,5 @@
   }
 }
 
-Plotly.plot('myDiv', data, layout)
+Plotly.newPlot('myDiv', data, layout)
 });

_posts/plotly_js/basic/sankey/2017-05-22-style_sankey.html

@@ -51,5 +51,5 @@
   paper_bgcolor: 'black'
 }
 
-Plotly.plot('myDiv', data, layout)
+Plotly.newPlot('myDiv', data, layout)
 });

_posts/plotly_js/basic/table/2017-11-01-alternating-rows.html

@@ -38,4 +38,4 @@
   }
 }]
 
-Plotly.plot('myDiv', data);
+Plotly.newPlot('myDiv', data);

_posts/plotly_js/basic/table/2017-11-01-basic-example.html

@@ -32,4 +32,4 @@
   }
 }]
 
-Plotly.plot('myDiv', data);
+Plotly.newPlot('myDiv', data);

_posts/plotly_js/basic/table/2017-11-01-from-a-csv.html

@@ -55,5 +55,5 @@
   title: "Bitcoin mining stats for 180 days"
 }
 
-Plotly.plot('myDiv', data, layout);
+Plotly.newPlot('myDiv', data, layout);
 });

_posts/plotly_js/basic/table/2017-11-01-sizing-rows-columns.html

@@ -37,4 +37,4 @@
   }
 }]
 
-Plotly.plot('myDiv', data);
+Plotly.newPlot('myDiv', data);

_posts/plotly_js/basic/table/2017-11-01-styled-example.html

@@ -33,4 +33,4 @@
   }
 }]
 
-Plotly.plot('myDiv', data);
+Plotly.newPlot('myDiv', data);

_posts/plotly_js/chart-events/callbacks-click/2016-10-13-click-event-data.html

@@ -12,7 +12,7 @@
     pointNumber: 2,  // index of the selected point
     x: 5,        // x value
     y: 600,      // y value
-    data: {/* */},       // ref to the trace as sent to Plotly.plot associated with the selected point
+    data: {/* */},       // ref to the trace as sent to Plotly.newPlot associated with the selected point
     fullData: {/* */},   // ref to the trace including all the defaults
    xaxis: {/* */},   // ref to x-axis object (i.e layout.xaxis) associated with the selected point
    yaxis: {/* */}    // ref to y-axis object " "

_posts/plotly_js/chart-events/callbacks-hover/2015-04-09-hover-bind.html

@@ -23,7 +23,7 @@
         title:'Hover on Points'
      };
 
-Plotly.plot('myDiv', data, layout);
+Plotly.newPlot('myDiv', data, layout);
 
 myPlot.on('plotly_hover', function(data){
     var infotext = data.points.map(function(d){

_posts/plotly_js/chart-events/callbacks-hover/2015-04-09-hover-manual.html

@@ -22,7 +22,7 @@
         title:'Click "Go" button to trigger hover'
      };
 
-Plotly.plot('myDiv', data, layout);
+Plotly.newPlot('myDiv', data, layout);
 
 myPlot.on('plotly_beforehover',function(){
     return false;

_posts/plotly_js/chart-events/callbacks-hover/2016-10-13-hover-event-data.html

@@ -13,7 +13,7 @@
     pointNumber: 2,  // index of the selected point
     x: 5,        // x value
     y: 600,      // y value
-    data: {/* */},       // ref to the trace as sent to Plotly.plot associated with the selected point
+    data: {/* */},       // ref to the trace as sent to Plotly.newPlot associated with the selected point
     fullData: {/* */},   // ref to the trace including all the defaults
    xaxis: {/* */},   // ref to x-axis object (i.e layout.xaxis) associated with the selected point
    yaxis: {/* */}    // ref to y-axis object " "

_posts/plotly_js/chart-events/callbacks-hover/2017-02-07-pixel-hover.html

@@ -22,7 +22,7 @@
     layout = {hovermode:'closest',
               title:'Hover on Points to see<br>Pixel Coordinates'};
 
-Plotly.plot('myDiv', data, layout);
+Plotly.newPlot('myDiv', data, layout);
 
 myPlot.on('plotly_hover', function(data){
     var xaxis = data.points[0].xaxis,

_posts/plotly_js/chart-events/callbacks-zoom/2015-04-09-zoom-bind.html

@@ -16,7 +16,7 @@
     data = [ { x:x, y:y } ];
     layout = { title:'Click-drag to zoom' };
 
-Plotly.plot(graphDiv, data, layout);
+Plotly.newPlot(graphDiv, data, layout);
 
 graphDiv.on('plotly_relayout',
     function(eventdata){  

_posts/plotly_js/chart-events/events/2017-01-01-order10_afterplot.html

@@ -8,7 +8,7 @@
 arrangement: horizontal
 markdown_content: |
   The event handler: `plotly_afterplot`, can be used to trigger an event each time a chart is plotted. This also includes re-plotting after the restyling or relayout of a plot.
-  Users also have the option of adding a post-plot handler to the plot call with the following syntax: `Plotly.plot('myDiv', data, layout, config).then(postPlotHandler);`
+  Users also have the option of adding a post-plot handler to the plot call with the following syntax: `Plotly.newPlot('myDiv', data, layout, config).then(postPlotHandler);`
 
   The simple example below logs a console message each time the chart is plotted. Zoom or pan on the graph below to trigger the `plotly_afterplot` handler.
 ---
@@ -21,7 +21,7 @@
             mode:'markers', marker:{size:14}}
            ];
 
-Plotly.plot('myDiv', data);
+Plotly.newPlot('myDiv', data);
 
 myPlot.on('plotly_afterplot', function(){
     console.log('done plotting');

_posts/plotly_js/chart-events/events/2017-01-01-order3-1_event_data.html

@@ -18,7 +18,7 @@
     pointNumber: 1,  // index of the selected point
     x: 1,        // x value
     y: 1,      // y value
-    data: {/* */},       // ref to the trace as sent to Plotly.plot associated with the selected point
+    data: {/* */},       // ref to the trace as sent to Plotly.newPlot associated with the selected point
     fullData: {/* */},   // ref to the trace including all of the default attributes
    xaxis: {/* */},   // ref to x-axis object (i.e layout.xaxis) associated with the selected point
    yaxis: {/* */}    // ref to y-axis object " "
@@ -34,7 +34,7 @@
     pointNumbers: [1, 5, 28, 33, 41, ...],  // Array of indices of the points aggregated into selected bin
     x: 1,        // x value
     y: 45,      // y value
-    data: {/* */},       // ref to the trace as sent to Plotly.plot associated with the selected point
+    data: {/* */},       // ref to the trace as sent to Plotly.newPlot associated with the selected point
     fullData: {/* */},   // ref to the trace including all of the default attributes
    xaxis: {/* */},   // ref to x-axis object (i.e layout.xaxis) associated with the selected point
    yaxis: {/* */}    // ref to y-axis object " "
@@ -51,7 +51,7 @@
     x: 5,        // x value
     y: 600,      // y value
     z: 12,       // z value
-    data: {/* */},       // ref to the trace as sent to Plotly.plot associated with the selected point
+    data: {/* */},       // ref to the trace as sent to Plotly.newPlot associated with the selected point
     fullData: {/* */},   // ref to the trace including all of the default attributes
    xaxis: {/* */},   // ref to x-axis object (i.e layout.xaxis) associated with the selected point
    yaxis: {/* */}    // ref to y-axis object " "
@@ -68,7 +68,7 @@
     pointNumber: 2,  // index of the selected point
     lat: 50,        // latitude value
     lon: -12,      // longitude value
-    data: {/* */},       // ref to the trace as sent to Plotly.plot associated with the selected point
+    data: {/* */},       // ref to the trace as sent to Plotly.newPlot associated with the selected point
     fullData: {/* */},   // ref to the trace including all of the default attributes
     location:       //
   }, {

_posts/plotly_js/chart-events/events/2017-01-01-order6_selected_event.html

@@ -26,7 +26,7 @@
 var x = randomArray();
 var y = randomArray();
 
-Plotly.plot(graphDiv, [{
+Plotly.newPlot(graphDiv, [{
   type: 'scatter',
   mode: 'markers',
   x: x,

_posts/plotly_js/controls/callbacks-buttons/2018-10-16-button-relayout.html

@@ -116,6 +116,6 @@
 }
 
 
-Plotly.plot("myDiv", data, layout);
+Plotly.newPlot("myDiv", data, layout);
 
 });

_posts/plotly_js/controls/callbacks-buttons/2018-10-16-button-restyle-multiple.html

@@ -211,6 +211,6 @@
 }
 
 
-Plotly.plot("myDiv", data, layout);
+Plotly.newPlot("myDiv", data, layout);
 
 });

_posts/plotly_js/controls/callbacks-buttons/2018-10-16-button-restyle-simple.html

@@ -94,6 +94,6 @@
 }
 
 
-Plotly.plot("myDiv", data, layout);
+Plotly.newPlot("myDiv", data, layout);
 
 });