update examples to use title.text

LiamConnors · LiamConnors · commit bf38db82aa90 · 2024-11-07T12:25:52.000-05:00
diff --git a/_posts/plotly_js/basic/area/2015-04-09-stacked-area.html b/_posts/plotly_js/basic/area/2015-04-09-stacked-area.html
@@ -13,4 +13,4 @@
 	{x: [1,2,3], y: [3,0,2], stackgroup: 'one'}
 ];
 
-Plotly.newPlot('myDiv', traces, {title: 'stacked and filled line chart'});
+Plotly.newPlot('myDiv', traces, {title: {text: 'stacked and filled line chart'}});
diff --git a/_posts/plotly_js/basic/area/2018-09-18-normalized-stacked-area.html b/_posts/plotly_js/basic/area/2018-09-18-normalized-stacked-area.html
@@ -13,5 +13,5 @@
 	{x: [1,2,3], y: [3,0,2], stackgroup: 'one'}
 ];
 
-Plotly.newPlot('myDiv', traces, {title: 'Normalized stacked and filled line chart'});
+Plotly.newPlot('myDiv', traces, {title: {text: 'Normalized stacked and filled line chart'}});
 
diff --git a/_posts/plotly_js/basic/line-plots/2015-08-07-adding-names-to-line-and-scatter-plot.html b/_posts/plotly_js/basic/line-plots/2015-08-07-adding-names-to-line-and-scatter-plot.html
@@ -31,7 +31,7 @@
 var data = [ trace1, trace2, trace3 ];
 
 var layout = {
-  title:'Adding Names to Line and Scatter Plot'
+  title: {text: 'Adding Names to Line and Scatter Plot'}
 };
 
 Plotly.newPlot('myDiv', data, layout);
diff --git a/_posts/plotly_js/basic/line-plots/2015-08-07-line-and-scatter-plot.html b/_posts/plotly_js/basic/line-plots/2015-08-07-line-and-scatter-plot.html
@@ -28,7 +28,7 @@
 var data = [ trace1, trace2, trace3 ];
 
 var layout = {
-  title:'Line and Scatter Plot'
+  title: {text: 'Line and Scatter Plot'}
 };
 
 Plotly.newPlot('myDiv', data, layout);
diff --git a/_posts/plotly_js/basic/line_and_scatter/2015-08-10-data-label-hover.html b/_posts/plotly_js/basic/line_and_scatter/2015-08-10-data-label-hover.html
@@ -35,7 +35,7 @@
   yaxis: {
     range: [0, 8]
   },
-  title:'Data Labels Hover'
+  title: {text: 'Data Labels Hover'}
 };
 
 Plotly.newPlot('myDiv', data, layout);
diff --git a/_posts/plotly_js/basic/line_and_scatter/2015-08-11-data-label-on-the-plot.html b/_posts/plotly_js/basic/line_and_scatter/2015-08-11-data-label-on-the-plot.html
@@ -52,7 +52,7 @@
       color: 'grey',
     }
   },
-  title:'Data Labels on the Plot'
+  title: {text: 'Data Labels on the Plot'}
 };
 
 Plotly.newPlot('myDiv', data, layout);
diff --git a/_posts/plotly_js/chart-events/callbacks-click/2015-04-09-click-annotation.html b/_posts/plotly_js/chart-events/callbacks-click/2015-04-09-click-annotation.html
@@ -20,7 +20,7 @@
     data = [ trace1, trace2, trace3 ],
     layout = {
         hovermode:'closest',
-        title:'Click on Points to add an Annotation on it'
+        title: {text: 'Click on Points to add an Annotation on it'}
      };
 
 Plotly.newPlot('myDiv', data, layout);
diff --git a/_posts/plotly_js/chart-events/callbacks-click/2015-04-09-click.html b/_posts/plotly_js/chart-events/callbacks-click/2015-04-09-click.html
@@ -15,7 +15,7 @@
             mode:'markers', marker:{size:16} } ],
     layout = {
         hovermode:'closest',
-        title:'Click on Points'
+        title: {text: 'Click on Points'}
      };
 
 Plotly.newPlot('myDiv', data, layout);
