Starting from version 5.3.x it is possible to enable gradient fill for Area price-type.
It requires editing the relevant “chart.css.json.js for” file, and adding a “fill2” and “fillOpacity” attributes with the required color and opacity.
You can locate the entry via price->area.
Solid fill:
|
1 2 3 4 5 |
"area": { "strokeWidth": "1", "stroke": "#8888FF", "fill": "#8888FF" }, |
Gradient fill version 5.3.x:
|
1 2 3 4 5 6 7 |
"price" > "area": { "strokeWidth": "1", "stroke": "#6666FF", "fill": "#8888FF", "fill2": "#FFFFFF", "fillOpacity": 0.8 }, |
Gradient fill version 5.4.x:
|
1 2 3 4 5 6 7 8 |
"price" > "area": { "strokeWidth": "1", "stroke": "#6666FF", "fill": "#8888FF", "fill2": "#FFFFFF", "fillOpacity": 0.8, "fillOpacity2": 0.0 }, |
stroke is the line color.
fill and fill2 are the gradient’s starting and ending colors.
fillOpacity is the gradient opacity.
fillOpacity2 is the gradient opacity for fill 2 (supported from version 5.4.0 and above).
