@devexperts/dxcharts-lite
Version:
109 lines (107 loc) • 5.12 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 { CHART_UUID, CanvasElement } from '../../canvas/canvas-bounds-container';
import { ChartBaseElement } from '../../model/chart-base-element';
import { merge } from '../../utils/merge.utils';
import { WaterMarkDrawer } from './water-mark.drawer';
export class WaterMarkComponent extends ChartBaseElement {
constructor(paneManager, chartModel, eventBus, config, canvasBoundsContainer, canvasModel, drawingManager) {
super();
this.paneManager = paneManager;
this.chartModel = chartModel;
this.eventBus = eventBus;
this.config = config;
this.canvasModel = canvasModel;
this.waterMarkConfig = this.config.components.waterMark;
this.waterMarkData = this.getWaterMarkData();
this.waterMarkDrawer = new WaterMarkDrawer(this.config, canvasBoundsContainer, canvasModel, () => this.waterMarkConfig, () => this.waterMarkData);
this.addRxSubscription(merge(canvasBoundsContainer.observeBoundsChanged(CanvasElement.PANE_UUID(CHART_UUID)), this.paneManager.paneAddedSubject).subscribe((bounds) => {
this.waterMarkConfig = this.recalculateTextSize(bounds.width, bounds.height);
}));
this.addRxSubscription(this.chartModel.candlesSetSubject.subscribe(() => {
this.waterMarkData = this.getWaterMarkData();
}));
drawingManager.addDrawerAfter(this.waterMarkDrawer, 'WATERMARK', 'DYNAMIC_OBJECTS');
}
/**
* Sets the visibility of the watermark component.
*
* @param {boolean} visible - A boolean indicating whether the watermark should be visible or not.
* @returns {void}
*/
setWaterMarkVisible(visible) {
if (this.config.components && this.config.components.waterMark) {
this.config.components.waterMark.visible = visible;
this.canvasModel.fireDraw();
}
}
/**
* Sets the watermark data to be used in the canvas.
* @param {WaterMarkData} watermarkData - The data to be used as watermark.
* @returns {void}
*/
setWaterMarkData(watermarkData) {
this.waterMarkData = watermarkData;
this.canvasModel.fireDraw();
}
/**
* Returns the water mark data object if it exists, otherwise returns an empty object.
* @returns {WaterMarkData} The water mark data object.
*/
getWaterMarkData() {
return this.waterMarkData || {};
}
/**
* Sets the watermark configuration for the chart.
* @param {ChartConfigComponentsWaterMark} watermarkConfig - The configuration object for the watermark.
* @returns {void}
*/
setWaterMarkConfig(watermarkConfig) {
if (!watermarkConfig || !this.config.components) {
return;
}
if (!this.config.components.waterMark) {
this.config.components.waterMark = JSON.parse(JSON.stringify(watermarkConfig));
}
else {
const newWatermark = {};
merge(newWatermark, watermarkConfig);
merge(newWatermark, this.config.components.waterMark);
// eslint-disable-next-line no-restricted-syntax
this.config.components.waterMark = newWatermark;
}
this.canvasModel.fireDraw();
}
/**
* Sets the logo image to be used as a watermark.
* @param {CanvasImageSource} img - The image to be used as a watermark.
*/
setLogoImage(img) {
this.waterMarkDrawer.setLogoImage(img);
}
/**
* Recalculates the watermark text size based on the chart's width and height.
* @param {number} chartWidth - The width of the chart.
* @param {number} chartHeight - The height of the chart.
* @returns {Object} - An object containing the updated watermark font sizes.
*/
recalculateTextSize(chartWidth, chartHeight) {
const defaultScreenWidth = 1920;
const defaultScreenHeight = 1080;
// this function is used to make logarithmic dependency between screen size and watermark size
const fun = (x) => (0.15 * Math.log(x)) / Math.log(1.5) + 1;
const textSizeRatioHorizontal = fun(chartWidth / defaultScreenWidth);
const textSizeRatioVertical = fun(chartHeight / defaultScreenHeight);
const textSizeRatio = Math.min(textSizeRatioHorizontal, textSizeRatioVertical);
const textRatio = textSizeRatio >= 0 ? textSizeRatio : 0;
const updatedProps = {
firstRowFontSize: Math.round(this.config.components.waterMark.firstRowFontSize * textRatio),
secondRowFontSize: Math.round(this.config.components.waterMark.secondRowFontSize * textRatio),
thirdRowFontSize: Math.round(this.config.components.waterMark.thirdRowFontSize * textRatio),
};
return Object.assign(Object.assign({}, this.config.components.waterMark), updatedProps);
}
}