2012-06-27 2 views
1

Основная цель моей проблемы - поместить определенные цвета в Donut Change. Я гугл на некоторое время и я считаю, что JqPlot это лучшая библиотека для этого, но я столкнулся с проблемами, пытаясь изменить тему кольцевой диаграммы на JqPlot:Измените тему диаграммы пончиков, используя JqPlot

Я нашел документацию здесь:

http://www.jqplot.com/deploy/dist/examples/theming.html

http://www.jqplot.com/docs/files/jqplot-themeEngine-js.html

Так что я попытался применить тему, как это:

var gabe = { 
    seriesColors: ["#4bb2c5", "#EAA228", "#c5b47f", "#579575", "#839557", "#958c12"], 
    grid: { backgroundColor: '#000000' } 
} 
... {my chart} 
plot3.themeEngine.newTheme('gabe', gabe); 
plot3.activateTheme('gabe'); 

Но изменился только фон. Как я могу изменить цвета пончика?

ответ

2

Проблема в том, что вы не размещаете seriesColors в seriesStyles. Ниже код взят из первой ссылки вы предоставили :)

gabe = { 
     seriesStyles: { 
      seriesColors: ['red', 'orange', 'yellow', 'green', 'blue', 'indigo'], 
      highlightColors: ['lightpink', 'lightsalmon', 'lightyellow', 'lightgreen', 'lightblue', 'mediumslateblue'] 
     }, 
     legend: { 
      fontSize: '8pt' 
     }, 
     title: { 
      fontSize: '18pt' 
     }, 
     grid: { 
      backgroundColor: 'rgb(211, 233, 195)' 
     } 
    }; 
    plot.themeEngine.newTheme('gabe', gabe); 
    plot.activateTheme('gabe'); 

This is what it does.

This sample shows that all gets applied just notseriesColors (как мы закомментировали seriesStyles для этого). Таким образом, вывод, что seriesColors должен быть помещен внутри seriesStyles.

Я сделал это analysys, так как это был мой первый контакт с функцией темы jqPlot, и по первому взгляду все показалось ОК в фрагменте кода, который вы дали.

+0

Ровно! Есть только одна хромая часть. Чтобы создать лучшую диаграмму, мне пришлось вручную определить немного более белый цвет подсветки для каждого цвета серии: 'var theme = { seriesStyles: { seriesColors: ['# B97A57', '# FFC90E ',' # FF7F27 ',' # 800000 '], highlightColors: [' # E5976E ',' # FFD756 ',' # FF9E5E ',' # B70000 '] } }; ' – Custodio

+0

+1 Спасибо, мне это помогает много. – SMK

Смежные вопросы