9.7.0 to 9.8.0
Hex Color Picker and Opacity Slider
As of version 9.8, the mountain chart opacity is set within the theme color. Previously, opacity was fixed when theme colors were set. Now, with opacity integrated into the color, it can be adjusted using the updated color picker.
If you're not using the default color picker from the templates, update your theme color picker to include opacity. You can use either rgba()
or an 8-digit hex value.
If this is not an option for you, restore the old functionality by overriding the CIQ.ThemeHelper
update function and applying opacity values to the colors. Add the following after CIQ
is available but before the chart loads:
const savedUpdateFunction = CIQ.ThemeHelper.prototype.update;
CIQ.ThemeHelper.prototype.update = function(stx) {
savedUpdateFunction.call(this, stx);
if (!stx) stx = this.params.stx;
stx.setStyle(
"stx_mountain_chart",
"backgroundColor",
CIQ.hexToRgba(this.settings.chartTypes.Mountain.color, 0.5)
);
stx.setStyle(
"stx_mountain_chart",
"color",
CIQ.hexToRgba(this.settings.chartTypes.Mountain.basecolor, 0.01)
);
};
Renderers and webpack bundling
Note: For those importing advanced.js
and not using webpack tree shaking, no changes are necessary for this upgrade. However, if you were importing separate files for advanced features, be aware that renderersAdvanced.js
is no longer available. You should now import the required files from the renderers folder.
When bundling with webpack, you can selectively include the renderers you want through tree shaking.
To upgrade to 9.7.0, you will need to modify what you are activating as per chartiq/webpack-example/importActivationAdvanced.js
.
importActivationAdvanced.js:
Advanced.renderersAdvanced
has been replaced with Advanced.advancedNexus
and should always be included if you are using any of the renderers listed below.
Add the following renderer activations as required:
Advanced.bars,
Advanced.heatmap,
Advanced.histogram,
Advanced.hlc,
Advanced.ohlc,
Advanced.scatter,
Advanced.shading,
Optional Imports
The imports ./js/chartiq.js
, ./js/standard.js
, and ./js/componentUI.js
have been added in certain templates to enhance performance.
Adding these imports is optional, and the library functions normally without them. However, including them in your template can improve load times through parallel loading.