diff --git a/dashboard.go b/dashboard.go
index b575bce506..795309aac8 100644
--- a/dashboard.go
+++ b/dashboard.go
@@ -785,7 +785,9 @@ type GaugeViewProperties struct {
 	Type              string           `json:"type"`
 	Queries           []DashboardQuery `json:"queries"`
 	Prefix            string           `json:"prefix"`
+	TickPrefix        string           `json:"tickPrefix"`
 	Suffix            string           `json:"suffix"`
+	TickSuffix        string           `json:"tickSuffix"`
 	ViewColors        []ViewColor      `json:"colors"`
 	DecimalPlaces     DecimalPlaces    `json:"decimalPlaces"`
 	Note              string           `json:"note"`
diff --git a/http/swagger.yml b/http/swagger.yml
index 3e3c508102..326181516a 100644
--- a/http/swagger.yml
+++ b/http/swagger.yml
@@ -8590,17 +8590,7 @@ components:
           type: integer
     GaugeViewProperties:
       type: object
-      required:
-        - type
-        - queries
-        - colors
-        - shape
-        - note
-        - showNoteWhenEmpty
-        - prefix
-        - suffix
-        - legend
-        - decimalPlaces
+      required: [type, queries, colors, shape, note, showNoteWhenEmpty, prefix, tickPrefix, suffix, tickSuffix, legend, decimalPlaces]
       properties:
         type:
           type: string
@@ -8624,8 +8614,12 @@ components:
           type: boolean
         prefix:
           type: string
+        tickPrefix:
+          type: string
         suffix:
           type: string
+        tickSuffix:
+          type: string
         legend:
           $ref: '#/components/schemas/Legend'
         decimalPlaces:
diff --git a/pkger/clone_resource.go b/pkger/clone_resource.go
index 37bbc37cd2..aa3373a936 100644
--- a/pkger/clone_resource.go
+++ b/pkger/clone_resource.go
@@ -208,6 +208,8 @@ func convertCellView(cell influxdb.Cell) chart {
 	case influxdb.GaugeViewProperties:
 		setCommon(chartKindGauge, p.ViewColors, p.DecimalPlaces, p.Queries)
 		setNoteFixes(p.Note, p.ShowNoteWhenEmpty, p.Prefix, p.Suffix)
+		ch.TickPrefix = p.TickPrefix
+		ch.TickSuffix = p.TickSuffix
 	case influxdb.HeatmapViewProperties:
 		ch.Kind = chartKindHeatMap
 		ch.Queries = convertQueries(p.Queries)
diff --git a/pkger/models.go b/pkger/models.go
index 3abd9b19bd..cf4b1c0e85 100644
--- a/pkger/models.go
+++ b/pkger/models.go
@@ -2169,7 +2169,9 @@ type chart struct {
 	Kind            chartKind
 	Name            string
 	Prefix          string
+	TickPrefix      string
 	Suffix          string
+	TickSuffix      string
 	Note            string
 	NoteOnEmpty     bool
 	DecimalPlaces   int
@@ -2196,7 +2198,9 @@ func (c chart) properties() influxdb.ViewProperties {
 			Type:       influxdb.ViewPropertyTypeGauge,
 			Queries:    c.Queries.influxDashQueries(),
 			Prefix:     c.Prefix,
+			TickPrefix: c.TickPrefix,
 			Suffix:     c.Suffix,
+			TickSuffix: c.TickSuffix,
 			ViewColors: c.Colors.influxViewColors(),
 			DecimalPlaces: influxdb.DecimalPlaces{
 				IsEnforced: c.EnforceDecimals,
diff --git a/ui/src/shared/components/Gauge.tsx b/ui/src/shared/components/Gauge.tsx
index b6426351e9..2da15149b3 100644
--- a/ui/src/shared/components/Gauge.tsx
+++ b/ui/src/shared/components/Gauge.tsx
@@ -28,7 +28,9 @@ interface Props {
   gaugePosition: number
   colors?: Color[]
   prefix: string
+  tickPrefix: string
   suffix: string
+  tickSuffix: string
   decimalPlaces: DecimalPlaces
 }
 
@@ -279,7 +281,8 @@ class Gauge extends Component<Props> {
     minValue,
     maxValue
   ) => {
-    const {prefix, suffix, decimalPlaces} = this.props
+    const {tickPrefix, tickSuffix, decimalPlaces} = this.props
+    let {prefix, suffix} = this.props 
     const {degree, lineCount, labelColor, labelFontSize} = GAUGE_SPECS
 
     const tickValues = [
@@ -287,6 +290,14 @@ class Gauge extends Component<Props> {
       maxValue,
     ]
 
+    if(tickPrefix === "true"){
+      prefix = "";
+    }
+    
+    if(tickSuffix === "true"){
+      suffix = "";
+    }
+
     const labels = tickValues.map(tick =>
       formatStatValue(tick, {decimalPlaces, prefix, suffix})
     )
@@ -340,7 +351,7 @@ class Gauge extends Component<Props> {
     const textContent = formatStatValue(gaugePosition, {
       decimalPlaces,
       prefix,
-      suffix,
+      suffix
     })
 
     ctx.fillText(textContent, 0, textY)
diff --git a/ui/src/shared/components/GaugeChart.tsx b/ui/src/shared/components/GaugeChart.tsx
index 707bf84490..8ae62963ed 100644
--- a/ui/src/shared/components/GaugeChart.tsx
+++ b/ui/src/shared/components/GaugeChart.tsx
@@ -20,7 +20,14 @@ interface Props {
 class GaugeChart extends PureComponent<Props> {
   public render() {
     const {value} = this.props
-    const {colors, prefix, suffix, decimalPlaces} = this.props.properties
+    const {
+      colors,
+      prefix,
+      tickPrefix,
+      suffix,
+      tickSuffix,
+      decimalPlaces,
+    } = this.props.properties
 
     return (
       <AutoSizer>
@@ -31,7 +38,9 @@ class GaugeChart extends PureComponent<Props> {
               height={height}
               colors={colors}
               prefix={prefix}
+              tickPrefix={tickPrefix}
               suffix={suffix}
+              tickSuffix={tickSuffix}
               gaugePosition={value}
               decimalPlaces={decimalPlaces}
             />
diff --git a/ui/src/shared/utils/formatStatValue.ts b/ui/src/shared/utils/formatStatValue.ts
index 399fd98a5c..a14b9111a5 100644
--- a/ui/src/shared/utils/formatStatValue.ts
+++ b/ui/src/shared/utils/formatStatValue.ts
@@ -20,7 +20,7 @@ export const formatStatValue = (
   value: number | string = 0,
   {decimalPlaces, prefix, suffix}: FormatStatValueOptions = {}
 ): string => {
-  let localeFormattedValue
+  let localeFormattedValue = ''
 
   if (isNumber(value)) {
     let digits: number
diff --git a/ui/src/shared/utils/view.ts b/ui/src/shared/utils/view.ts
index ee40a1c1b9..2d8218b4a9 100644
--- a/ui/src/shared/utils/view.ts
+++ b/ui/src/shared/utils/view.ts
@@ -89,7 +89,9 @@ function defaultGaugeViewProperties() {
     queries: [defaultViewQuery()],
     colors: DEFAULT_GAUGE_COLORS as Color[],
     prefix: '',
+    tickPrefix:'',
     suffix: '',
+    tickSuffix:'',
     note: '',
     showNoteWhenEmpty: false,
     decimalPlaces: {
diff --git a/ui/src/timeMachine/actions/index.ts b/ui/src/timeMachine/actions/index.ts
index d29676d5da..f3f648b335 100644
--- a/ui/src/timeMachine/actions/index.ts
+++ b/ui/src/timeMachine/actions/index.ts
@@ -67,7 +67,9 @@ export type Action =
   | SetYAxisBase
   | SetYAxisScale
   | SetPrefix
+  | SetTickPrefix
   | SetSuffix
+  | SetTickSuffix
   | SetActiveQueryIndexAction
   | AddQueryAction
   | RemoveQueryAction
@@ -299,6 +301,16 @@ export const setPrefix = (prefix: string): SetPrefix => ({
   payload: {prefix},
 })
 
+interface SetTickPrefix {
+  type: 'SET_TICK_PREFIX'
+  payload: {tickPrefix: string}
+}
+
+export const setTickPrefix = (tickPrefix: string): SetTickPrefix => ({
+  type: 'SET_TICK_PREFIX',
+  payload: {tickPrefix},
+})
+
 interface SetSuffix {
   type: 'SET_SUFFIX'
   payload: {suffix: string}
@@ -309,6 +321,17 @@ export const setSuffix = (suffix: string): SetSuffix => ({
   payload: {suffix},
 })
 
+interface SetTickSuffix {
+  type: 'SET_TICK_SUFFIX'
+  payload: {tickSuffix: string}
+}
+
+export const setTickSuffix = (tickSuffix: string): SetTickSuffix => ({
+  type: 'SET_TICK_SUFFIX',
+  payload: {tickSuffix},
+})
+
+
 interface SetStaticLegend {
   type: 'SET_STATIC_LEGEND'
   payload: {staticLegend: boolean}
diff --git a/ui/src/timeMachine/components/view_options/Affixes.tsx b/ui/src/timeMachine/components/view_options/Affixes.tsx
index 6be2752d76..ef62528a60 100644
--- a/ui/src/timeMachine/components/view_options/Affixes.tsx
+++ b/ui/src/timeMachine/components/view_options/Affixes.tsx
@@ -2,21 +2,36 @@
 import React, {PureComponent, ChangeEvent} from 'react'
 
 // Components
-import {Form, Input, Grid} from '@influxdata/clockface'
+import {
+  Form,
+  Input,
+  Grid,
+  Toggle,
+  InputToggleType,
+  InputLabel,
+  FlexBox,
+  AlignItems,
+  ComponentSize,
+  JustifyContent
+} from '@influxdata/clockface'
 
 // Types
 import {Columns} from '@influxdata/clockface'
 
 interface Props {
   prefix: string
+  tickPrefix: string
   suffix: string
+  tickSuffix: string
   onUpdatePrefix: (prefix: string) => void
+  onUpdateTickPrefix: (tickPrefix: string) => void
   onUpdateSuffix: (suffix: string) => void
+  onUpdateTickSuffix: (tickSuffix: string) => void
 }
 
 class Affixes extends PureComponent<Props> {
   public render() {
-    const {prefix, suffix} = this.props
+    const {prefix, tickPrefix, suffix, tickSuffix} = this.props
 
     return (
       <>
@@ -38,6 +53,30 @@ class Affixes extends PureComponent<Props> {
             />
           </Form.Element>
         </Grid.Column>
+        <Grid.Column widthXS={Columns.Six}>
+          <FlexBox alignItems={AlignItems.Center} margin={ComponentSize.Small} justifyContent={JustifyContent.SpaceAround}>
+            <Toggle
+              id='prefixoptional'
+              type={InputToggleType.Checkbox}
+              value={tickPrefix}
+              onChange={this.handleUpdateTickPrefix}
+              size={ComponentSize.ExtraSmall}
+            />
+            <InputLabel active={!!tickPrefix}>Optional Prefix</InputLabel>
+          </FlexBox>
+        </Grid.Column>
+        <Grid.Column widthXS={Columns.Six}>
+          <FlexBox alignItems={AlignItems.Center} margin={ComponentSize.Small}>
+            <Toggle
+              id='suffixoptional'
+              type={InputToggleType.Checkbox}
+              value={tickSuffix}
+              onChange={this.handleUpdateTickSuffix}
+              size={ComponentSize.ExtraSmall}
+            />
+            <InputLabel active={!!tickSuffix}>Optional Suffix</InputLabel>
+          </FlexBox>
+        </Grid.Column>
       </>
     )
   }
@@ -53,6 +92,22 @@ class Affixes extends PureComponent<Props> {
     const suffix = e.target.value
     onUpdateSuffix(suffix)
   }
+  private handleUpdateTickSuffix = (e: string): void => {
+    const {onUpdateTickSuffix} = this.props
+    if (e === 'false' || !!!e) {
+      onUpdateTickSuffix('true')
+    } else {
+      onUpdateTickSuffix('false')
+    }
+  }
+  private handleUpdateTickPrefix = (e: string): void => {
+    const {onUpdateTickPrefix} = this.props
+    if (e === 'false' || !!!e) {
+      onUpdateTickPrefix('true')
+    } else {
+      onUpdateTickPrefix('false')
+    }
+  }
 }
 
 export default Affixes
diff --git a/ui/src/timeMachine/components/view_options/GaugeOptions.tsx b/ui/src/timeMachine/components/view_options/GaugeOptions.tsx
index e1717a1356..bed87ad783 100644
--- a/ui/src/timeMachine/components/view_options/GaugeOptions.tsx
+++ b/ui/src/timeMachine/components/view_options/GaugeOptions.tsx
@@ -12,7 +12,9 @@ import ThresholdsSettings from 'src/shared/components/ThresholdsSettings'
 import {
   setDecimalPlaces,
   setPrefix,
+  setTickPrefix,
   setSuffix,
+  setTickSuffix,
   setColors,
 } from 'src/timeMachine/actions'
 
@@ -26,12 +28,16 @@ interface OwnProps {
   colors: Color[]
   decimalPlaces?: DecimalPlaces
   prefix: string
+  tickPrefix: string
   suffix: string
+  tickSuffix: string
 }
 
 interface DispatchProps {
   onUpdatePrefix: (prefix: string) => void
+  onUpdateTickPrefix: (tickPrefix: string) => void
   onUpdateSuffix: (suffix: string) => void
+  onUpdateTickSuffix: (tickSuffix: string) => void
   onUpdateDecimalPlaces: (decimalPlaces: DecimalPlaces) => void
   onUpdateColors: (colors: Color[]) => void
 }
@@ -42,9 +48,13 @@ class GaugeOptions extends PureComponent<Props> {
   public render() {
     const {
       prefix,
+      tickPrefix,
       suffix,
+      tickSuffix,
       onUpdatePrefix,
+      onUpdateTickPrefix,
       onUpdateSuffix,
+      onUpdateTickSuffix,
       onUpdateColors,
     } = this.props
 
@@ -55,9 +65,13 @@ class GaugeOptions extends PureComponent<Props> {
         </Grid.Column>
         <Affixes
           prefix={prefix}
+          tickPrefix={tickPrefix}
           suffix={suffix}
+          tickSuffix={tickSuffix}
           onUpdatePrefix={onUpdatePrefix}
+          onUpdateTickPrefix={onUpdateTickPrefix}
           onUpdateSuffix={onUpdateSuffix}
+          onUpdateTickSuffix={onUpdateTickSuffix}
         />
         {this.decimalPlaces}
         <Grid.Column>
@@ -92,7 +106,9 @@ class GaugeOptions extends PureComponent<Props> {
 
 const mdtp: DispatchProps = {
   onUpdatePrefix: setPrefix,
+  onUpdateTickPrefix: setTickPrefix,
   onUpdateSuffix: setSuffix,
+  onUpdateTickSuffix: setTickSuffix,
   onUpdateDecimalPlaces: setDecimalPlaces,
   onUpdateColors: setColors,
 }
diff --git a/ui/src/timeMachine/reducers/index.ts b/ui/src/timeMachine/reducers/index.ts
index c4fbd37e9b..52910db01f 100644
--- a/ui/src/timeMachine/reducers/index.ts
+++ b/ui/src/timeMachine/reducers/index.ts
@@ -484,6 +484,22 @@ export const timeMachineReducer = (
       }
     }
 
+    case 'SET_TICK_PREFIX': {
+      const {tickPrefix} = action.payload
+
+      switch (state.view.properties.type) {
+        case 'gauge':
+        case 'single-stat':
+        case 'line-plus-single-stat':
+          return setViewProperties(state, {tickPrefix})
+        case 'check':
+        case 'xy':
+          return setYAxis(state, {tickPrefix})
+        default:
+          return state
+      }
+    }
+
     case 'SET_SUFFIX': {
       const {suffix} = action.payload
 
@@ -500,6 +516,22 @@ export const timeMachineReducer = (
       }
     }
 
+    case 'SET_TICK_SUFFIX': {
+      const {tickSuffix} = action.payload
+
+      switch (state.view.properties.type) {
+        case 'gauge':
+        case 'single-stat':
+        case 'line-plus-single-stat':
+          return setViewProperties(state, {tickSuffix})
+        case 'check':
+        case 'xy':
+          return setYAxis(state, {tickSuffix})
+        default:
+          return state
+      }
+    }
+
     case 'SET_COLORS': {
       const {colors} = action.payload