# Power chart pen control **URL:** \ **Category:** Ignition\ **Tags:** ignition81, perspective\ **Created:** [June 19, 2022, 3:40pm UTC](https://forum.inductiveautomation.com/t/power-chart-pen-control/60932 "2022-06-19T15:40:26Z")\ **Posts on this page:** 10\ **Page:** 1
**Author:** ![NII](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nii/32/12920_2.png) [@NII](https://forum.inductiveautomation.com/u/NII)\ **Post date:** [June 19, 2022, 3:40pm UTC](https://forum.inductiveautomation.com/t/power-chart-pen-control/60932/1 "2022-06-19T15:40:26Z")
Is there a way to prevent pen control from expanding? ---
**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\ **Post date:** [June 19, 2022, 4:01pm UTC](https://forum.inductiveautomation.com/t/power-chart-pen-control/60932/2 "2022-06-19T16:01:34Z")
`PROPS.config.visibility.showPenControlDisplay : false` ---
**Author:** ![NII](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nii/32/12920_2.png) [@NII](https://forum.inductiveautomation.com/u/NII)\ **Post date:** [June 19, 2022, 4:45pm UTC](https://forum.inductiveautomation.com/t/power-chart-pen-control/60932/3 "2022-06-19T16:45:38Z")
This hides the pen control. I want to prevent it from expanding when user click the icon. ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/3/b/3bc2dd76dcdf823f35bc7986fa90deccc1c3d47f.png) ---
**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\ **Post date:** [June 19, 2022, 7:05pm UTC](https://forum.inductiveautomation.com/t/power-chart-pen-control/60932/4 "2022-06-19T19:05:06Z")
Hide the icon instead. - Create a new style. I called mine _hidePowerChartPensExpandButton_. You might like something more brief. - In the base style expand _Background_ and add the following code into _Background image_. ```auto } .ia_powerChartComponent __penDataDisplay__ table__icon.expand-icon {display: none !important;} { ``` - _OK_ that. - On the _Power Chart_ component Property Editor hit the `PROPS.style.classes` dropdown and select the new style you created. That should do the trick. * * * This is CSS injection. You find the classes you need by examining the web page in question with the browser’s developer tools. (Usually hit F12 to show the developer tools.) ---
**Author:** ![NII](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nii/32/12920_2.png) [@NII](https://forum.inductiveautomation.com/u/NII)\ **Post date:** [June 19, 2022, 10:26pm UTC](https://forum.inductiveautomation.com/t/power-chart-pen-control/60932/5 "2022-06-19T22:26:51Z")
This would be applied to all instants of power chart. Is it possible to apply only to one particular instance? ---
**Author:** ![lrose](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/lrose/32/62724_2.png) [@lrose](https://forum.inductiveautomation.com/u/lrose)\ **Post date:** [June 20, 2022, 11:58am UTC](https://forum.inductiveautomation.com/t/power-chart-pen-control/60932/6 "2022-06-20T11:58:04Z")
It is possible, though I don’t know the correct selector syntax off the top of my head. You have to do something where your selector calls out your specific style class, such that only power charts with that style class are affected. something like: ```auto } .psc-hidePowerChartPensExpandButton .ia_powerChartComponent ...{ ``` @victordcq ---
**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\ **Post date:** [June 20, 2022, 12:26pm UTC](https://forum.inductiveautomation.com/t/power-chart-pen-control/60932/7 "2022-06-20T12:26:11Z")
Yup seems right ```auto }.psc-YourClassName .ia_powerChartComponent __penDataDisplay__ table__icon.expand-icon { display: none; }{ ``` ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/a/a/aaa449c29639dc2b4cefc3044ee819ed5fdd0590.png) ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/1/5/1586470b39bb5ad23ce14e0262c9c93bd467a944.png) ---
**Author:** ![NII](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nii/32/12920_2.png) [@NII](https://forum.inductiveautomation.com/u/NII)\ **Post date:** [June 20, 2022, 5:03pm UTC](https://forum.inductiveautomation.com/t/power-chart-pen-control/60932/8 "2022-06-20T17:03:01Z")
Thank you for all, works great. ---
**Author:** ![richardNZ15](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/richardnz15/32/33373_2.png) [@richardNZ15](https://forum.inductiveautomation.com/u/richardNZ15)\ **Post date:** [May 24, 2023, 12:35am UTC](https://forum.inductiveautomation.com/t/power-chart-pen-control/60932/9 "2023-05-24T00:35:20Z")
Is there a way to ensure that the Pen Control defaults to COMPACT instead of EXPANDED? I have it set to COMPACT in designer for the view, but when opening on Workstation or Perpsective session, it is expanded and it is confusing users.. ---
**Author:** ![Kevin\_Miller](https://avatars.discourse-cdn.com/v4/letter/k/22d042/32.png) [@Kevin\_Miller](https://forum.inductiveautomation.com/u/Kevin_Miller)\ **Post date:** [August 3, 2023, 4:35pm UTC](https://forum.inductiveautomation.com/t/power-chart-pen-control/60932/10 "2023-08-03T16:35:49Z")
Setting the props.legend.visible flag to true will ensure that Pen Control will default to the compact version. It's towards the bottom of the Props property tree, below timeAxis.