jQplot marker color based on value

31 views Asked by At

I have serie data [timestamp, value, id] for jqPlot:

[
    [1679385579000, 8.75, 1],
    [1679386210000, 11.004, 0],
    [1679386218000, 10.018, 2],
    [1679386222000, 10.018, 1]
]

I need to display different marker color/size/shape based on id parameter. So, I have used jqplot.shapeRenderer but cant find a way to pass required (options)

shapeRenderer: new $.jqplot.customMarkerRenderer(options)

to custom function

(function ($) {
    $.jqplot.customMarkerRenderer = function (options) {
        $.extend(true, this, options);
    };

    $.jqplot.customMarkerRenderer.prototype.init = function (options) {
        $.extend(true, this, options);
    };

    $.jqplot.customMarkerRenderer.prototype.draw = function (ctx, points, options) {

        ctx.save();

        // Shadow
        ctx.lineWidth = 10;
        ctx.strokeStyle = 'rgba(108, 161, 93, 0.3)';
        ctx.beginPath();
        ctx.arc(points[0], points[1], points[2], points[3], points[4], true);
        ctx.closePath();
        ctx.stroke();

        // Yellow inner
        ctx.lineWidth = 20;
        ctx.fillStyle = '#F6C528';
        ctx.beginPath();
        ctx.arc(points[0], points[1], points[2], points[3], points[4], true);
        ctx.closePath();
        ctx.fill();

        ctx.restore();
    };
})(jQuery);
0

There are 0 answers