Lollipop Generator

Add to Chart:

Use a BG.charts.Controller object to add the generator to a chart:

const lollipopGenerator = controller.addGenerator('LollipopGenerator');

Draw and manage lollipops

Each lollipop displayed in the chart is a single tool, created by the generator. Each tool has its own set of options and can also be modified after its creation.

const lollipop = lollipopGenerator.createLollipop(Date.now(), '\ue900', 'orange');

lollipop.get(); // retrieve all available options
lollipop.set('iconCharacter', '#\e039');
lollipop.set('timestamp', Date.now() - 24*60*60*1000);
lollipop.set('color', '#00ff00');

lollipopGenerator.removeLollipop(lollipop);

Event handling

Each tool and the generator itself are self-emitting EventEmitters. The events on user interaction are as follows:

lollipopA.on('mousedown', (event) => {})
lollipopA.on('mouseup', (event) => {})

lollipopGenerator.on('lollipopMousedown', (event, lollipopTool) => {})
lollipopGenerator.on('lollipopMouseup', (event, lollipopTool) => {})
lollipopGenerator.on('lollipopAdded', (lollipopTool) => {})
lollipopGenerator.on('lollipopRemoved', (lollipopTool) => {})

Methods

LollipopGenerator

/**
 * creates a new lollipop tool and returns it
 * Throws an error if one if its parameters is missing
 * @param ts: number
 * @param iconCharacter: string, should be one of the available icons from the bnpp-calendar-icons-font
 * @param color: string
 */
public createLollipop(ts: number, iconCharacter: string, color: string): LollipopTool

/**
 * removes a lollipop tool from the chart
 * returns true if the tool has been removed from the chart, otherwise false
 * @param lollipop: LollipopTool
 */
public removeLollipop(lollipop: LollipopTool): boolean

LollipopTool

/**
 * timestamp of the lollipop
 */
get(type: 'timestamp'): number
set(type: 'timestamp', value: number);

/**
 * color of the lollipop, can be a name, e.g. 'orange', or an rgb/rgba value, e.g. 'rgba(50,220,100,0.5)'
 */
get(type: 'color'): string
set(type: 'color', value: string);

/**
 * string, should be one of the font icons (\ue900 - \ue904)
 */
get(type: 'iconCharacter'): string
set(type: 'iconCharacter', value: string);