2014-01-28 4 views
2

При создании диаграммы области (стек + заливка для линейной диаграммы) точки перекрываются цветом заливки.Флот: ошибка наложенной линейной диаграммы - точки накладываются

Я создал пример, чтобы продемонстрировать эту ошибку: http://jsfiddle.net/d3bpD/

ФЛОТ варианты: диаграмма

var options = { 
    series: { stack: true }, 
    lines: { 
     fill: 1, 
     show: true 
    }, 
    points: { show: true } 
}; 

Что может быть возможным обходной путь для этого?

ответ

1

Похож на ошибку в том, как флот заполняется плагином стека. Единственное быстрое решение, о котором я могу думать, не копаясь в источнике, - это реплицировать данные в две серии для каждого набора данных. Первый рисует линии и заливки, второй только точки на вершине:

someData = [[1, 3], 
      [2, 16], 
      [3, 3], 
      [4, 3], 
      [5, 8], 
      [6, 12], 
      [7, 3]]; 

var dataset = [ 
    {color: "#edc240", data: someData, stack: 1, lines: {fill: 1, show: true}, points: {show: false}}, 
    {color: "#afd8f8", data: someData, stack: 1, lines: {fill: 1, show: true}, points: {show: false}}, 
    {color: "#cb4b4b", data: someData, stack: 1, lines: {fill: 1, show: true}, points: {show: false}}, 
    {color: "#4da74d", data: someData, stack: 1, lines: {fill: 1, show: true}, points: {show: false}}, 
    {color: "#edc240", data: someData, stack: 2, lines: {show: false}, points: {show: true}}, 
    {color: "#afd8f8", data: someData, stack: 2, lines: {show: false}, points: {show: true}}, 
    {color: "#cb4b4b", data: someData, stack: 2, lines: {show: false}, points: {show: true}}, 
    {color: "#4da74d", data: someData, stack: 2, lines: {show: false}, points: {show: true}} 
]; 

$.plot("#flot", dataset, {}); 

скрипку here.

Производит:

enter image description here

+0

Спасибо за ваш ответ! В настоящее время это выглядит как наиболее разумный подход. – Vilis

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