IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

started on options and groups

Browse Source
This commit is contained in:
Peter Holmberg 2018-11-14 17:00:26 +01:00
parent e4e41474b1
commit 063a1acf94
3 changed files with 239 additions and 232 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
public/app/core/components/Picker/UnitPicker.tsx
View File

@ -1,25 +1,22 @@
import React, { PureComponent } from 'react';
import Select from 'react-select';
import Select, { components } from 'react-select';
import ResetStyles from 'app/core/components/Picker/ResetStyles';
import DescriptionOption from './DescriptionOption';
import kbn from '../../utils/kbn';
interface Props {
width: number;
className?: string;
onSelected: (item: any) => {} | void;
placeholder?: string;
}
export class UnitPicker extends PureComponent<Props> {
formatGroupLabel = data => {
console.log('format', data);
const groupStyles = {
margin: '0 15px',
fontSize: '16px',
fontWeight: 700,
display: 'flex',
alignItems: 'center',
justifyContent: 'space-between',
};
} as React.CSSProperties;
const groupBadgeStyles = {
backgroundColor: '#EBECF0',
@ -37,29 +34,39 @@ export class UnitPicker extends PureComponent<Props> {
return (
<div style={groupStyles}>
<span>{data.label}</span>
<span style={groupBadgeStyles}>{data.submenu.length}</span>
<span style={groupBadgeStyles}>{data.options.length}</span>
</div>
);
};
render() {
const { className, onSelected, placeholder, width } = this.props;
renderOption = props => {
return (
<components.Option {...props}>
<div className="description-picker-option__button btn btn-link">
<div className="gf-form">{props.children}</div>
</div>
</components.Option>
);
};
renderGroup = props => {
return <components.Group {...props} />;
};
render() {
const options = kbn.getUnitFormats();
return (
<Select
classNamePrefix="gf-form-select-box"
className={`width-${width} gf-form-input gf-form-input--form-dropdown ${className || ''}`}
components={{
Option: DescriptionOption,
}}
getOptionLabel={i => i.text}
getOptionValue={i => i.value}
className="width-20 gf-form-input"
isSearchable={false}
onChange={onSelected}
options={options}
placeholder={placeholder || 'Choose'}
placeholder="Choose"
components={{
Option: this.renderOption,
Group: this.renderGroup,
}}
styles={ResetStyles}
formatGroupLabel={this.formatGroupLabel}
/>

424
public/app/core/utils/kbn.ts
View File

@ -905,284 +905,284 @@ kbn.valueFormats.dateTimeFromNow = (epoch, isUtc) => {
kbn.getUnitFormats = () => {
return [
{
text: 'none',
submenu: [
{ text: 'none', value: 'none' },
{ text: 'short', value: 'short' },
{ text: 'percent (0-100)', value: 'percent' },
{ text: 'percent (0.0-1.0)', value: 'percentunit' },
{ text: 'Humidity (%H)', value: 'humidity' },
{ text: 'decibel', value: 'dB' },
{ text: 'hexadecimal (0x)', value: 'hex0x' },
{ text: 'hexadecimal', value: 'hex' },
{ text: 'scientific notation', value: 'sci' },
{ text: 'locale format', value: 'locale' },
label: 'none',
options: [
{ label: 'none', value: 'none' },
{ label: 'short', value: 'short' },
{ label: 'percent (0-100)', value: 'percent' },
{ label: 'percent (0.0-1.0)', value: 'percentunit' },
{ label: 'Humidity (%H)', value: 'humidity' },
{ label: 'decibel', value: 'dB' },
{ label: 'hexadecimal (0x)', value: 'hex0x' },
{ label: 'hexadecimal', value: 'hex' },
{ label: 'scientific notation', value: 'sci' },
{ label: 'locale format', value: 'locale' },
],
},
{
text: 'currency',
submenu: [
{ text: 'Dollars ($)', value: 'currencyUSD' },
{ text: 'Pounds (£)', value: 'currencyGBP' },
{ text: 'Euro (€)', value: 'currencyEUR' },
{ text: 'Yen (¥)', value: 'currencyJPY' },
{ text: 'Rubles (₽)', value: 'currencyRUB' },
{ text: 'Hryvnias (₴)', value: 'currencyUAH' },
{ text: 'Real (R$)', value: 'currencyBRL' },
{ text: 'Danish Krone (kr)', value: 'currencyDKK' },
{ text: 'Icelandic Króna (kr)', value: 'currencyISK' },
{ text: 'Norwegian Krone (kr)', value: 'currencyNOK' },
{ text: 'Swedish Krona (kr)', value: 'currencySEK' },
{ text: 'Czech koruna (czk)', value: 'currencyCZK' },
{ text: 'Swiss franc (CHF)', value: 'currencyCHF' },
{ text: 'Polish Złoty (PLN)', value: 'currencyPLN' },
{ text: 'Bitcoin (฿)', value: 'currencyBTC' },
label: 'currency',
options: [
{ label: 'Dollars ($)', value: 'currencyUSD' },
{ label: 'Pounds (£)', value: 'currencyGBP' },
{ label: 'Euro (€)', value: 'currencyEUR' },
{ label: 'Yen (¥)', value: 'currencyJPY' },
{ label: 'Rubles (₽)', value: 'currencyRUB' },
{ label: 'Hryvnias (₴)', value: 'currencyUAH' },
{ label: 'Real (R$)', value: 'currencyBRL' },
{ label: 'Danish Krone (kr)', value: 'currencyDKK' },
{ label: 'Icelandic Króna (kr)', value: 'currencyISK' },
{ label: 'Norwegian Krone (kr)', value: 'currencyNOK' },
{ label: 'Swedish Krona (kr)', value: 'currencySEK' },
{ label: 'Czech koruna (czk)', value: 'currencyCZK' },
{ label: 'Swiss franc (CHF)', value: 'currencyCHF' },
{ label: 'Polish Złoty (PLN)', value: 'currencyPLN' },
{ label: 'Bitcoin (฿)', value: 'currencyBTC' },
],
},
{
text: 'time',
submenu: [
{ text: 'Hertz (1/s)', value: 'hertz' },
{ text: 'nanoseconds (ns)', value: 'ns' },
{ text: 'microseconds (µs)', value: 'µs' },
{ text: 'milliseconds (ms)', value: 'ms' },
{ text: 'seconds (s)', value: 's' },
{ text: 'minutes (m)', value: 'm' },
{ text: 'hours (h)', value: 'h' },
{ text: 'days (d)', value: 'd' },
{ text: 'duration (ms)', value: 'dtdurationms' },
{ text: 'duration (s)', value: 'dtdurations' },
{ text: 'duration (hh:mm:ss)', value: 'dthms' },
{ text: 'Timeticks (s/100)', value: 'timeticks' },
{ text: 'clock (ms)', value: 'clockms' },
{ text: 'clock (s)', value: 'clocks' },
label: 'time',
options: [
{ label: 'Hertz (1/s)', value: 'hertz' },
{ label: 'nanoseconds (ns)', value: 'ns' },
{ label: 'microseconds (µs)', value: 'µs' },
{ label: 'milliseconds (ms)', value: 'ms' },
{ label: 'seconds (s)', value: 's' },
{ label: 'minutes (m)', value: 'm' },
{ label: 'hours (h)', value: 'h' },
{ label: 'days (d)', value: 'd' },
{ label: 'duration (ms)', value: 'dtdurationms' },
{ label: 'duration (s)', value: 'dtdurations' },
{ label: 'duration (hh:mm:ss)', value: 'dthms' },
{ label: 'Timeticks (s/100)', value: 'timeticks' },
{ label: 'clock (ms)', value: 'clockms' },
{ label: 'clock (s)', value: 'clocks' },
],
},
{
text: 'date & time',
submenu: [
{ text: 'YYYY-MM-DD HH:mm:ss', value: 'dateTimeAsIso' },
{ text: 'DD/MM/YYYY h:mm:ss a', value: 'dateTimeAsUS' },
{ text: 'From Now', value: 'dateTimeFromNow' },
label: 'date & time',
options: [
{ label: 'YYYY-MM-DD HH:mm:ss', value: 'dateTimeAsIso' },
{ label: 'DD/MM/YYYY h:mm:ss a', value: 'dateTimeAsUS' },
{ label: 'From Now', value: 'dateTimeFromNow' },
],
},
{
text: 'data (IEC)',
submenu: [
{ text: 'bits', value: 'bits' },
{ text: 'bytes', value: 'bytes' },
{ text: 'kibibytes', value: 'kbytes' },
{ text: 'mebibytes', value: 'mbytes' },
{ text: 'gibibytes', value: 'gbytes' },
label: 'data (IEC)',
options: [
{ label: 'bits', value: 'bits' },
{ label: 'bytes', value: 'bytes' },
{ label: 'kibibytes', value: 'kbytes' },
{ label: 'mebibytes', value: 'mbytes' },
{ label: 'gibibytes', value: 'gbytes' },
],
},
{
text: 'data (Metric)',
submenu: [
{ text: 'bits', value: 'decbits' },
{ text: 'bytes', value: 'decbytes' },
{ text: 'kilobytes', value: 'deckbytes' },
{ text: 'megabytes', value: 'decmbytes' },
{ text: 'gigabytes', value: 'decgbytes' },
label: 'data (Metric)',
options: [
{ label: 'bits', value: 'decbits' },
{ label: 'bytes', value: 'decbytes' },
{ label: 'kilobytes', value: 'deckbytes' },
{ label: 'megabytes', value: 'decmbytes' },
{ label: 'gigabytes', value: 'decgbytes' },
],
},
{
text: 'data rate',
submenu: [
{ text: 'packets/sec', value: 'pps' },
{ text: 'bits/sec', value: 'bps' },
{ text: 'bytes/sec', value: 'Bps' },
{ text: 'kilobits/sec', value: 'Kbits' },
{ text: 'kilobytes/sec', value: 'KBs' },
{ text: 'megabits/sec', value: 'Mbits' },
{ text: 'megabytes/sec', value: 'MBs' },
{ text: 'gigabytes/sec', value: 'GBs' },
{ text: 'gigabits/sec', value: 'Gbits' },
label: 'data rate',
options: [
{ label: 'packets/sec', value: 'pps' },
{ label: 'bits/sec', value: 'bps' },
{ label: 'bytes/sec', value: 'Bps' },
{ label: 'kilobits/sec', value: 'Kbits' },
{ label: 'kilobytes/sec', value: 'KBs' },
{ label: 'megabits/sec', value: 'Mbits' },
{ label: 'megabytes/sec', value: 'MBs' },
{ label: 'gigabytes/sec', value: 'GBs' },
{ label: 'gigabits/sec', value: 'Gbits' },
],
},
{
text: 'hash rate',
submenu: [
{ text: 'hashes/sec', value: 'Hs' },
{ text: 'kilohashes/sec', value: 'KHs' },
{ text: 'megahashes/sec', value: 'MHs' },
{ text: 'gigahashes/sec', value: 'GHs' },
{ text: 'terahashes/sec', value: 'THs' },
{ text: 'petahashes/sec', value: 'PHs' },
{ text: 'exahashes/sec', value: 'EHs' },
label: 'hash rate',
options: [
{ label: 'hashes/sec', value: 'Hs' },
{ label: 'kilohashes/sec', value: 'KHs' },
{ label: 'megahashes/sec', value: 'MHs' },
{ label: 'gigahashes/sec', value: 'GHs' },
{ label: 'terahashes/sec', value: 'THs' },
{ label: 'petahashes/sec', value: 'PHs' },
{ label: 'exahashes/sec', value: 'EHs' },
],
},
{
text: 'throughput',
submenu: [
{ text: 'ops/sec (ops)', value: 'ops' },
{ text: 'requests/sec (rps)', value: 'reqps' },
{ text: 'reads/sec (rps)', value: 'rps' },
{ text: 'writes/sec (wps)', value: 'wps' },
{ text: 'I/O ops/sec (iops)', value: 'iops' },
{ text: 'ops/min (opm)', value: 'opm' },
{ text: 'reads/min (rpm)', value: 'rpm' },
{ text: 'writes/min (wpm)', value: 'wpm' },
label: 'throughput',
options: [
{ label: 'ops/sec (ops)', value: 'ops' },
{ label: 'requests/sec (rps)', value: 'reqps' },
{ label: 'reads/sec (rps)', value: 'rps' },
{ label: 'writes/sec (wps)', value: 'wps' },
{ label: 'I/O ops/sec (iops)', value: 'iops' },
{ label: 'ops/min (opm)', value: 'opm' },
{ label: 'reads/min (rpm)', value: 'rpm' },
{ label: 'writes/min (wpm)', value: 'wpm' },
],
},
{
text: 'length',
submenu: [
{ text: 'millimetre (mm)', value: 'lengthmm' },
{ text: 'meter (m)', value: 'lengthm' },
{ text: 'feet (ft)', value: 'lengthft' },
{ text: 'kilometer (km)', value: 'lengthkm' },
{ text: 'mile (mi)', value: 'lengthmi' },
label: 'length',
options: [
{ label: 'millimetre (mm)', value: 'lengthmm' },
{ label: 'meter (m)', value: 'lengthm' },
{ label: 'feet (ft)', value: 'lengthft' },
{ label: 'kilometer (km)', value: 'lengthkm' },
{ label: 'mile (mi)', value: 'lengthmi' },
],
},
{
text: 'area',
submenu: [
{ text: 'Square Meters (m²)', value: 'areaM2' },
{ text: 'Square Feet (ft²)', value: 'areaF2' },
{ text: 'Square Miles (mi²)', value: 'areaMI2' },
label: 'area',
options: [
{ label: 'Square Meters (m²)', value: 'areaM2' },
{ label: 'Square Feet (ft²)', value: 'areaF2' },
{ label: 'Square Miles (mi²)', value: 'areaMI2' },
],
},
{
text: 'mass',
submenu: [
{ text: 'milligram (mg)', value: 'massmg' },
{ text: 'gram (g)', value: 'massg' },
{ text: 'kilogram (kg)', value: 'masskg' },
{ text: 'metric ton (t)', value: 'masst' },
label: 'mass',
options: [
{ label: 'milligram (mg)', value: 'massmg' },
{ label: 'gram (g)', value: 'massg' },
{ label: 'kilogram (kg)', value: 'masskg' },
{ label: 'metric ton (t)', value: 'masst' },
],
},
{
text: 'velocity',
submenu: [
{ text: 'metres/second (m/s)', value: 'velocityms' },
{ text: 'kilometers/hour (km/h)', value: 'velocitykmh' },
{ text: 'miles/hour (mph)', value: 'velocitymph' },
{ text: 'knot (kn)', value: 'velocityknot' },
label: 'velocity',
options: [
{ label: 'metres/second (m/s)', value: 'velocityms' },
{ label: 'kilometers/hour (km/h)', value: 'velocitykmh' },
{ label: 'miles/hour (mph)', value: 'velocitymph' },
{ label: 'knot (kn)', value: 'velocityknot' },
],
},
{
text: 'volume',
submenu: [
{ text: 'millilitre (mL)', value: 'mlitre' },
{ text: 'litre (L)', value: 'litre' },
{ text: 'cubic metre', value: 'm3' },
{ text: 'Normal cubic metre', value: 'Nm3' },
{ text: 'cubic decimetre', value: 'dm3' },
{ text: 'gallons', value: 'gallons' },
label: 'volume',
options: [
{ label: 'millilitre (mL)', value: 'mlitre' },
{ label: 'litre (L)', value: 'litre' },
{ label: 'cubic metre', value: 'm3' },
{ label: 'Normal cubic metre', value: 'Nm3' },
{ label: 'cubic decimetre', value: 'dm3' },
{ label: 'gallons', value: 'gallons' },
],
},
{
text: 'energy',
submenu: [
{ text: 'Watt (W)', value: 'watt' },
{ text: 'Kilowatt (kW)', value: 'kwatt' },
{ text: 'Milliwatt (mW)', value: 'mwatt' },
{ text: 'Watt per square metre (W/m²)', value: 'Wm2' },
{ text: 'Volt-ampere (VA)', value: 'voltamp' },
{ text: 'Kilovolt-ampere (kVA)', value: 'kvoltamp' },
{ text: 'Volt-ampere reactive (var)', value: 'voltampreact' },
{ text: 'Kilovolt-ampere reactive (kvar)', value: 'kvoltampreact' },
{ text: 'Watt-hour (Wh)', value: 'watth' },
{ text: 'Kilowatt-hour (kWh)', value: 'kwatth' },
{ text: 'Kilowatt-min (kWm)', value: 'kwattm' },
{ text: 'Joule (J)', value: 'joule' },
{ text: 'Electron volt (eV)', value: 'ev' },
{ text: 'Ampere (A)', value: 'amp' },
{ text: 'Kiloampere (kA)', value: 'kamp' },
{ text: 'Milliampere (mA)', value: 'mamp' },
{ text: 'Volt (V)', value: 'volt' },
{ text: 'Kilovolt (kV)', value: 'kvolt' },
{ text: 'Millivolt (mV)', value: 'mvolt' },
{ text: 'Decibel-milliwatt (dBm)', value: 'dBm' },
{ text: 'Ohm (Ω)', value: 'ohm' },
{ text: 'Lumens (Lm)', value: 'lumens' },
label: 'energy',
options: [
{ label: 'Watt (W)', value: 'watt' },
{ label: 'Kilowatt (kW)', value: 'kwatt' },
{ label: 'Milliwatt (mW)', value: 'mwatt' },
{ label: 'Watt per square metre (W/m²)', value: 'Wm2' },
{ label: 'Volt-ampere (VA)', value: 'voltamp' },
{ label: 'Kilovolt-ampere (kVA)', value: 'kvoltamp' },
{ label: 'Volt-ampere reactive (var)', value: 'voltampreact' },
{ label: 'Kilovolt-ampere reactive (kvar)', value: 'kvoltampreact' },
{ label: 'Watt-hour (Wh)', value: 'watth' },
{ label: 'Kilowatt-hour (kWh)', value: 'kwatth' },
{ label: 'Kilowatt-min (kWm)', value: 'kwattm' },
{ label: 'Joule (J)', value: 'joule' },
{ label: 'Electron volt (eV)', value: 'ev' },
{ label: 'Ampere (A)', value: 'amp' },
{ label: 'Kiloampere (kA)', value: 'kamp' },
{ label: 'Milliampere (mA)', value: 'mamp' },
{ label: 'Volt (V)', value: 'volt' },
{ label: 'Kilovolt (kV)', value: 'kvolt' },
{ label: 'Millivolt (mV)', value: 'mvolt' },
{ label: 'Decibel-milliwatt (dBm)', value: 'dBm' },
{ label: 'Ohm (Ω)', value: 'ohm' },
{ label: 'Lumens (Lm)', value: 'lumens' },
],
},
{
text: 'temperature',
submenu: [
{ text: 'Celsius (°C)', value: 'celsius' },
{ text: 'Farenheit (°F)', value: 'farenheit' },
{ text: 'Kelvin (K)', value: 'kelvin' },
label: 'temperature',
options: [
{ label: 'Celsius (°C)', value: 'celsius' },
{ label: 'Farenheit (°F)', value: 'farenheit' },
{ label: 'Kelvin (K)', value: 'kelvin' },
],
},
{
text: 'pressure',
submenu: [
{ text: 'Millibars', value: 'pressurembar' },
{ text: 'Bars', value: 'pressurebar' },
{ text: 'Kilobars', value: 'pressurekbar' },
{ text: 'Hectopascals', value: 'pressurehpa' },
{ text: 'Kilopascals', value: 'pressurekpa' },
{ text: 'Inches of mercury', value: 'pressurehg' },
{ text: 'PSI', value: 'pressurepsi' },
label: 'pressure',
options: [
{ label: 'Millibars', value: 'pressurembar' },
{ label: 'Bars', value: 'pressurebar' },
{ label: 'Kilobars', value: 'pressurekbar' },
{ label: 'Hectopascals', value: 'pressurehpa' },
{ label: 'Kilopascals', value: 'pressurekpa' },
{ label: 'Inches of mercury', value: 'pressurehg' },
{ label: 'PSI', value: 'pressurepsi' },
],
},
{
text: 'force',
submenu: [
{ text: 'Newton-meters (Nm)', value: 'forceNm' },
{ text: 'Kilonewton-meters (kNm)', value: 'forcekNm' },
{ text: 'Newtons (N)', value: 'forceN' },
{ text: 'Kilonewtons (kN)', value: 'forcekN' },
label: 'force',
options: [
{ label: 'Newton-meters (Nm)', value: 'forceNm' },
{ label: 'Kilonewton-meters (kNm)', value: 'forcekNm' },
{ label: 'Newtons (N)', value: 'forceN' },
{ label: 'Kilonewtons (kN)', value: 'forcekN' },
],
},
{
text: 'flow',
submenu: [
{ text: 'Gallons/min (gpm)', value: 'flowgpm' },
{ text: 'Cubic meters/sec (cms)', value: 'flowcms' },
{ text: 'Cubic feet/sec (cfs)', value: 'flowcfs' },
{ text: 'Cubic feet/min (cfm)', value: 'flowcfm' },
{ text: 'Litre/hour', value: 'litreh' },
{ text: 'Litre/min (l/min)', value: 'flowlpm' },
{ text: 'milliLitre/min (mL/min)', value: 'flowmlpm' },
label: 'flow',
options: [
{ label: 'Gallons/min (gpm)', value: 'flowgpm' },
{ label: 'Cubic meters/sec (cms)', value: 'flowcms' },
{ label: 'Cubic feet/sec (cfs)', value: 'flowcfs' },
{ label: 'Cubic feet/min (cfm)', value: 'flowcfm' },
{ label: 'Litre/hour', value: 'litreh' },
{ label: 'Litre/min (l/min)', value: 'flowlpm' },
{ label: 'milliLitre/min (mL/min)', value: 'flowmlpm' },
],
},
{
text: 'angle',
submenu: [
{ text: 'Degrees (°)', value: 'degree' },
{ text: 'Radians', value: 'radian' },
{ text: 'Gradian', value: 'grad' },
label: 'angle',
options: [
{ label: 'Degrees (°)', value: 'degree' },
{ label: 'Radians', value: 'radian' },
{ label: 'Gradian', value: 'grad' },
],
},
{
text: 'acceleration',
submenu: [
{ text: 'Meters/sec²', value: 'accMS2' },
{ text: 'Feet/sec²', value: 'accFS2' },
{ text: 'G unit', value: 'accG' },
label: 'acceleration',
options: [
{ label: 'Meters/sec²', value: 'accMS2' },
{ label: 'Feet/sec²', value: 'accFS2' },
{ label: 'G unit', value: 'accG' },
],
},
{
text: 'radiation',
submenu: [
{ text: 'Becquerel (Bq)', value: 'radbq' },
{ text: 'curie (Ci)', value: 'radci' },
{ text: 'Gray (Gy)', value: 'radgy' },
{ text: 'rad', value: 'radrad' },
{ text: 'Sievert (Sv)', value: 'radsv' },
{ text: 'rem', value: 'radrem' },
{ text: 'Exposure (C/kg)', value: 'radexpckg' },
{ text: 'roentgen (R)', value: 'radr' },
{ text: 'Sievert/hour (Sv/h)', value: 'radsvh' },
label: 'radiation',
options: [
{ label: 'Becquerel (Bq)', value: 'radbq' },
{ label: 'curie (Ci)', value: 'radci' },
{ label: 'Gray (Gy)', value: 'radgy' },
{ label: 'rad', value: 'radrad' },
{ label: 'Sievert (Sv)', value: 'radsv' },
{ label: 'rem', value: 'radrem' },
{ label: 'Exposure (C/kg)', value: 'radexpckg' },
{ label: 'roentgen (R)', value: 'radr' },
{ label: 'Sievert/hour (Sv/h)', value: 'radsvh' },
],
},
{
text: 'concentration',
submenu: [
{ text: 'parts-per-million (ppm)', value: 'ppm' },
{ text: 'parts-per-billion (ppb)', value: 'conppb' },
{ text: 'nanogram per cubic metre (ng/m³)', value: 'conngm3' },
{ text: 'nanogram per normal cubic metre (ng/Nm³)', value: 'conngNm3' },
{ text: 'microgram per cubic metre (μg/m³)', value: 'conμgm3' },
{ text: 'microgram per normal cubic metre (μg/Nm³)', value: 'conμgNm3' },
{ text: 'milligram per cubic metre (mg/m³)', value: 'conmgm3' },
{ text: 'milligram per normal cubic metre (mg/Nm³)', value: 'conmgNm3' },
{ text: 'gram per cubic metre (g/m³)', value: 'congm3' },
{ text: 'gram per normal cubic metre (g/Nm³)', value: 'congNm3' },
label: 'concentration',
options: [
{ label: 'parts-per-million (ppm)', value: 'ppm' },
{ label: 'parts-per-billion (ppb)', value: 'conppb' },
{ label: 'nanogram per cubic metre (ng/m³)', value: 'conngm3' },
{ label: 'nanogram per normal cubic metre (ng/Nm³)', value: 'conngNm3' },
{ label: 'microgram per cubic metre (μg/m³)', value: 'conμgm3' },
{ label: 'microgram per normal cubic metre (μg/Nm³)', value: 'conμgNm3' },
{ label: 'milligram per cubic metre (mg/m³)', value: 'conmgm3' },
{ label: 'milligram per normal cubic metre (mg/Nm³)', value: 'conmgNm3' },
{ label: 'gram per cubic metre (g/m³)', value: 'congm3' },
{ label: 'gram per normal cubic metre (g/Nm³)', value: 'congNm3' },
],
},
];

2
public/app/plugins/panel/gauge/module.tsx
View File

@ -27,7 +27,7 @@ export class GaugeOptions extends PureComponent<PanelOptionsProps<Options>> {
<div>
<div className="section gf-form-group">
<h5 className="page-heading">Units</h5>
<UnitPicker width={20} onSelected={() => {}} />
<UnitPicker onSelected={() => {}} />
</div>
</div>
);