Change Card Display Width Not Trend Width

[jesawyers]

I have successfully created a apex chart within home assistant using the following code...

type: custom:apexcharts-card
graph_span: 2h
header:
  show: true
  title: Sensor Trend
  show_states: false
  colorize_states: true
apex_config:
  chart:
    width: 100%
  yaxis:
    opposite: true
series:
  - entity: sensor.thp_3c722f_tavg
    stroke_width: 1
  - entity: sensor.rtd_s2_ch1_eu
    stroke_width: 1

When I change the chart width within apex_config it changes trend width.

How do I change the width of the CARD not the Trend?

I have been looking for many days and hours and can find nothing.

Thanks for any help...
John

[jesawyers]

So when I use the following the card height it changes as I was expecting...

apex_config:
  chart:
    height: 400
    width: '100%'

I've tried everything with width but the card never gets wider.

[suurt8ll]

Adjusting the lovelace card's width itself works for me:

grid_options:
  columns: 24

So in your case this should work:

type: custom:apexcharts-card
graph_span: 2h
header:
  show: true
  title: Sensor Trend
  show_states: false
  colorize_states: true
apex_config:
  chart:
    height: 400
  yaxis:
    opposite: true
series:
  - entity: sensor.thp_3c722f_tavg
    stroke_width: 1
  - entity: sensor.rtd_s2_ch1_eu
    stroke_width: 1
grid_options:
  columns: 24

[ShelbyJenkins]

@suurt8ll does not work for me.

Given the feature request exists, #842, I'm tending to think it's a limitation.

Shame, because there is not much point to a tiny chart.

[ShelbyJenkins]

@suurt8ll, I posted a solution here: #736 (comment)

[suurt8ll]

Awesome! Yeah, I forgot to include in my previous response that my personal card was also wrapped inside another higher level card: type: custom:config-template-card card, GitHub. So I can also confirm that wrapping ApexChartsJS inside another card does the trick.