diff --git a/_posts/plotly_js/chart-events/callbacks-hover/2015-04-09-hover-bind.html b/_posts/plotly_js/chart-events/callbacks-hover/2015-04-09-hover-bind.html
@@ -19,7 +19,7 @@
         mode:'markers', marker:{size:16} } ];
     layout = {
         hovermode:'closest',
-        title:'Hover on Points'
+        title: {text: 'Hover on Points'}
      };
 
 Plotly.newPlot('myDiv', data, layout);
diff --git a/_posts/plotly_js/chart-events/callbacks-hover/2015-04-09-hover-manual.html b/_posts/plotly_js/chart-events/callbacks-hover/2015-04-09-hover-manual.html
@@ -19,7 +19,7 @@
         mode:'markers', marker:{size:16} } ];
     layout = {
         hovermode:'closest',
-        title:'Click "Go" button to trigger hover'
+        title: {text: 'Click "Go" button to trigger hover'}
      };
 
 Plotly.newPlot('myDiv', data, layout);
diff --git a/_posts/plotly_js/chart-events/callbacks-hover/2015-10-08-hover-coupled.html b/_posts/plotly_js/chart-events/callbacks-hover/2015-10-08-hover-coupled.html
@@ -29,7 +29,7 @@
             }];
     layout = {
         hovermode:'closest',
-        title:'Display Hover Info for Related Points',
+        title: {text: 'Display Hover Info for Related Points'},
         xaxis:{zeroline:false, hoverformat: '.2r'},
         yaxis:{zeroline:false, hoverformat: '.2r'}
      };
diff --git a/_posts/plotly_js/chart-events/callbacks-hover/2017-02-07-pixel-hover.html b/_posts/plotly_js/chart-events/callbacks-hover/2017-02-07-pixel-hover.html
@@ -19,7 +19,7 @@
         {x:x, y:y2, type:'scatter', name:'Trial 2',
         mode:'markers', marker:{size:16}}],
     layout = {hovermode:'closest',
-              title:'Hover on Points to see<br>Pixel Coordinates'};
+              title: {text: 'Hover on Points to see<br>Pixel Coordinates'}};
 
 Plotly.newPlot('myDiv', data, layout);
 
diff --git a/_posts/plotly_js/chart-events/callbacks-zoom/2015-04-09-zoom-bind.html b/_posts/plotly_js/chart-events/callbacks-zoom/2015-04-09-zoom-bind.html
@@ -13,7 +13,7 @@
     x = d3.range(N),
     y = d3.range(N).map( d3.random.normal() ),
     data = [ { x:x, y:y } ];
-    layout = { title:'Click-drag to zoom' };
+    layout = { title: {text: 'Click-drag to zoom' }};
 
 Plotly.newPlot(graphDiv, data, layout);
 
diff --git a/_posts/plotly_js/chart-events/events/2017-01-01-order2_simple_event_ex.html b/_posts/plotly_js/chart-events/events/2017-01-01-order2_simple_event_ex.html
@@ -16,7 +16,7 @@
              mode:'markers', marker:{size:20}
             }],
     layout = {hovermode:'closest',
-              title:'Click on Points'
+              title: {text: 'Click on Points'}
      };
 
 Plotly.newPlot('myDiv', data, layout);
diff --git a/_posts/plotly_js/chart-events/events/2017-01-01-order5_hover_event.html b/_posts/plotly_js/chart-events/events/2017-01-01-order5_hover_event.html
@@ -20,7 +20,7 @@
              mode:'markers', marker:{size:16, color:colors}}],
     layout = {
         hovermode:'closest',
-        title:'Hover on a Point<br>to Change Color'
+        title: {text: 'Hover on a Point<br>to Change Color'}
      };
 
 Plotly.newPlot('myDiv', data, layout);
