Use a Controller object to add the generator to a chart:
const lollipopGenerator = controller.addGenerator('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);
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) => {})
/**
* 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
/**
* 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);