Question

I am using the RGraph and I need to create circles with a gradients,
so they look to be 3D spheres.
I have created a new node type called blob and I have implemented the
code as follows. However, the gradient is applied to the entire
canvas.
Not sure I could explain it, but is there anyone that can help?

$jit.RGraph.Plot.NodeTypes.implement({
'blob': {
    render: function (node, canvas) {
        var pos = node.pos.getc(true),
        dim = node.getData("dim");

        // not sure about this code
        var ctx = canvas.getCtx();
        var radgrad = ctx.createRadialGradient(0, 0, dim, 0, 0, node.getPos().rho);
        radgrad.addColorStop(0, '#A7D30C');
        radgrad.addColorStop(0.9, '#019F62');
        radgrad.addColorStop(1, 'rgba(1,159,98,0)');
        ctx.fillStyle = radgrad;

        this.nodeHelper.circle.render("fill", pos, dim, canvas)
    },
    contains: function (node, canvas) {
        var pos = node.pos.getc(true),
        dim = node.getData("dim");
        return this.nodeHelper.circle.contains(pos, canvas, dim)
    }
}

});

Many thanks

Ivan

Answer 1

I got the answer here:
Google Group

Basically, the radgrad should be like this:

var radgrad = ctx.createRadialGradient(pos.x, pos.y, radius+20, pos.x-radius, pos.y,radius);