I’m trying to draw line chart with shadows. The only way i found to override ctx.stroke method and add shadow properties to it, but in this case shadow appears also on gridlines and points.
Example: https://jsfiddle.net/1geu4zd5/2/
I tried to implement shadows by extending line element
const ShadowLineElement = Chart.elements.Line.extend({
draw () {
Chart.elements.Line.prototype.draw.apply(this, arguments)
const { ctx } = this._chart
const originalStroke = ctx.stroke
ctx.stroke = function () {
ctx.save()
ctx.shadowColor = 'red'
ctx.shadowBlur = 0
ctx.shadowOffsetX = 0
ctx.shadowOffsetY = 8
originalStroke.apply(this, arguments)
ctx.restore()
}
}
})
Is there any way to draw shadow only for lines?
Sorry about that, I missed that part of your fiddle. Trying the plugin hooks and see how they work.
I modified your fiddle a bit to remove the shadow after drawing the line element. https://jsfiddle.net/dces93wv/