@nativescript-community/ui-chart/components/MarkerImage.js

A powerful chart / graph plugin, supporting line, bar, pie, radar, bubble, and candlestick charts as well as scaling, panning and animations.

import { Rect } from '@nativescript-community/ui-canvas';
/**
 * View that can be displayed when selecting values in the chart. Extend this class to provide custom layouts for your
 * markers.
 *

 */
class MarkerImage {
    constructor() {
        this.mOffset = { x: 0, y: 0 };
        this.mOffset2 = { x: 0, y: 0 };
        this.mSize = { width: 0, height: 0 };
        this.mDrawableBoundsCache = new Rect(0, 0, 0, 0);
    }
    /**
     * Constructor. Sets up the MarkerView with a custom layout resource.
     *
     * @param context
     * @param drawableResourceId the drawable resource to render
     */
    MarkerImage(imageSource) {
        this.imageSource = imageSource;
        this.mDrawableBoundsCache.set(0, 0, imageSource.width, imageSource.height);
    }
    set offset(offset) {
        this.mOffset = offset || { x: 0, y: 0 };
    }
    get offset() {
        return this.mOffset;
    }
    set size(size) {
        this.mSize = size || { width: 0, height: 0 };
    }
    get size() {
        return this.mSize;
    }
    set chartView(chart) {
        this.mWeakChart = new WeakRef(chart);
    }
    get chartView() {
        return this.mWeakChart?.get();
    }
    getOffsetForDrawingAtPoint(posX, posY) {
        const offset = this.offset;
        this.mOffset2.x = offset.x;
        this.mOffset2.y = offset.y;
        const chart = this.chartView;
        let width = this.mSize.width;
        let height = this.mSize.height;
        if (width === 0 && this.imageSource) {
            width = this.imageSource.width;
        }
        if (height === 0 && this.imageSource) {
            height = this.imageSource.height;
        }
        if (posX + this.mOffset2.x < 0) {
            this.mOffset2.x = -posX;
        }
        else if (chart && posX + width + this.mOffset2.x > chart.getMeasuredWidth()) {
            this.mOffset2.x = chart.getMeasuredWidth() - posX - width;
        }
        if (posY + this.mOffset2.y < 0) {
            this.mOffset2.y = -posY;
        }
        else if (chart && posY + height + this.mOffset2.y > chart.getMeasuredHeight()) {
            this.mOffset2.y = chart.getMeasuredHeight() - posY - height;
        }
        return this.mOffset2;
    }
    refreshContent(e, highlight) { }
    draw(c, posX, posY) {
        if (!this.imageSource)
            return;
        const offset = this.getOffsetForDrawingAtPoint(posX, posY);
        let width = this.mSize.width;
        let height = this.mSize.height;
        if (width === 0 && this.imageSource) {
            width = this.imageSource.width;
        }
        if (height === 0 && this.imageSource) {
            height = this.imageSource.height;
        }
        // this.mDrawable.copyBounds(mDrawableBoundsCache);
        // this.mDrawable.setBounds(
        //         this.mDrawableBoundsCache.left,
        //         this.mDrawableBoundsCache.top,
        //         this.mDrawableBoundsCache.left + width,
        //         this.mDrawableBoundsCache.top + height);
        // c.save();
        // translate to the correct position and draw
        // c.translate(posX + offset.x, posY + offset.y);
        c.drawBitmap(this.imageSource, this.mDrawableBoundsCache, new Rect(posX + offset.x, posY + offset.y, posX + offset.x + width, posY + offset.y + height), null);
        // c.restore();
        // this.mDrawable.setBounds(mDrawableBoundsCache);
    }
}
//# sourceMappingURL=MarkerImage.js.map