# Simple gauge corner radius

**URL:** <https://forum.inductiveautomation.com/t/simple-gauge-corner-radius/51142>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [September 20, 2021, 1:35pm UTC](https://forum.inductiveautomation.com/t/simple-gauge-corner-radius/51142 "2021-09-20T13:35:20Z")\
**Posts on this page:** 6\
**Page:** 2

<div class="post-metadata">

**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\
**Post date:** [February 13, 2023, 1:55pm UTC](https://forum.inductiveautomation.com/t/simple-gauge-corner-radius/51142/21 "2023-02-13T13:55:29Z")

</div>

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/b/2/b286ecc7aad0658001fdb54ddea010ab70842bd8.png)

do you not see the style when you select the g element?

copy the selector and change the first bits (before the svg) to match your class style  
than add` {display:none}` after it  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/0/7/07c2d866ee3939a6f405755fa0aa1ed2c9ca02b0.png)

---

<div class="post-metadata">

**Author:** ![zacharyw.larson](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/zacharyw.larson/32/23749_2.png) [@zacharyw.larson](https://forum.inductiveautomation.com/u/zacharyw.larson)\
**Post date:** [February 13, 2023, 2:47pm UTC](https://forum.inductiveautomation.com/t/simple-gauge-corner-radius/51142/22 "2023-02-13T14:47:49Z")

</div>

Do I need to add }{ to the ends of the style?  
Or just as you had posted it?

Sometimes the style is applying and sometimes it is not.  
I change nothing, and it just appears or not willy nilly.  
I can copy the json, and sometimes the style is there, and sometimes it is not when I paste it to a text editor.  
Ignition 8.1.19  
Pictures below are from the designer.  
Below is the json, image of the black bar still showing.  
Image of the code in the background for the style.

```auto

[
  {
    "type": "ia.chart.simple-gauge",
    "version": 0,
    "props": {
      "value": 20,
      "maxValue": 200,
      "arcBackground": {
        "opacity": 0
      },
      "style": {
        "classes": "perspectiveComponentModifiers/SimpleGaugeRemoveBlackLine"
      }
    },
    "meta": {
      "name": "SimpleGauge"
    },
    "position": {
      "shrink": 0,
      "basis": "175px"
    },
    "custom": {}
  }
]

```

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/f/3/f350874c140d9b5cd44b133af1de83783dac1467.png)

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/f/5/f514ff77908dd2dae224796629cea8f2972e2cb0.png)

All four have the same style selected. The black bar appears in all of them. It is harder to see on the right side.

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/0/3/0326593ac9b7fb2de68f098225acbfc3a861b3ea.png)

---

<div class="post-metadata">

**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\
**Post date:** [February 13, 2023, 3:29pm UTC](https://forum.inductiveautomation.com/t/simple-gauge-corner-radius/51142/23 "2023-02-13T15:29:21Z")

</div>

> [@zacharyw.larson](#):
>
> Do I need to add }{ to the ends of the style?

it depends if you are injecting, or using the stylesheet.css

it looks like you are injecting, in which case you need }{

when injecting with a styleclass that is in a folder than you need to change the name  
folders require `\/` for `/`

```auto
.psc-FolderName\/SubFolderName\/...\/StyleName

```

so

```auto
} .psc-perspectiveComponentModifiers\/SimpleGaugeRemoveBlackLine svg > g > g:nth-child(2) > g:nth-child(1) > g > g > g > g > g > g:nth-child(1) > g > g:nth-child(1) > g:nth-child(2) > g:nth-child(1) > g > g:nth-child(3) > g > g:nth-child(1) > g > g:nth-child(1) > g > g:nth-child(4){display:none;} .psc-perspectiveComponentModifiers\/SimpleGaugeRemoveBlackLine svg > g > g:nth-child(2) > g:nth-child(1) > g > g > g > g > g > g:nth-child(1) > g > g:nth-child(1) > g:nth-child(2) > g:nth-child(1) > g > g:nth-child(3) > g > g:nth-child(1) > g > g:nth-child(1) > g > g:nth-child(2){display:none;}{

```

---

<div class="post-metadata">

**Author:** ![zacharyw.larson](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/zacharyw.larson/32/23749_2.png) [@zacharyw.larson](https://forum.inductiveautomation.com/u/zacharyw.larson)\
**Post date:** [February 13, 2023, 3:45pm UTC](https://forum.inductiveautomation.com/t/simple-gauge-corner-radius/51142/24 "2023-02-13T15:45:08Z")

</div>

Thanks

What is the stylesheet.css technique?

---

<div class="post-metadata">

**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\
**Post date:** [February 13, 2023, 3:57pm UTC](https://forum.inductiveautomation.com/t/simple-gauge-corner-radius/51142/25 "2023-02-13T15:57:19Z")

</div>

in the newer version you have stylesheet.css file

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/f/b/fb40d332d756a7b96aaa24b302fe9e8530e39204.png)  
there you do not need }{ as its plain css.

you will not see SimpleGaugeRemoveBlackLine in your classes dropdown this way, but you can still just type it in there

---

<div class="post-metadata">

**Author:** ![chaoliang](https://avatars.discourse-cdn.com/v4/letter/c/ba8739/32.png) [@chaoliang](https://forum.inductiveautomation.com/u/chaoliang)\
**Post date:** [July 5, 2023, 11:25am UTC](https://forum.inductiveautomation.com/t/simple-gauge-corner-radius/51142/26 "2023-07-05T11:25:37Z")

</div>

Nice post about the gauge curve corner.

[Previous page](https://forum.inductiveautomation.com/t/simple-gauge-corner-radius/51142.md?page=1)