我想繪製一個有多個因素的情節。我希望這些不同的因素根據分散的顏色，大小和形狀來區分。這種情節的一個例子是https://github.com/slfan2013/tempPlot/blob/master/Rplot.png。用於多重因素傳奇情節的Javascript庫
我想使用JavaScript庫來繪製類似的情節。我通常使用plotly.js繪製陰謀。但我認爲一次只能處理一個因素（不同的顏色）。我的問題是可以在一個單一的情節（如顏色，大小和形狀）中陰謀處理多個（嵌套）因素？如果沒有，如果有任何javascript庫可以實現這些？ CanvasJS怎麼樣？
#### EDIT。
我明白怎麼畫散射與同一地塊不同的顏色和不同尺寸（形狀等）。我只想在情節上有一個多因素的圖例，例如，如果我點擊「紅色」，那麼無論它的大小如何，紅色散點圖都會隱藏起來，如果我點擊大小「大」，大散點圖無論它是什麼顏色都會隱藏起來。
謝謝！
你只需要定義多個軌跡和設置各個跟蹤參數。
trace0只是默認設置trace1有一個自定義顏色trace2有一個自定義顏色和自定義尺寸trace3有一個自定義顏色，自定義尺寸和自定義符號var trace0 = {
x: [1, 2, 3],
y: [1, 2, 3],
type: 'scatter',
mode:'markers'};
var trace1 = {
x: [1, 2, 3],
y: [2, 1.8, 1],
type: 'scatter',
mode:'markers',
marker: {
color: 'red'
}};
var trace2 = {
x: [1, 2, 3],
y: [2.8, 2.3, 1.2],
type: 'scatter',
mode:'markers',
marker: {
color: 'green',
size: [10, 15, 20]
}};
var trace3 = {
x: [1, 2, 3],
y: [3, 2.5, 1],
type: 'scatter',
mode:'markers',
marker: {
color: 'pink',
size: [10, 15, 20],
symbol: 303
}};
Plotly.plot('myDiv', [trace0, trace1, trace2, trace3])<div id='myDiv'></div>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>感謝您的幫助。就你的例子而言，圖例只是着色差異而不是大小。是否有嵌套因素的方法？染色的另一個因素是尺寸的另一個因素？ – user7117436
@ user7117436：據我所知Plotly不直接支持此功能，https://community.plot.ly/t/possible-to-have-nested-or-hierarchical-legends/2376/2 –
這可以使用散點圖CanvasJS並且通過控制markerType和markerSize來完成。檢查下面的例子。
請參閱這些頁面瞭解markerType和markerSize。
http://canvasjs.com/docs/charts/chart-options/data/markertype/
http://canvasjs.com/docs/charts/chart-options/data/markersize/
var chart = new CanvasJS.Chart("chartContainer",
{
\t title: {
\t \t text: "Scatter Chart with Different Marker Types"
\t },
\t legend: {
\t \t horizontalAlign: "right",
\t \t verticalAlign: "center"
\t },
\t data: [
\t {
\t \t type: "scatter",
\t \t showInLegend: true,
\t \t legendText: "Circle",
\t \t dataPoints: [
\t \t \t { x: 1, y: 91, markerSize: 10 },
\t \t \t { x: 2, y: 75, markerSize: 20 },
\t \t \t { x: 3, y: 70, markerSize: 30 },
\t \t \t { x: 4, y: 85, markerSize: 40 },
\t \t \t { x: 5, y: 75, markerSize: 50 } \t \t \t
\t \t ]
\t },
\t {
\t \t type: "scatter",
\t \t markerType: "square", //default "circle"
\t \t showInLegend: true,
\t \t legendText: "Square",
\t \t dataPoints: [
\t \t \t { x: 1, y: 71, markerSize: 10 },
\t \t \t { x: 2, y: 55, markerSize: 20 },
\t \t \t { x: 3, y: 50, markerSize: 30 },
\t \t \t { x: 4, y: 65, markerSize: 40 },
\t \t \t { x: 5, y: 55, markerSize: 50 } \t \t \t
\t \t ]
\t },
\t {
\t \t type: "scatter",
\t \t markerType: "triangle",
\t \t showInLegend: true,
\t \t legendText: "Triangle",
\t \t dataPoints: [
\t \t \t { x: 1, y: 51, markerSize: 10 },
\t \t \t { x: 2, y: 35, markerSize: 20 },
\t \t \t { x: 3, y: 30, markerSize: 30 },
\t \t \t { x: 4, y: 45, markerSize: 40 },
\t \t \t { x: 5, y: 35, markerSize: 50 }
\t \t ]
\t },
\t {
\t \t type: "scatter",
\t \t markerType: "cross",
\t \t showInLegend: true,
\t \t legendText: "Cross",
\t \t dataPoints: [
\t \t \t { x: 1, y: 31, markerSize: 10 },
\t \t \t { x: 2, y: 15, markerSize: 20 },
\t \t \t { x: 3, y: 10, markerSize: 30 },
\t \t \t { x: 4, y: 25, markerSize: 40 },
\t \t \t { x: 5, y: 15, markerSize: 50 }
\t \t ]
\t }
\t ]
});
chart.render();<script src="http://canvasjs.com/assets/script/canvasjs.min.js"></script>
<div id="chartContainer" style="height: 300px; width: 100%;"></div>感謝@Vishwas R爲你非常好的例子。但是，它沒有雙因素的圖例，顏色和尺寸。如果可能有多因素的傳說，如果我點擊「大」的大小，那麼無論它是什麼形狀，大的散點都會隱藏起來。 – user7117436
有人關心，告訴我downvoting的原因是什麼？ – user7117436
可能是因爲要求一個庫和沒有特定問題的代碼。 –
@MaximilianPeters我不知道。顯然這不是一個代碼相關的問題。我搜索了「JavaScript堆棧交換」，這個網站是第一個搜索結果。這就是我在這裏問的原因。 Thx回答。 – user7117436