@devexperts/dxcharts-lite
Version:
77 lines (75 loc) • 3.55 kB
JavaScript
/*
* Copyright (C) 2019 - 2025 Devexperts Solutions IE Limited
* This Source Code Form is subject to the terms of the Mozilla Public License, v. 2.0.
* If a copy of the MPL was not distributed with this file, You can obtain one at https://mozilla.org/MPL/2.0/.
*/
import { CanvasElement } from '../../canvas/canvas-bounds-container';
import { getEventSize } from './events.drawer';
const hoverExtendedAreaPixels = 5;
export class EventsHitTestDrawer {
constructor(hitTestCanvasModel, chartModel, config, canvasBoundsContainer, model, drawPredicate = () => true) {
this.hitTestCanvasModel = hitTestCanvasModel;
this.chartModel = chartModel;
this.config = config;
this.canvasBoundsContainer = canvasBoundsContainer;
this.model = model;
this.drawPredicate = drawPredicate;
}
/**
* Draws events on the hit test canvas.
* @function
* @name draw
* @memberof CanvasElement.EVENTS
* @instance
* @returns {void}
*/
draw() {
if (this.drawPredicate()) {
const ctx = this.hitTestCanvasModel.ctx;
const bounds = this.canvasBoundsContainer.getBounds(CanvasElement.EVENTS);
ctx.save();
this.model.events.forEach((event, idx) => {
const visible = this.config.components.events.eventsVisibility[event.type];
if (!visible) {
return;
}
const prevEvent = this.model.events[idx - 1];
const prevX = prevEvent &&
this.chartModel.candleFromTimestamp(prevEvent.timestamp).xCenter(this.chartModel.scale);
const x = this.chartModel.candleFromTimestamp(event.timestamp).xCenter(this.chartModel.scale);
if (x > bounds.x && x < bounds.x + bounds.width) {
const color = this.config.colors.events[event.type].color;
ctx.strokeStyle = color;
ctx.fillStyle = color;
const size = getEventSize(event);
// draw hit test
ctx.fillStyle = this.hitTestCanvasModel.idToColor(event.id);
const hoverSize = (size + hoverExtendedAreaPixels) * 2;
if (prevX !== undefined) {
const prevSize = getEventSize(prevEvent);
const prevVisible = this.config.components.events.eventsVisibility[prevEvent.type];
const isIntersectsWithPrev = prevVisible && prevX + prevSize > x - hoverSize / 2;
if (isIntersectsWithPrev) {
const hoverSize = size * 2 + hoverExtendedAreaPixels;
ctx.fillRect(prevX + prevSize, bounds.y, hoverSize, bounds.height);
}
else {
ctx.fillRect(x - size - hoverExtendedAreaPixels, bounds.y, hoverSize, bounds.height);
}
}
else {
ctx.fillRect(x - size - hoverExtendedAreaPixels, bounds.y, hoverSize, bounds.height);
}
}
});
ctx.restore();
}
}
/**
* Returns an array of string containing the canvas ID of the hitTestCanvasModel.
* @returns {Array<string>} An array of string containing the canvas ID of the hitTestCanvasModel.
*/
getCanvasIds() {
return [this.hitTestCanvasModel.canvasId];
}
}