QT/superset2
1
0
Fork 0
mirror of https://github.com/apache/superset.git synced 2026-04-19 16:14:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore: Removes hard-coded colors from the plugins - iteration 2 (#20006)

Browse Source 
* chore: Removes hard-coded colors from the plugins - iteration 2

* Fixes lint errors
This commit is contained in:
Michael S. Molina
2022-05-12 10:12:17 -03:00
committed by GitHub
parent ca9766c109
commit c4c714fffb
12 changed files with 61 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
superset-frontend/plugins/plugin-chart-echarts/src/Gauge/constants.ts
View File

@@ -16,32 +16,35 @@
* specific language governing permissions and limitations
* under the License.
*/
import { SupersetTheme } from '@superset-ui/core';
import { GaugeSeriesOption } from 'echarts';
export const DEFAULT_GAUGE_SERIES_OPTION: GaugeSeriesOption = {
export const defaultGaugeSeriesOption = (
theme: SupersetTheme,
): GaugeSeriesOption => ({
splitLine: {
lineStyle: {
color: '#63677A',
color: theme.colors.primary.base,
},
},
axisLine: {
lineStyle: {
color: [[1, '#E6EBF8']],
color: [[1, theme.colors.primary.light4]],
},
},
axisLabel: {
color: '#464646',
color: theme.colors.grayscale.dark1,
},
axisTick: {
lineStyle: {
width: 2,
color: '#63677A',
color: theme.colors.primary.base,
},
},
detail: {
color: 'auto',
},
};
});
export const INTERVAL_GAUGE_SERIES_OPTION: GaugeSeriesOption = {
splitLine: {

18
superset-frontend/plugins/plugin-chart-echarts/src/Gauge/transformProps.ts
View File

@@ -38,7 +38,7 @@ import {
EchartsGaugeChartProps,
} from './types';
import {
DEFAULT_GAUGE_SERIES_OPTION,
defaultGaugeSeriesOption,
INTERVAL_GAUGE_SERIES_OPTION,
OFFSETS,
FONT_SIZE_MULTIPLIERS,
@@ -83,8 +83,11 @@ const calculateAxisLineWidth = (
export default function transformProps(
chartProps: EchartsGaugeChartProps,
): GaugeChartTransformedProps {
const { width, height, formData, queriesData, hooks, filterState } =
const { width, height, formData, queriesData, hooks, filterState, theme } =
chartProps;
const gaugeSeriesOptions = defaultGaugeSeriesOption(theme);
const {
groupby,
metric,
@@ -205,14 +208,14 @@ export default function transformProps(
length: splitLineLength,
lineStyle: {
width: FONT_SIZE_MULTIPLIERS.splitLineWidth * fontSize,
color: DEFAULT_GAUGE_SERIES_OPTION.splitLine?.lineStyle?.color,
color: gaugeSeriesOptions.splitLine?.lineStyle?.color,
},
};
const axisLine = {
roundCap,
lineStyle: {
width: axisLineWidth,
color: DEFAULT_GAUGE_SERIES_OPTION.axisLine?.lineStyle?.color,
color: gaugeSeriesOptions.axisLine?.lineStyle?.color,
},
};
const axisLabel = {
@@ -227,19 +230,18 @@ export default function transformProps(
OFFSETS.ticksFromLine,
fontSize,
formatter: numberFormatter,
color: DEFAULT_GAUGE_SERIES_OPTION.axisLabel?.color,
color: gaugeSeriesOptions.axisLabel?.color,
};
const axisTick = {
show: showAxisTick,
distance: -axisLineWidth - axisTickLength - OFFSETS.ticksFromLine,
length: axisTickLength,
lineStyle: DEFAULT_GAUGE_SERIES_OPTION.axisTick
?.lineStyle as AxisTickLineStyle,
lineStyle: gaugeSeriesOptions.axisTick?.lineStyle as AxisTickLineStyle,
};
const detail = {
valueAnimation: animation,
formatter: (value: number) => formatValue(value),
color: DEFAULT_GAUGE_SERIES_OPTION.detail?.color,
color: gaugeSeriesOptions.detail?.color,
};
let pointer;