Добавить белую границу/обводки Flot Поинт (JQuery график)

Question

Смотрите этот график, который positionly.com использование: https://www.dropbox.com/s/kz9ksagctf7zpaa/Screenshot%202015-12-18%2010.31.03.png?dl=0

Можно ли воссоздать это на графике Flot JQuery?

В настоящее время у меня есть следующие варианты:

points : { 
     show  : true, 
     radius : 2, 
     lineWidth: 3, 
     fillColor: 'red', 
     fill  : true, 
     shadowSize: 0 

Скриншот: https://www.dropbox.com/s/07wm4r8ojzhr5js/Screenshot%202015-12-18%2010.32.45.png?dl=0

Любые идеи о том, как добавить границы/ход - или это не возможно?

Answer 1

Это невозможно по умолчанию с параметрами флота. Вы можете определить отдельный fillColor для очков, но не отдельный цвет границы/хода.

Один из способов этого заключается в том, чтобы определить две серии данных с теми же данными:

• Первый с нормальным color: red (или зеленый), который имеет только линию позволяет
• и второй с color: white и fillColor: red (или зеленый), в котором указаны точки.

Результат:

Код (больше в fiddle):

var plot = $.plot("#placeholder", [{ 
    data: sin, 
    label: "sin(x)", 
    color: 'red', 
    points: { 
     show: false, 
    }, 
    lines: { 
     show: true, 
     lineWidth: 5 
    } 
}, { 
    data: sin, 
    color: 'white', 
    points: { 
     show: true, 
     lineWidth: 2, 
     radius: 5, 
     fill: true, 
     fillColor: 'red' 
    }, 
    lines: { 
     show: false 
    } 
}],