diff --git a/_posts/plotly_js/chart-events/events/2017-01-01-order6_click_event.html b/_posts/plotly_js/chart-events/events/2017-01-01-order6_click_event.html
@@ -18,7 +18,7 @@
              mode:'markers', marker:{size:16, color:colors}}],
     layout = {
         hovermode:'closest',
-        title:'Click on a Point to Change Color<br>Double Click (anywhere) to Change it Back'
+        title: {text: 'Click on a Point to Change Color<br>Double Click (anywhere) to Change it Back'}
      };
 
 Plotly.newPlot('myDiv', data, layout);
diff --git a/_posts/plotly_js/chart-events/events/2017-01-01-order7_doubleclick_event.html b/_posts/plotly_js/chart-events/events/2017-01-01-order7_doubleclick_event.html
@@ -18,7 +18,7 @@
              mode:'markers', marker:{size:16, color:colors}}],
     layout = {
         hovermode:'closest',
-        title:'Click on a Point to Change Color<br>Double Click (anywhere) to Change it Back'
+        title: {text: 'Click on a Point to Change Color<br>Double Click (anywhere) to Change it Back'}
      };
 
 Plotly.newPlot('myDiv', data, layout);
diff --git a/_posts/plotly_js/chart-events/events/2018-08-06-order6_legendclick_event.html b/_posts/plotly_js/chart-events/events/2018-08-06-order6_legendclick_event.html
@@ -7,7 +7,7 @@
 sitemap: false
 arrangement: horizontal
 markdown_content: |
-  `plotly_legendclick` and `plotly_legenddoubleclick` allow customization of the plotly legend. The default behaviour of `plotly_legendclick` is to hide a trace and the default behavior of `plotly_legenddoubleclick` is to select one trace and hide all the others. 
+  `plotly_legendclick` and `plotly_legenddoubleclick` allow customization of the plotly legend. The default behaviour of `plotly_legendclick` is to hide a trace and the default behavior of `plotly_legenddoubleclick` is to select one trace and hide all the others.
   We can add to the default behaviour by creating a new `plotly_legendclick` event with a function of our choice. We can also disable the default behaviour by creating a function that returns `false`. In the example below, we do both in order to create a `plotly_legendclick` event which changes the marker color back to black instead of erasing the trace.
 ---
 var myPlot = document.getElementById('myDiv'),
@@ -23,7 +23,7 @@
     layout = {
         showlegend: true,
         hovermode:'closest',
-        title:'Click on a Point to Change Color<br>Click on a Trace in the Legend to Change Back One Trace Only'
+        title: {text: 'Click on a Point to Change Color<br>Click on a Trace in the Legend to Change Back One Trace Only'}
      };
 
 Plotly.newPlot('myDiv', data, layout);
diff --git a/_posts/plotly_js/chart-events/remove-trace/2015-08-15-remove-trace-example.html b/_posts/plotly_js/chart-events/remove-trace/2015-08-15-remove-trace-example.html
@@ -27,7 +27,7 @@
 };
 
 var layout = {
-  title:'Click Buttons to Delete Traces',
+  title: {text: 'Click Buttons to Delete Traces'},
   showlegend:false
 };
 
diff --git a/_posts/plotly_js/controls/callbacks-dropdowns/2015-11-19-simple-dropdown.html b/_posts/plotly_js/controls/callbacks-dropdowns/2015-11-19-simple-dropdown.html
@@ -57,7 +57,7 @@
         var data = [trace1];
 
         var layout = {
-            title:'Line and Scatter Plot',
+            title: {text: 'Line and Scatter Plot'},
             height: 400,
             width: 480
         };
