@devexperts/dxcharts-lite
Version:
71 lines (70 loc) • 3.7 kB
JavaScript
/*
* Copyright (C) 2019 - 2026 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 { flat } from '../../utils/array.utils';
const DEFAULT_FILL_COLOR = '#FF00FF';
export class TrendPointsDrawer {
constructor() { }
draw(ctx, allPoints, model, hitTestDrawerConfig) {
const allPointsFlat = flat(allPoints);
const config = model.getPaintConfig(0);
const radius = hitTestDrawerConfig.hoverWidth ? hitTestDrawerConfig.hoverWidth / 2 : config.lineWidth;
allPointsFlat.forEach((point, idx) => {
var _a, _b, _c, _d, _e, _f, _g, _h;
// 2 colors: Negative and Positive
const previousClose = previousValue(allPointsFlat, idx);
const isNegativeTrend = previousClose && point.close < previousClose;
if (((_a = config.multiplyColors) === null || _a === void 0 ? void 0 : _a.length) === 2) {
ctx.fillStyle =
(_b = hitTestDrawerConfig.color) !== null && _b !== void 0 ? _b : ((isNegativeTrend ? config.multiplyColors[1] : config.multiplyColors[0]) ||
config.color ||
DEFAULT_FILL_COLOR);
const x = model.view.toX(point.centerUnit);
const y = model.view.toY(point.close);
ctx.arc(x, y, radius, 0, Math.PI * 2);
ctx.fill();
return;
}
// 4 colors: Negative and Down, Negative and Up, Positive and Down, Positive and Up
if (((_c = config.multiplyColors) === null || _c === void 0 ? void 0 : _c.length) === 4) {
if (isNegativeTrend && point.close < 0) {
ctx.fillStyle =
(_d = hitTestDrawerConfig.color) !== null && _d !== void 0 ? _d : (config.multiplyColors[0] || config.color || DEFAULT_FILL_COLOR);
}
if (!isNegativeTrend && point.close < 0) {
ctx.fillStyle =
(_e = hitTestDrawerConfig.color) !== null && _e !== void 0 ? _e : (config.multiplyColors[1] || config.color || DEFAULT_FILL_COLOR);
}
if (isNegativeTrend && point.close > 0) {
ctx.fillStyle =
(_f = hitTestDrawerConfig.color) !== null && _f !== void 0 ? _f : (config.multiplyColors[2] || config.color || DEFAULT_FILL_COLOR);
}
if (!isNegativeTrend && point.close > 0) {
ctx.fillStyle =
(_g = hitTestDrawerConfig.color) !== null && _g !== void 0 ? _g : (config.multiplyColors[3] || config.color || DEFAULT_FILL_COLOR);
}
ctx.beginPath();
const x = model.view.toX(point.centerUnit);
const y = model.view.toY(point.close);
ctx.arc(x, y, radius, 0, Math.PI * 2);
ctx.fill();
return;
}
// 1 color
ctx.fillStyle = (_h = hitTestDrawerConfig.color) !== null && _h !== void 0 ? _h : (config.color || DEFAULT_FILL_COLOR);
ctx.beginPath();
const x = model.view.toX(point.centerUnit);
const y = model.view.toY(point.close);
ctx.arc(x, y, radius, 0, Math.PI * 2);
ctx.fill();
});
}
}
export const previousValue = (arr, idx) => {
do {
idx--;
} while (idx >= 0 && !isFinite(arr[idx] && arr[idx].close));
return arr[idx] ? arr[idx].close : undefined;
};