{
    "componentChunkName": "component---src-templates-doc-page-jsx",
    "path": "/react-data-grid/integrated-charts-customisation/",
    "result": {"data":{"markdownRemark":{"htmlAst":{"type":"element","tagName":"div","properties":{},"children":[{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Chart themes can be used to customise the look and feel of your charts to match your application."}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"AG Charts support "},{"type":"element","tagName":"a","properties":{"href":"/archive/29.3.3/charts-themes/"},"children":[{"type":"text","value":"Chart Themes"}]},{"type":"text","value":" to change how charts are styled. There are a number of chart themes provided out of the box by the grid. You can also provide your own custom chart theme to the grid to customise the colours of charts along with other styling options. Alternatively, you can just provide overrides to tweak the provided chart themes in the way you want."}]},{"type":"element","tagName":"h2","properties":{"id":"provided-themes","style":"position:relative;"},"children":[{"type":"text","value":"Provided Themes"},{"type":"element","tagName":"a","properties":{"href":"#provided-themes","ariaLabel":"provided themes permalink","className":["docs-header-icon","after"]},"children":[{"type":"element","tagName":"svg","properties":{"id":"icon","xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 32 32"},"children":[{"type":"element","tagName":"path","properties":{"d":"M29.25,6.76a6,6,0,0,0-8.5,0l1.42,1.42a4,4,0,1,1,5.67,5.67l-8,8a4,4,0,1,1-5.67-5.66l1.41-1.42-1.41-1.42-1.42,1.42a6,6,0,0,0,0,8.5A6,6,0,0,0,17,25a6,6,0,0,0,4.27-1.76l8-8A6,6,0,0,0,29.25,6.76Z"},"children":[]},{"type":"element","tagName":"path","properties":{"d":"M4.19,24.82a4,4,0,0,1,0-5.67l8-8a4,4,0,0,1,5.67,0A3.94,3.94,0,0,1,19,14a4,4,0,0,1-1.17,2.85L15.71,19l1.42,1.42,2.12-2.12a6,6,0,0,0-8.51-8.51l-8,8a6,6,0,0,0,0,8.51A6,6,0,0,0,7,28a6.07,6.07,0,0,0,4.28-1.76L9.86,24.82A4,4,0,0,1,4.19,24.82Z"},"children":[]}]}]}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"There are five chart themes that are provided by the grid: "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"'ag-default'"}]},{"type":"text","value":", "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"'ag-material'"}]},{"type":"text","value":", "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"'ag-pastel'"}]},{"type":"text","value":", "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"'ag-vivid'"}]},{"type":"text","value":" and "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"'ag-solar'"}]},{"type":"text","value":". When using a dark theme for the grid (e.g. "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"ag-theme-alpine-dark"}]},{"type":"text","value":"), dark equivalents of the chart themes are provided by default instead, named with a "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"-dark"}]},{"type":"text","value":" suffix, e.g. "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"'ag-vivid-dark'"}]},{"type":"text","value":"."}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"When you create a chart, you can scroll through the different available themes in the chart settings."}]},{"type":"element","tagName":"div","properties":{},"children":[{"type":"element","tagName":"gif","properties":{"src":"theme-picker.gif","alt":"Theme Picker"},"children":[]}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"You can change which themes are available by setting the "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"chartThemes"}]},{"type":"text","value":" property in "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"gridOptions"}]},{"type":"text","value":". The example below shows a different selection of themes configured in this way."}]},{"type":"element","tagName":"div","properties":{},"children":[{"type":"element","tagName":"grid-example","properties":{"title":"Configure Available Themes","name":"available-themes","type":"generated","options":"{ \"exampleHeight\": 690, \"enterprise\": true,  \"modules\": [\"clientside\", \"menu\", \"charts\", \"rowgrouping\"] }"},"children":[]}]},{"type":"element","tagName":"h2","properties":{"id":"custom-chart-themes","style":"position:relative;"},"children":[{"type":"text","value":"Custom Chart Themes"},{"type":"element","tagName":"a","properties":{"href":"#custom-chart-themes","ariaLabel":"custom chart themes permalink","className":["docs-header-icon","after"]},"children":[{"type":"element","tagName":"svg","properties":{"id":"icon","xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 32 32"},"children":[{"type":"element","tagName":"path","properties":{"d":"M29.25,6.76a6,6,0,0,0-8.5,0l1.42,1.42a4,4,0,1,1,5.67,5.67l-8,8a4,4,0,1,1-5.67-5.66l1.41-1.42-1.41-1.42-1.42,1.42a6,6,0,0,0,0,8.5A6,6,0,0,0,17,25a6,6,0,0,0,4.27-1.76l8-8A6,6,0,0,0,29.25,6.76Z"},"children":[]},{"type":"element","tagName":"path","properties":{"d":"M4.19,24.82a4,4,0,0,1,0-5.67l8-8a4,4,0,0,1,5.67,0A3.94,3.94,0,0,1,19,14a4,4,0,0,1-1.17,2.85L15.71,19l1.42,1.42,2.12-2.12a6,6,0,0,0-8.51-8.51l-8,8a6,6,0,0,0,0,8.51A6,6,0,0,0,7,28a6.07,6.07,0,0,0,4.28-1.76L9.86,24.82A4,4,0,0,1,4.19,24.82Z"},"children":[]}]}]}]},{"type":"element","tagName":"div","properties":{},"children":[{"type":"text","value":"You can create your own chart theme and provide it to the grid in the "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"customChartThemes"}]},{"type":"text","value":" map on "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"gridOptions"}]},{"type":"text","value":". Your theme should then be specified in "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"chartThemes"}]},{"type":"text","value":" to make it available to your users.\n"},{"type":"element","tagName":"snippet","properties":{"spacebetweenproperties":"true"},"children":[{"type":"text","value":"\n| const gridOptions = {\n|     customChartThemes: {\n|         myCustomTheme: {\n|             baseTheme: 'ag-pastel',\n|             palette: {\n|                 fills: ['#c16068', '#a2bf8a', '#ebcc87'],\n|                 strokes: ['#874349', '#718661', '#a48f5f']\n|             },\n|             overrides: {\n|                 common: {\n|                     title: {\n|                         fontSize: 22,\n|                         fontFamily: 'Arial, sans-serif'\n|                     }\n|                 }\n|             }\n|         }\n|     },\n|     chartThemes: ['myCustomTheme', 'ag-vivid']\n| }\n"}]}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"The example below shows a custom chart theme being used with the grid. Note that other provided themes can be used alongside a custom theme, and are unaffected by the settings in the custom theme."}]},{"type":"element","tagName":"div","properties":{},"children":[{"type":"element","tagName":"grid-example","properties":{"title":"Custom Chart Theme","name":"custom-chart-theme","type":"generated","options":"{ \"exampleHeight\": 660,\"enterprise\": true,  \"modules\": [\"clientside\", \"menu\", \"charts\"] }"},"children":[]}]},{"type":"element","tagName":"h2","properties":{"id":"overriding-existing-themes","style":"position:relative;"},"children":[{"type":"text","value":"Overriding Existing Themes"},{"type":"element","tagName":"a","properties":{"href":"#overriding-existing-themes","ariaLabel":"overriding existing themes permalink","className":["docs-header-icon","after"]},"children":[{"type":"element","tagName":"svg","properties":{"id":"icon","xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 32 32"},"children":[{"type":"element","tagName":"path","properties":{"d":"M29.25,6.76a6,6,0,0,0-8.5,0l1.42,1.42a4,4,0,1,1,5.67,5.67l-8,8a4,4,0,1,1-5.67-5.66l1.41-1.42-1.41-1.42-1.42,1.42a6,6,0,0,0,0,8.5A6,6,0,0,0,17,25a6,6,0,0,0,4.27-1.76l8-8A6,6,0,0,0,29.25,6.76Z"},"children":[]},{"type":"element","tagName":"path","properties":{"d":"M4.19,24.82a4,4,0,0,1,0-5.67l8-8a4,4,0,0,1,5.67,0A3.94,3.94,0,0,1,19,14a4,4,0,0,1-1.17,2.85L15.71,19l1.42,1.42,2.12-2.12a6,6,0,0,0-8.51-8.51l-8,8a6,6,0,0,0,0,8.51A6,6,0,0,0,7,28a6.07,6.07,0,0,0,4.28-1.76L9.86,24.82A4,4,0,0,1,4.19,24.82Z"},"children":[]}]}]}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Instead of providing a whole custom chart theme, you can instead supply just a set of theme overrides. These will be applied on top of every available theme. This can be useful for tweaking the style of your charts without having to provide a whole theme, or to make changes across multiple themes."}]},{"type":"element","tagName":"snippet","properties":{},"children":[{"type":"text","value":"\nconst gridOptions = {\n    chartThemeOverrides: {\n        common: {\n            title: {\n                fontSize: 22,\n                fontFamily: 'Arial, sans-serif'\n            }\n        }\n    }\n}\n"}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"The following examples show different types of chart being customised using theme overrides."}]},{"type":"element","tagName":"h3","properties":{"id":"example-common-chart-overrides","style":"position:relative;"},"children":[{"type":"text","value":"Example: Common Chart Overrides"},{"type":"element","tagName":"a","properties":{"href":"#example-common-chart-overrides","ariaLabel":"example common chart overrides permalink","className":["docs-header-icon","after"]},"children":[{"type":"element","tagName":"svg","properties":{"id":"icon","xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 32 32"},"children":[{"type":"element","tagName":"path","properties":{"d":"M29.25,6.76a6,6,0,0,0-8.5,0l1.42,1.42a4,4,0,1,1,5.67,5.67l-8,8a4,4,0,1,1-5.67-5.66l1.41-1.42-1.41-1.42-1.42,1.42a6,6,0,0,0,0,8.5A6,6,0,0,0,17,25a6,6,0,0,0,4.27-1.76l8-8A6,6,0,0,0,29.25,6.76Z"},"children":[]},{"type":"element","tagName":"path","properties":{"d":"M4.19,24.82a4,4,0,0,1,0-5.67l8-8a4,4,0,0,1,5.67,0A3.94,3.94,0,0,1,19,14a4,4,0,0,1-1.17,2.85L15.71,19l1.42,1.42,2.12-2.12a6,6,0,0,0-8.51-8.51l-8,8a6,6,0,0,0,0,8.51A6,6,0,0,0,7,28a6.07,6.07,0,0,0,4.28-1.76L9.86,24.82A4,4,0,0,1,4.19,24.82Z"},"children":[]}]}]}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"These overrides can be used with any chart type."}]},{"type":"element","tagName":"div","properties":{},"children":[{"type":"element","tagName":"grid-example","properties":{"title":"Common Chart Overrides","name":"common-overrides","type":"generated","options":"{ \"exampleHeight\": 660, \"enterprise\": true,  \"modules\": [\"clientside\", \"menu\", \"charts\"] }"},"children":[]}]},{"type":"element","tagName":"h3","properties":{"id":"example-cartesian-chart-overrides","style":"position:relative;"},"children":[{"type":"text","value":"Example: Cartesian Chart Overrides"},{"type":"element","tagName":"a","properties":{"href":"#example-cartesian-chart-overrides","ariaLabel":"example cartesian chart overrides permalink","className":["docs-header-icon","after"]},"children":[{"type":"element","tagName":"svg","properties":{"id":"icon","xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 32 32"},"children":[{"type":"element","tagName":"path","properties":{"d":"M29.25,6.76a6,6,0,0,0-8.5,0l1.42,1.42a4,4,0,1,1,5.67,5.67l-8,8a4,4,0,1,1-5.67-5.66l1.41-1.42-1.41-1.42-1.42,1.42a6,6,0,0,0,0,8.5A6,6,0,0,0,17,25a6,6,0,0,0,4.27-1.76l8-8A6,6,0,0,0,29.25,6.76Z"},"children":[]},{"type":"element","tagName":"path","properties":{"d":"M4.19,24.82a4,4,0,0,1,0-5.67l8-8a4,4,0,0,1,5.67,0A3.94,3.94,0,0,1,19,14a4,4,0,0,1-1.17,2.85L15.71,19l1.42,1.42,2.12-2.12a6,6,0,0,0-8.51-8.51l-8,8a6,6,0,0,0,0,8.51A6,6,0,0,0,7,28a6.07,6.07,0,0,0,4.28-1.76L9.86,24.82A4,4,0,0,1,4.19,24.82Z"},"children":[]}]}]}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"These overrides can be used with any cartesian chart."}]},{"type":"element","tagName":"div","properties":{},"children":[{"type":"element","tagName":"grid-example","properties":{"title":"Cartesian Chart Overrides","name":"cartesian-overrides","type":"generated","options":"{ \"exampleHeight\": 660, \"enterprise\": true,  \"modules\": [\"clientside\", \"menu\", \"charts\"] }"},"children":[]}]},{"type":"element","tagName":"h3","properties":{"id":"example-line-chart-overrides","style":"position:relative;"},"children":[{"type":"text","value":"Example: Line Chart Overrides"},{"type":"element","tagName":"a","properties":{"href":"#example-line-chart-overrides","ariaLabel":"example line chart overrides permalink","className":["docs-header-icon","after"]},"children":[{"type":"element","tagName":"svg","properties":{"id":"icon","xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 32 32"},"children":[{"type":"element","tagName":"path","properties":{"d":"M29.25,6.76a6,6,0,0,0-8.5,0l1.42,1.42a4,4,0,1,1,5.67,5.67l-8,8a4,4,0,1,1-5.67-5.66l1.41-1.42-1.41-1.42-1.42,1.42a6,6,0,0,0,0,8.5A6,6,0,0,0,17,25a6,6,0,0,0,4.27-1.76l8-8A6,6,0,0,0,29.25,6.76Z"},"children":[]},{"type":"element","tagName":"path","properties":{"d":"M4.19,24.82a4,4,0,0,1,0-5.67l8-8a4,4,0,0,1,5.67,0A3.94,3.94,0,0,1,19,14a4,4,0,0,1-1.17,2.85L15.71,19l1.42,1.42,2.12-2.12a6,6,0,0,0-8.51-8.51l-8,8a6,6,0,0,0,0,8.51A6,6,0,0,0,7,28a6.07,6.07,0,0,0,4.28-1.76L9.86,24.82A4,4,0,0,1,4.19,24.82Z"},"children":[]}]}]}]},{"type":"element","tagName":"div","properties":{},"children":[{"type":"element","tagName":"grid-example","properties":{"title":"Line Chart Overrides","name":"line-overrides","type":"generated","options":"{ \"exampleHeight\": 660, \"enterprise\": true,  \"modules\": [\"clientside\", \"menu\", \"charts\"] }"},"children":[]}]},{"type":"element","tagName":"h3","properties":{"id":"example-barcolumn-chart-overrides","style":"position:relative;"},"children":[{"type":"text","value":"Example: Bar/Column Chart Overrides"},{"type":"element","tagName":"a","properties":{"href":"#example-barcolumn-chart-overrides","ariaLabel":"example barcolumn chart overrides permalink","className":["docs-header-icon","after"]},"children":[{"type":"element","tagName":"svg","properties":{"id":"icon","xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 32 32"},"children":[{"type":"element","tagName":"path","properties":{"d":"M29.25,6.76a6,6,0,0,0-8.5,0l1.42,1.42a4,4,0,1,1,5.67,5.67l-8,8a4,4,0,1,1-5.67-5.66l1.41-1.42-1.41-1.42-1.42,1.42a6,6,0,0,0,0,8.5A6,6,0,0,0,17,25a6,6,0,0,0,4.27-1.76l8-8A6,6,0,0,0,29.25,6.76Z"},"children":[]},{"type":"element","tagName":"path","properties":{"d":"M4.19,24.82a4,4,0,0,1,0-5.67l8-8a4,4,0,0,1,5.67,0A3.94,3.94,0,0,1,19,14a4,4,0,0,1-1.17,2.85L15.71,19l1.42,1.42,2.12-2.12a6,6,0,0,0-8.51-8.51l-8,8a6,6,0,0,0,0,8.51A6,6,0,0,0,7,28a6.07,6.07,0,0,0,4.28-1.76L9.86,24.82A4,4,0,0,1,4.19,24.82Z"},"children":[]}]}]}]},{"type":"element","tagName":"div","properties":{},"children":[{"type":"element","tagName":"grid-example","properties":{"title":"Bar/Column Chart Overrides","name":"bar-overrides","type":"generated","options":"{ \"exampleHeight\": 660, \"enterprise\": true,  \"modules\": [\"clientside\", \"menu\", \"charts\"] }"},"children":[]}]},{"type":"element","tagName":"h3","properties":{"id":"example-area-chart-overrides","style":"position:relative;"},"children":[{"type":"text","value":"Example: Area Chart Overrides"},{"type":"element","tagName":"a","properties":{"href":"#example-area-chart-overrides","ariaLabel":"example area chart overrides permalink","className":["docs-header-icon","after"]},"children":[{"type":"element","tagName":"svg","properties":{"id":"icon","xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 32 32"},"children":[{"type":"element","tagName":"path","properties":{"d":"M29.25,6.76a6,6,0,0,0-8.5,0l1.42,1.42a4,4,0,1,1,5.67,5.67l-8,8a4,4,0,1,1-5.67-5.66l1.41-1.42-1.41-1.42-1.42,1.42a6,6,0,0,0,0,8.5A6,6,0,0,0,17,25a6,6,0,0,0,4.27-1.76l8-8A6,6,0,0,0,29.25,6.76Z"},"children":[]},{"type":"element","tagName":"path","properties":{"d":"M4.19,24.82a4,4,0,0,1,0-5.67l8-8a4,4,0,0,1,5.67,0A3.94,3.94,0,0,1,19,14a4,4,0,0,1-1.17,2.85L15.71,19l1.42,1.42,2.12-2.12a6,6,0,0,0-8.51-8.51l-8,8a6,6,0,0,0,0,8.51A6,6,0,0,0,7,28a6.07,6.07,0,0,0,4.28-1.76L9.86,24.82A4,4,0,0,1,4.19,24.82Z"},"children":[]}]}]}]},{"type":"element","tagName":"div","properties":{},"children":[{"type":"element","tagName":"grid-example","properties":{"title":"Area Chart Overrides","name":"area-overrides","type":"generated","options":"{ \"exampleHeight\": 660, \"enterprise\": true,  \"modules\": [\"clientside\", \"menu\", \"charts\"] }"},"children":[]}]},{"type":"element","tagName":"h3","properties":{"id":"example-scatterbubble-chart-overrides","style":"position:relative;"},"children":[{"type":"text","value":"Example: Scatter/Bubble Chart Overrides"},{"type":"element","tagName":"a","properties":{"href":"#example-scatterbubble-chart-overrides","ariaLabel":"example scatterbubble chart overrides permalink","className":["docs-header-icon","after"]},"children":[{"type":"element","tagName":"svg","properties":{"id":"icon","xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 32 32"},"children":[{"type":"element","tagName":"path","properties":{"d":"M29.25,6.76a6,6,0,0,0-8.5,0l1.42,1.42a4,4,0,1,1,5.67,5.67l-8,8a4,4,0,1,1-5.67-5.66l1.41-1.42-1.41-1.42-1.42,1.42a6,6,0,0,0,0,8.5A6,6,0,0,0,17,25a6,6,0,0,0,4.27-1.76l8-8A6,6,0,0,0,29.25,6.76Z"},"children":[]},{"type":"element","tagName":"path","properties":{"d":"M4.19,24.82a4,4,0,0,1,0-5.67l8-8a4,4,0,0,1,5.67,0A3.94,3.94,0,0,1,19,14a4,4,0,0,1-1.17,2.85L15.71,19l1.42,1.42,2.12-2.12a6,6,0,0,0-8.51-8.51l-8,8a6,6,0,0,0,0,8.51A6,6,0,0,0,7,28a6.07,6.07,0,0,0,4.28-1.76L9.86,24.82A4,4,0,0,1,4.19,24.82Z"},"children":[]}]}]}]},{"type":"element","tagName":"div","properties":{},"children":[{"type":"element","tagName":"grid-example","properties":{"title":"Scatter/Bubble Chart Overrides","name":"scatter-overrides","type":"generated","options":"{ \"exampleHeight\": 660, \"enterprise\": true,  \"modules\": [\"clientside\", \"menu\", \"charts\"] }"},"children":[]}]},{"type":"element","tagName":"h3","properties":{"id":"example-piedoughnut-chart-overrides","style":"position:relative;"},"children":[{"type":"text","value":"Example: Pie/Doughnut Chart Overrides"},{"type":"element","tagName":"a","properties":{"href":"#example-piedoughnut-chart-overrides","ariaLabel":"example piedoughnut chart overrides permalink","className":["docs-header-icon","after"]},"children":[{"type":"element","tagName":"svg","properties":{"id":"icon","xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 32 32"},"children":[{"type":"element","tagName":"path","properties":{"d":"M29.25,6.76a6,6,0,0,0-8.5,0l1.42,1.42a4,4,0,1,1,5.67,5.67l-8,8a4,4,0,1,1-5.67-5.66l1.41-1.42-1.41-1.42-1.42,1.42a6,6,0,0,0,0,8.5A6,6,0,0,0,17,25a6,6,0,0,0,4.27-1.76l8-8A6,6,0,0,0,29.25,6.76Z"},"children":[]},{"type":"element","tagName":"path","properties":{"d":"M4.19,24.82a4,4,0,0,1,0-5.67l8-8a4,4,0,0,1,5.67,0A3.94,3.94,0,0,1,19,14a4,4,0,0,1-1.17,2.85L15.71,19l1.42,1.42,2.12-2.12a6,6,0,0,0-8.51-8.51l-8,8a6,6,0,0,0,0,8.51A6,6,0,0,0,7,28a6.07,6.07,0,0,0,4.28-1.76L9.86,24.82A4,4,0,0,1,4.19,24.82Z"},"children":[]}]}]}]},{"type":"element","tagName":"div","properties":{},"children":[{"type":"element","tagName":"grid-example","properties":{"title":"Pie/Doughnut Chart Overrides","name":"pie-overrides","type":"generated","options":"{ \"exampleHeight\": 660, \"enterprise\": true,  \"modules\": [\"clientside\", \"menu\", \"charts\"] }"},"children":[]}]},{"type":"element","tagName":"h3","properties":{"id":"example-histogram-chart-overrides","style":"position:relative;"},"children":[{"type":"text","value":"Example: Histogram Chart Overrides"},{"type":"element","tagName":"a","properties":{"href":"#example-histogram-chart-overrides","ariaLabel":"example histogram chart overrides permalink","className":["docs-header-icon","after"]},"children":[{"type":"element","tagName":"svg","properties":{"id":"icon","xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 32 32"},"children":[{"type":"element","tagName":"path","properties":{"d":"M29.25,6.76a6,6,0,0,0-8.5,0l1.42,1.42a4,4,0,1,1,5.67,5.67l-8,8a4,4,0,1,1-5.67-5.66l1.41-1.42-1.41-1.42-1.42,1.42a6,6,0,0,0,0,8.5A6,6,0,0,0,17,25a6,6,0,0,0,4.27-1.76l8-8A6,6,0,0,0,29.25,6.76Z"},"children":[]},{"type":"element","tagName":"path","properties":{"d":"M4.19,24.82a4,4,0,0,1,0-5.67l8-8a4,4,0,0,1,5.67,0A3.94,3.94,0,0,1,19,14a4,4,0,0,1-1.17,2.85L15.71,19l1.42,1.42,2.12-2.12a6,6,0,0,0-8.51-8.51l-8,8a6,6,0,0,0,0,8.51A6,6,0,0,0,7,28a6.07,6.07,0,0,0,4.28-1.76L9.86,24.82A4,4,0,0,1,4.19,24.82Z"},"children":[]}]}]}]},{"type":"element","tagName":"div","properties":{},"children":[{"type":"element","tagName":"grid-example","properties":{"title":"Histogram Chart Overrides","name":"histogram-overrides","type":"generated","options":"{ \"exampleHeight\": 660, \"enterprise\": true,  \"modules\": [\"clientside\", \"menu\", \"charts\"] }"},"children":[]}]},{"type":"element","tagName":"h2","properties":{"id":"next-up","style":"position:relative;"},"children":[{"type":"text","value":"Next Up"},{"type":"element","tagName":"a","properties":{"href":"#next-up","ariaLabel":"next up permalink","className":["docs-header-icon","after"]},"children":[{"type":"element","tagName":"svg","properties":{"id":"icon","xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 32 32"},"children":[{"type":"element","tagName":"path","properties":{"d":"M29.25,6.76a6,6,0,0,0-8.5,0l1.42,1.42a4,4,0,1,1,5.67,5.67l-8,8a4,4,0,1,1-5.67-5.66l1.41-1.42-1.41-1.42-1.42,1.42a6,6,0,0,0,0,8.5A6,6,0,0,0,17,25a6,6,0,0,0,4.27-1.76l8-8A6,6,0,0,0,29.25,6.76Z"},"children":[]},{"type":"element","tagName":"path","properties":{"d":"M4.19,24.82a4,4,0,0,1,0-5.67l8-8a4,4,0,0,1,5.67,0A3.94,3.94,0,0,1,19,14a4,4,0,0,1-1.17,2.85L15.71,19l1.42,1.42,2.12-2.12a6,6,0,0,0-8.51-8.51l-8,8a6,6,0,0,0,0,8.51A6,6,0,0,0,7,28a6.07,6.07,0,0,0,4.28-1.76L9.86,24.82A4,4,0,0,1,4.19,24.82Z"},"children":[]}]}]}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Continue to the next section to learn about: "},{"type":"element","tagName":"a","properties":{"href":"/archive/29.3.3/integrated-charts-events/"},"children":[{"type":"text","value":"Chart Events"}]},{"type":"text","value":"."}]}]},"frontmatter":{"title":"Chart Customisation","version":null,"enterprise":true,"sideMenu":null,"description":null},"headings":[{"id":"provided-themes","depth":2,"value":"Provided Themes"},{"id":"custom-chart-themes","depth":2,"value":"Custom Chart Themes"},{"id":"overriding-existing-themes","depth":2,"value":"Overriding Existing Themes"},{"id":"example-common-chart-overrides","depth":3,"value":"Example: Common Chart Overrides"},{"id":"example-cartesian-chart-overrides","depth":3,"value":"Example: Cartesian Chart Overrides"},{"id":"example-line-chart-overrides","depth":3,"value":"Example: Line Chart Overrides"},{"id":"example-barcolumn-chart-overrides","depth":3,"value":"Example: Bar/Column Chart Overrides"},{"id":"example-area-chart-overrides","depth":3,"value":"Example: Area Chart Overrides"},{"id":"example-scatterbubble-chart-overrides","depth":3,"value":"Example: Scatter/Bubble Chart Overrides"},{"id":"example-piedoughnut-chart-overrides","depth":3,"value":"Example: Pie/Doughnut Chart Overrides"},{"id":"example-histogram-chart-overrides","depth":3,"value":"Example: Histogram Chart Overrides"},{"id":"next-up","depth":2,"value":"Next Up"}]}},"pageContext":{"frameworks":["javascript","react","angular","vue"],"framework":"react","srcPath":"/integrated-charts-customisation","pageName":"integrated-charts-customisation"}},
    "staticQueryHashes": ["1766026005","699667431","940729948"]}