diff --git a/_posts/plotly_js/financial/time-series/2017-08-14-time-series-rangeslider.html b/_posts/plotly_js/financial/time-series/2017-08-14-time-series-rangeslider.html
@@ -35,7 +35,7 @@
 var data = [trace1,trace2];
 
 var layout = {
-  title: 'Time Series with Rangeslider',
+  title: {text: 'Time Series with Rangeslider'},
   xaxis: {
     autorange: true,
     range: ['2015-02-17', '2017-02-16'],
diff --git a/_posts/plotly_js/fundamentals/annotations/2015-10-08-style-annotation-b.html b/_posts/plotly_js/fundamentals/annotations/2015-10-08-style-annotation-b.html
@@ -36,7 +36,7 @@
                      size:16}}];
     layout = {
         hovermode:'closest',
-        title:'<b>Formatting Annotations</b> <br> click on a point to plot an annotation',
+        title: {text: '<b>Formatting Annotations</b> <br> click on a point to plot an annotation'},
         xaxis: {
           zeroline: false,
           title: {
diff --git a/_posts/plotly_js/fundamentals/axes/2015-09-18-axes-categories.html b/_posts/plotly_js/fundamentals/axes/2015-09-18-axes-categories.html
@@ -30,7 +30,7 @@
             text: 'Number of Items in Stock'
         }
     },
-  title:'Inventory'
+  title: {text: 'Inventory'}
 };
 
 Plotly.newPlot('myDiv', data, layout);
