2016-11-18 2 views
7

Я рисую диаграмму пузырьков на веб-странице. Я хочу получить список цветов по умолчанию, которые используются графически для рисования пузырьков.Как получить список цветов по умолчанию Plotly.js?

+0

Есть функция, которая генерирует цвет, вы должны пройти целое к функции GetColor. var getColor = Plotly.d3.scale.category20(); –

ответ

7

Plotly использует тот же colors как в scale.category20() функции d3 «s, но только на самом деле используется каждый второй цвет, смотрите пример ниже, т.е. 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>

8

Согласно исходному коду 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 серий, вы вернетесь к первому цвету.

1

Вы также можете использовать что-то вроде этого, чтобы получить цвета, используемые в вашем участке:

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 
Смежные вопросы