如何获得Plotly.js默认颜色列表？

Question

我正在绘制一个网页上的阴谋泡泡图..我想获得默认颜色的列表，积极使用绘制泡沫。

Answer 1

Plotly使用相同colors如d3的scale.category20()功能但实际上仅使用每第二颜色，请参见下面的例子中，即得到trace0颜色0，trace1得到颜色2，trace2得到彩色4等和后trace9整个颜色方案从0

var colors = Plotly.d3.scale.category20(); 
 
var color_div = document.getElementById("colors"); 
 
var data = []; 
 
var i = 0; 
 

 
for (i = 0; i < 12; i += 1) { 
 
    data.push({ 
 
    x: [i, i + 1], 
 
    y: [0, i + 1], 
 
    name: "Trace: " + i + "<br />Color: " + colors(i) 
 
    }); 
 
} 
 
Plotly.plot(color_div, data); 
 

 
var node; 
 
var textnode; 
 
for (i = 0; i < 20; i += 1) { 
 
    node = document.createElement("LI"); 
 
    node.style.color = colors(i); 
 
    textnode = document.createTextNode(colors(i)); 
 
    color_div.appendChild(node); 
 
    node.appendChild(textnode); 
 
}

<script src="https://cdn.plot.ly/plotly-latest.min.js"></script> 
 
<div id="colors"></div>

Answer 2

再次开始根据Plotly.js（SRC /组件/颜色/属性的源代码.js），默认颜色列表是

'#1f77b4', // muted blue 
    '#ff7f0e', // safety orange 
    '#2ca02c', // cooked asparagus green 
    '#d62728', // brick red 
    '#9467bd', // muted purple 
    '#8c564b', // chestnut brown 
    '#e377c2', // raspberry yogurt pink 
    '#7f7f7f', // middle gray 
    '#bcbd22', // curry yellow-green 
    '#17becf' // blue-teal 

如果您有超过10个系列，您将返回第一个颜色。

Answer 3

您也可以使用这样的事情来检索您的情节中使用的颜色：

return.plot_ly.ColorsUsed <- function(plotlyObject) { 

     explorePlot = plotly_json(plotlyObject) 
     explorePlot = jsonlite::fromJSON(explorePlot$x$data) 

     # Extract colors, names and fillcolors 
     colors = explorePlot$data$marker$color 
     names = explorePlot$data$name 
     fillcolors = explorePlot$data$marker$fillcolor 



     # Returns a list with the names, colors and fillcolors used in the plot 
     toReturn = list("names" = names, 
         "colors" = colors, 
         "fillcolors" = fillcolors) 

     return(toReturn) 


} # End FUnction return.plot_ly.ColorsUsed