diff --git a/_posts/plotly_js/fundamentals/shapes/2023-03-15-labels-on-shapes.html b/_posts/plotly_js/fundamentals/shapes/2023-03-15-labels-on-shapes.html
@@ -32,9 +32,9 @@
 ];
 
 var layout = {
-  title: 'Product price changes and revenue growth',
-  xaxis: { title: 'Date' },
-  yaxis: { title: 'Revenue Growth' },
+  title: {text: 'Product price changes and revenue growth'},
+  xaxis: { title: {text: 'Date' }},
+  yaxis: { title: {text: 'Revenue Growth' }},
   dragmode: 'drawline',
 
   shapes: [
diff --git a/_posts/plotly_js/fundamentals/tick-format/2018-12-17-using-tickformat(date).html b/_posts/plotly_js/fundamentals/tick-format/2018-12-17-using-tickformat(date).html
@@ -43,7 +43,7 @@
   var data = [trace1, trace2];
 
   var layout = {
-    title: 'Time series with custom tickformat',
+    title: {text: 'Time series with custom tickformat'},
     xaxis: {
       tickformat: '%d %B (%a)\n %Y' // For more time formatting types, see: https://github.com/d3/d3-time-format/blob/master/README.md
     }
diff --git a/_posts/plotly_js/fundamentals/uirevision/2019-01-04-uirevision-persist.html b/_posts/plotly_js/fundamentals/uirevision/2019-01-04-uirevision-persist.html
@@ -26,7 +26,7 @@
 ].map(new_data);
 
 var layout = {
-	title: 'User Zoom Persists<br>When uirevision Unchanged',
+	title: {text: 'User Zoom Persists<br>When uirevision Unchanged'},
 	uirevision:'true',
 	xaxis: {autorange: true},
 	yaxis: {autorange: true}
diff --git a/_posts/plotly_js/fundamentals/uirevision/2019-01-04-uirevision-reset.html b/_posts/plotly_js/fundamentals/uirevision/2019-01-04-uirevision-reset.html
@@ -24,7 +24,7 @@
 ].map(new_data);
 
 var layout = {
-	title: 'User Zoom Resets<br>When uirevision Changes',
+	title: {text: 'User Zoom Resets<br>When uirevision Changes'},
 	uirevision:'true',
 	xaxis: {autorange: true},
 	yaxis: {autorange: true}
diff --git a/_posts/plotly_js/maps/bubble-maps/2015-07-11-bubble-map.html b/_posts/plotly_js/maps/bubble-maps/2015-07-11-bubble-map.html
@@ -18,7 +18,7 @@
         cmax: 50,
         colorscale: 'Greens',
         colorbar: {
-            title: 'Some rate',
+            title: {text: 'Some rate'},
             ticksuffix: '%',
             showticksuffix: 'last'
         },
diff --git a/_posts/plotly_js/maps/bubble-maps/2015-08-12-USA-bubble-map.html b/_posts/plotly_js/maps/bubble-maps/2015-08-12-USA-bubble-map.html
@@ -45,7 +45,7 @@
     }];
 
     var layout = {
-        title: '2014 US City Populations',
+        title: {text: '2014 US City Populations'},
         showlegend: false,
         geo: {
             scope: 'usa',
diff --git a/_posts/plotly_js/maps/choropleth-maps/2015-07-11-choropleth-north-america.html b/_posts/plotly_js/maps/choropleth-maps/2015-07-11-choropleth-north-america.html
@@ -26,7 +26,7 @@
               [0.8, 'rgb(117,107,177)'], [1, 'rgb(84,39,143)']
           ],
           colorbar: {
-              title: 'Millions USD',
+              title: {text: 'Millions USD'},
               thickness: 0.2
           },
           marker: {
@@ -39,7 +39,7 @@
 
 
       var layout = {
-          title: '2011 US Agriculture Exports by State',
+          title: {text: '2011 US Agriculture Exports by State'},
           geo:{
               scope: 'usa',
               showlakes: true,
diff --git a/_posts/plotly_js/maps/choropleth-maps/2015-07-11-choropleth-world-robinson.html b/_posts/plotly_js/maps/choropleth-maps/2015-07-11-choropleth-world-robinson.html
@@ -22,7 +22,7 @@
     }];
 
     var layout = {
-      title: 'Pure alcohol consumption<br>among adults (age 15+) in 2010',
+      title: {text: 'Pure alcohol consumption<br>among adults (age 15+) in 2010'},
       geo: {
           projection: {
               type: 'robinson'
diff --git a/_posts/plotly_js/maps/choropleth-maps/2015-08-10-countrygdp-choropleth-map.html b/_posts/plotly_js/maps/choropleth-maps/2015-08-10-countrygdp-choropleth-map.html
@@ -35,12 +35,12 @@
             colorbar: {
                 autotic: false,
                 tickprefix: '$',
-                title: 'GDP<br>Billions US$'
+                title: {text: 'GDP<br>Billions US$'}
             }
       }];
 
       var layout = {
-          title: '2014 Global GDP<br>Source: <a href="https://www.cia.gov/library/publications/the-world-factbook/fields/2195.html"> CIA World Factbook</a>',
+          title: {text: '2014 Global GDP<br>Source: <a href="https://www.cia.gov/library/publications/the-world-factbook/fields/2195.html"> CIA World Factbook</a>'},
           geo:{
               showframe: false,
               showcoastlines: false,
diff --git a/_posts/plotly_js/maps/choropleth-maps/2015-08-11-US-pop-by-state-choropleth.html b/_posts/plotly_js/maps/choropleth-maps/2015-08-11-US-pop-by-state-choropleth.html
@@ -21,7 +21,7 @@
 }];
 
 var layout = {
-title: '2014 US Popultaion by State',
+title: {text: '2014 US Popultaion by State'},
     geo:{
         scope: 'usa',
         countrycolor: 'rgb(255, 255, 255)',
diff --git a/_posts/plotly_js/maps/choropleth-maps/2016-08-04-florida-counties.html b/_posts/plotly_js/maps/choropleth-maps/2016-08-04-florida-counties.html
@@ -16,7 +16,7 @@
       lat: [46],
       lon: [-74]
     }], {
-      title: "Florida Counties",
+      title: {text: "Florida Counties"},
       height: 600,
       width: 600,
       map: {
diff --git a/_posts/plotly_js/maps/lines-on-maps/2015-08-12-flightpath-london-to-nyc.html b/_posts/plotly_js/maps/lines-on-maps/2015-08-12-flightpath-london-to-nyc.html
@@ -18,7 +18,7 @@
   }];
 
 var layout = {
-  title: 'London to NYC Great Circle',
+  title: {text: 'London to NYC Great Circle'},
   showlegend: false,
   geo: {
       resolution: 50,
diff --git a/_posts/plotly_js/maps/lines-on-maps/2015-08-12-us-flight-paths-map.html b/_posts/plotly_js/maps/lines-on-maps/2015-08-12-us-flight-paths-map.html
@@ -41,7 +41,7 @@
     };
 
     var layout = {
-        title: 'Feb. 2011 American Airline flight paths',
+        title: {text: 'Feb. 2011 American Airline flight paths'},
         showlegend: false,
         geo:{
             scope: 'north america',
diff --git a/_posts/plotly_js/maps/scatter-plot-on-maps/2015-08-12-US-airport-map.html b/_posts/plotly_js/maps/scatter-plot-on-maps/2015-08-12-US-airport-map.html
@@ -36,14 +36,14 @@
             cmin: 0,
             color: unpack(rows, 'cnt'),
             colorbar: {
-                title: 'Incoming Flights February 2011'
+                title: {text: 'Incoming Flights February 2011'}
             }
         }
     }];
 
 
     var layout = {
-        title: 'Most Trafficked US airports',
+        title: {text: 'Most Trafficked US airports'},
         colorbar: true,
         geo: {
             scope: 'usa',
diff --git a/_posts/plotly_js/maps/scatter-plot-on-maps/2015-08-15-north-america-percipitation-map.html b/_posts/plotly_js/maps/scatter-plot-on-maps/2015-08-15-north-america-percipitation-map.html
@@ -74,7 +74,7 @@
         range: [ 20.0, 60.0 ],
         dtick: 5
       },
-      title: 'North America Precipitation',
+      title: {text: North America Precipitation'},
       width: 600,
       height: 600
     };
diff --git a/_posts/plotly_js/maps/scattermapbox/2017-08-01-scattermapbox_multiple.html b/_posts/plotly_js/maps/scattermapbox/2017-08-01-scattermapbox_multiple.html
@@ -29,7 +29,7 @@
   });
 
   var layout = {
-	 title: 'Meteorite Landing Locations',
+	 title: {text: 'Meteorite Landing Locations'},
 	 font: {
 		 color: 'white'
 	 },
diff --git a/_posts/plotly_js/subplot/mixed-subplots/2017-01-20-mixed-subplots.html b/_posts/plotly_js/subplot/mixed-subplots/2017-01-20-mixed-subplots.html
@@ -68,7 +68,7 @@
 var layout = {
       paper_bgcolor: 'black',
       plot_bgcolor: 'black',
-      title: 'Volcano Database: Elevation',
+      title: {text: 'Volcano Database: Elevation'},
       font: {color: 'white'},
       colorbar: true,
       annotations: [{
diff --git a/_posts/plotly_js/subplot/subplot-table/2017-11-01-table-subplot.html b/_posts/plotly_js/subplot/subplot-table/2017-11-01-table-subplot.html
@@ -109,7 +109,7 @@
 
   // define layout
   var layout = {
-    title: "Bitcoin mining stats for 180 days",
+    title: {text: "Bitcoin mining stats for 180 days"},
     plot_bgcolor: 'rgba(228, 222, 249, 0.65)',
     showlegend: false,
     xaxis1: Object.assign(axis1,axis),
diff --git a/_posts/plotly_js/subplot/subplots/2015-08-10-multiple-custom-sized-subplots.html b/_posts/plotly_js/subplot/subplots/2015-08-10-multiple-custom-sized-subplots.html

Original file line number	Diff line number	Diff line change
`@@ -52,7 +52,7 @@`
`52`	`52`	`color: 'grey',`
`53`	`53`	`}`
`54`	`54`	`},`
`55`		`- title:'Data Labels on the Plot'`
	`55`	`+ title: {text: 'Data Labels on the Plot'}`
`56`	`56`	`};`
`57`	`57`
`58`	`58`	`Plotly.newPlot('myDiv', data, layout);`