Difference between revisions of "Widget Editor Theme Tab"
From dataZoa Wiki
m |
m |
||
| Line 16: | Line 16: | ||
* Namespace your theme object as: <i>Highchart.theme = {...}</i> | * Namespace your theme object as: <i>Highchart.theme = {...}</i> | ||
* After creation, apply your theme via: <i>Highcharts.setOptions(Highcharts.theme);</i> | * After creation, apply your theme via: <i>Highcharts.setOptions(Highcharts.theme);</i> | ||
| + | </div> | ||
| + | |||
| + | ==== Enhancements: ==== | ||
| + | <div style="margin: 2em; margin-left: 6em;"> | ||
| + | Enhance or override any setting of the applied theme (e.g. add a subtitle, change fonts, refine tooltip behavior...) | ||
| + | * Enhancements must be entered as a valid [[Template: Javascript Object Literal|JavaScript object literal]] which will be applied after the <i>Theme</i> and a handful of preset dataZoa options for full flexability. | ||
| + | * Only options and properties recognized by Highcharts will have an affect... [https://api.highcharts.com/highcharts/ Highcharts Options Reference] | ||
| + | * <div class="imgGlyph24 imgNote"></div> Use the full <b>Preview</b> tan to visualize the affects of enhancements. Such changes are <i>not</i> reflected in the <i>Theme Preview</i>. | ||
</div> | </div> | ||
Revision as of 06:35, 11 September 2018
Themes:
Select a theme to use in applying colors and style to the Widget. There are a handful of preconfigured themes to choose from with their basic effects displayed in the Theme Preview to the right.
Advanced Options
Advanced Options
Remote Theme:
Optionally bypass all preconfigured themes by linking to a custom remote theme file.
- Using https is required to ensure proper loading of themes
- Themes are JavaScript files which set and apply Highchart options
- Namespace your theme object as: Highchart.theme = {...}
- After creation, apply your theme via: Highcharts.setOptions(Highcharts.theme);
Enhancements:
Enhance or override any setting of the applied theme (e.g. add a subtitle, change fonts, refine tooltip behavior...)
- Enhancements must be entered as a valid JavaScript object literal which will be applied after the Theme and a handful of preset dataZoa options for full flexability.
- Only options and properties recognized by Highcharts will have an affect... Highcharts Options Reference
- Use the full Preview tan to visualize the affects of enhancements. Such changes are not reflected in the Theme Preview.
