search

apexcharts / apexcharts.js

📊 Interactive JavaScript Charts built on SVG
https://apexcharts.com
MIT License
14.41k stars 1.31k forks source link

Rem size unit for the legend and title font-size doesn't work (React) #3341

Open Reytar opened 2 years ago

Reytar commented 2 years ago

Description

When using rem size unit for the legend and title, the font-size returns to default/not visible

Steps to Reproduce

  1. Using react-apexcharts
  2. Create area chart with 2 series
  3. Add title and style the font-size to 2 rem
  4. Add legend and style the font-size to 1 rem

Expected Behavior

Expected to see the font-size grow and shrink based on the rem value (root size)

Actual Behavior

The font size returns to default or shrink/behave weird **Note that the rem units works when using it on the labels style.**

Screenshots

Reproduction Link

https://codesandbox.io/embed/react-basic-example-forked-79ymuf?fontsize=14&hidenavigation=1&theme=dark

bababash commented 1 year ago

Not working for me either with v3.37.1 using ApexCharts JS

teckel12 commented 7 months ago

I can confirm this also doesn't work on other frameworks (or no framework) not just React. It does, however, work if you specify an exact font size, for example '16'. Also note, every other fontSize (that I've encountered) in ApexCharts works with em/rem values, so this is unique to legend.fontSize.

jniclas commented 5 months ago

Faced the issue too now with Vue 🤔