要從HTML文件中加載Plotly圖表,您可以使用Plotly.js庫中的Plotly.newPlot
方法來實現。下面是一個簡單的例子:
<head>
標簽中添加以下代碼來引入Plotly.js庫:<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<body>
標簽中添加一個<div>
元素來創建一個容器,用于顯示Plotly圖表。例如:<div id="myChart"></div>
Plotly.newPlot
方法來加載并顯示圖表。例如:var data = [
{
x: [1, 2, 3, 4, 5],
y: [10, 20, 15, 25, 30],
type: 'scatter'
}
];
var layout = {
title: 'My Plotly Chart'
};
Plotly.newPlot('myChart', data, layout);
在上面的代碼中,我們定義了一個包含一組數據和布局信息的對象,并將其傳遞給Plotly.newPlot
方法。最后一個參數'myChart'
指定了要在哪個<div>
元素中顯示圖表。
.js
文件中,并在HTML文件中使用<script>
標簽將其引入。例如:<script src="myChart.js"></script>
這樣就可以從HTML文件中加載Plotly圖表了。您可以根據自己的需求來定義數據和布局信息,以創建不同類型的圖表。