Treemap colorScale range begins with 0.85 transparency

[AntoineArt]

Description

Hi, I can't find a way to get the main tile's color to be exactly the color I set, as it seems to be set by default with an opacity of 0.85.

For context I am using React.

Steps to Reproduce

1. Use this chart :

   
   'use client';

import ApexChart from '@/modules/utils/apexcharts'; import { Props } from 'react-apexcharts'; import React from 'react';

const defaultOptions: Props['options'] = { legend: { show: false, }, chart: { type: 'treemap', toolbar: { show: false, }, }, grid: { padding: { top: -10, }, }, };

export const SalesTreemap = (props: any) => { const max = Math.max( ...props.series[0].data.map((item: any) => { return item.y; }) ); const min = Math.min( ...props.series[0].data.map((item: any) => { return item.y; }) ); const options = { ...defaultOptions, title: { text: props.title, align: 'left', style: { fontSize: '12px', }, }, plotOptions: { treemap: { enableShades: true, shadeIntensity: 0.5, reverseNegativeShade: true, distributed: false, useFillColorAsStroke: false, dataLabels: { format: 'scale', }, colorScale: { ranges: [ { from: min, to: max, color: '#006fee', }, ], inverse: false, }, }, }, };

return ( typeof window !== 'undefined' && ( <ApexChart options={options} series={props.series} type='treemap' height='100%' /> ) ); };

2. Run it with a series like : 
``` js
const series = [
    {
        "data": [
            {
                "x": "Vendeurs",
                "y": 18
            },
            {
                "x": "Service location",
                "y": 2
            },
            {
                "x": "Atelier",
                "y": 4
            },
            {
                "x": "Magasin pièces",
                "y": 4
            },
            {
                "x": "Secrétariat commercial",
                "y": 2
            }
        ]
    }
]

4. Open your developer tools in your browser
5. Select the main tile
6. look at the fill element like here :

Expected Behavior

The color range should begin at 100% opacity, not 85%. When I set a parameter, I expect it to be used exactly as is, not modified, because here it creates a mismatch between the treemap's main color and my other charts'colors.

[brianlagunas]

Please provide a link to a reproduction application. If not, this issue will be closed.

[junedchhipa]

Fixed the original issue. For a quick fix, you can set the opacity in fill options

options = {
  fill: {
     opacity: 1,
   }
}