This documentation is for the legacy Izenda 6 product. Documentation for the new Izenda 7 product can be found at https://www.izenda.com/docs/
Customizing the chart colors allows you to inject a bit of your own branding, or any other color scheme, into Izenda's reports.
This image depicts a pie chart with custom colors set to Blue, Red, Yellow and Green.
The following code snippet should be added to the default.master page in a webforms implementation, or in Views/Shared/_SiteLayout.cshtml in an MVC implementation:
<script type="text/javascript"> htmlChartColors = ['Blue', 'Red', 'Yellow', 'Green']; </script>
This would achieve the color scheme from the example image above.
Note: you will need a recent copy of the Izenda core product. This ability was added in 6.7.0.264, and can be downloaded here
Visualizations use the D3 javascript library, which means that to customize the colors used in a specific visualization you must modify that feature's base code. There is no global setting to change the colors used in a visualization, as each visualization has its own independent codebase.
Here, the Heatmap visualization has been customized to use two colors - red and green.
Here we have customized the Color function in the base visualization definition, located by default at .\Resources\Vis\Rectangular\Heatmap\View.html
var items = vis.getItems(), sum = 0, avg = 0; for (var i = 0; i < items.length; ++i) { sum += vis.unitValue(items[i], s.props.metric); } avg = sum / items.length; function color(d) { // val - value of the current rectangle. var val = vis.unitValue(d, s.props.metric); return (val > avg) ? "#FF0000" : "#00FF00"; }
The basic steps involved here are:
Last edited by ericpfeifer-izenda, 2019-01-07 11:53:43