Open reachtoakhtar opened 5 years ago
Found a workaround. Insert a linearGradient element inside svg by using the callback attribute in chart and apply the following css:
.nv-area {
fill: url(#grad3) !important;
}
chart: {
type: 'stackedAreaChart',
height: 350,
...
...
callback: function (chart) {
// Add gradient color to graph.
var linearGrad = d3.select("svg").append("linearGradient");
linearGrad.attr('id', 'grad3');
linearGrad.attr("x1", "0%");
linearGrad.attr("x2", "100%");
linearGrad.attr("y1", "0%");
linearGrad.attr("y2", "100%");
linearGrad.html(
'<stop offset="0%" style="stop-color:rgb(255,255,0);stop-opacity:1"/>' +
'<stop offset="100%" style="stop-color:rgb(255,0,0);stop-opacity:1"/>'
);
}
}
I want to use the background colour as gradient in stacked area chart. Is it possible?