Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

refactor(style): remove component.style, label.style #5331

Merged
merged 1 commit into from
Jul 19, 2023
Merged

refactor(style): remove component.style, label.style #5331

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file modified __tests__/integration/snapshots/static/vennBasic.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified __tests__/integration/snapshots/static/vennHollow.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 1 addition & 3 deletions __tests__/plots/animation/population-interval-rose-keyframe.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,9 +47,7 @@ export async function populationIntervalRoseKeyframe(): Promise<G2Spec> {
tickCount: 5,
tickFilter: (d, i) => i !== 0,
direction: 'right',
style: {
labelTransform: 'rotate(45)',
},
labelTransform: 'rotate(45)',
},
},
},
Expand Down
3 changes: 2 additions & 1 deletion __tests__/plots/api/chart-axis-label-formatter.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -102,7 +102,8 @@ export function chartAxisLabelFormatter(context) {
.label({
text: 'time',
transform: [{ type: 'contrastReverse' }],
style: { dy: 20, fontStyle: 'italic' },
dy: 20,
fontStyle: 'italic',
})
.tooltip({
title: 'car',
Expand Down
30 changes: 13 additions & 17 deletions __tests__/plots/api/chart-emit-brush-highlight-axis-horizontal.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -68,9 +68,7 @@ export function chartEmitBrushHighlightAxisHorizontal(context) {
layout: { justifyContent: 'center' },
size: 50,
length: 300,
style: {
labelSpacing: 0,
},
labelSpacing: 0,
},
},
state: {
Expand All @@ -84,20 +82,18 @@ export function chartEmitBrushHighlightAxisHorizontal(context) {
zIndex: 1,
line: true,
tick: true,
style: {
labelFontSize: 10,
labelStroke: '#fff',
labelStrokeLineJoin: 'round',
labelStrokeWidth: 5,
lineStroke: 'black',
lineStrokeOpacity: 1,
lineStrokeWidth: 1,
tickStroke: 'black',
titleFontSize: 10,
titleStroke: '#fff',
titleStrokeLineJoin: 'round',
titleStrokeWidth: 5,
},
labelFontSize: 10,
labelStroke: '#fff',
labelStrokeLineJoin: 'round',
labelStrokeWidth: 5,
lineStroke: 'black',
lineStrokeOpacity: 1,
lineStrokeWidth: 1,
tickStroke: 'black',
titleFontSize: 10,
titleStroke: '#fff',
titleStrokeLineJoin: 'round',
titleStrokeWidth: 5,
},
]),
),
Expand Down
26 changes: 12 additions & 14 deletions __tests__/plots/api/chart-emit-brush-highlight-axis-vertical.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -66,20 +66,18 @@ export function chartEmitBrushHighlightAxisVertical(context) {
line: true,
tick: true,
titlePosition: 'r',
style: {
labelStroke: '#fff',
labelStrokeWidth: 5,
labelFontSize: 10,
labelStrokeLineJoin: 'round',
titleStroke: '#fff',
titleFontSize: 10,
titleStrokeWidth: 5,
titleStrokeLineJoin: 'round',
titleTransform: 'translate(-50%, 0) rotate(-90)',
lineStroke: 'black',
tickStroke: 'black',
lineStrokeWidth: 1,
},
labelStroke: '#fff',
labelStrokeWidth: 5,
labelFontSize: 10,
labelStrokeLineJoin: 'round',
titleStroke: '#fff',
titleFontSize: 10,
titleStrokeWidth: 5,
titleStrokeLineJoin: 'round',
titleTransform: 'translate(-50%, 0) rotate(-90)',
lineStroke: 'black',
tickStroke: 'black',
lineStrokeWidth: 1,
},
]),
),
Expand Down
2 changes: 1 addition & 1 deletion __tests__/plots/api/chart-emit-brush-highlight-x.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ export function chartEmitBrushHighlightX(context) {
.interval()
.encode('x', 'date')
.encode('y', 'value')
.axis('x', { style: { labelTransform: 'rotate(90deg)' } })
.axis('x', { labelTransform: 'rotate(90deg)' })
.interaction('brushXHighlight', true);

const finished = chart.render();
Expand Down
2 changes: 1 addition & 1 deletion __tests__/plots/api/chart-emit-scrollbar-filter.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ export function chartEmitScrollbarFilter(context) {
])
.encode('x', 'date')
.encode('y', 'value')
.axis('x', { size: 80, style: { labelTransform: 'rotate(90deg)' } })
.axis('x', { size: 80, labelTransform: 'rotate(90deg)' })
.scrollbar('x', { ratio: 0.25 })
.scrollbar('y', { ratio: 0.75 });

Expand Down
2 changes: 1 addition & 1 deletion __tests__/plots/api/chart-emit-slider-filter.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ export function chartEmitSliderFilter(context) {
{ date: '2002-08', value: 109 },
],
encode: { x: 'date', y: 'value' },
axis: { x: { size: 100, style: { labelTransform: 'rotate(90)' } } },
axis: { x: { size: 100, labelTransform: 'rotate(90)' } },
slider: { x: {}, y: { labelFormatter: (d) => +d.toFixed(1) + '' } },
});

Expand Down
24 changes: 11 additions & 13 deletions __tests__/plots/interaction/cars3-line-brush-axis.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,19 +45,17 @@ export function cars3LineBrushAxis(): G2Spec {
zIndex: 1,
line: true,
tick: true,
style: {
labelStroke: '#fff',
labelStrokeWidth: 5,
labelFontSize: 10,
labelStrokeLineJoin: 'round',
titleStroke: '#fff',
titleFontSize: 10,
titleStrokeWidth: 5,
titleStrokeLineJoin: 'round',
lineStroke: 'black',
tickStroke: 'black',
lineStrokeWidth: 1,
},
labelStroke: '#fff',
labelStrokeWidth: 5,
labelFontSize: 10,
labelStrokeLineJoin: 'round',
titleStroke: '#fff',
titleFontSize: 10,
titleStrokeWidth: 5,
titleStrokeLineJoin: 'round',
lineStroke: 'black',
tickStroke: 'black',
lineStrokeWidth: 1,
},
]),
),
Expand Down
26 changes: 12 additions & 14 deletions __tests__/plots/interaction/cars3-line-vertical-brush-axis.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,20 +45,18 @@ export function cars3LineVerticalBrushAxis(): G2Spec {
line: true,
tick: true,
titlePosition: 'r',
style: {
labelStroke: '#fff',
labelStrokeWidth: 5,
labelFontSize: 10,
labelStrokeLineJoin: 'round',
titleStroke: '#fff',
titleFontSize: 10,
titleStrokeWidth: 5,
titleStrokeLineJoin: 'round',
titleTransform: 'translate(-50%, 0) rotate(-90)',
lineStroke: 'black',
tickStroke: 'black',
lineStrokeWidth: 1,
},
labelStroke: '#fff',
labelStrokeWidth: 5,
labelFontSize: 10,
labelStrokeLineJoin: 'round',
titleStroke: '#fff',
titleFontSize: 10,
titleStrokeWidth: 5,
titleStrokeLineJoin: 'round',
titleTransform: 'translate(-50%, 0) rotate(-90)',
lineStroke: 'black',
tickStroke: 'black',
lineStrokeWidth: 1,
},
]),
),
Expand Down
6 changes: 2 additions & 4 deletions __tests__/plots/interaction/indices-line-chart-facet.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,11 +37,9 @@ export async function indicesLineChartFacet(): Promise<G2Spec> {
tooltip: {
series: true,
facet: true,
crosshairs: true,
body: false,
style: {
crosshairsStrokeWidth: 30,
},
crosshairs: true,
crosshairsStrokeWidth: 30,
},
},
};
Expand Down
4 changes: 1 addition & 3 deletions __tests__/plots/interaction/indices-line-chart-index-series.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,9 +27,7 @@ export async function indicesLineChartIndexSeries(): Promise<G2Spec> {
{
text: 'Symbol',
selector: 'last',
style: {
fontSize: 10,
},
fontSize: 10,
},
],
interaction: {
Expand Down
2 changes: 1 addition & 1 deletion __tests__/plots/interaction/movies-interval-highlight-multiple-state.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ export function moviesIntervalHighlightMultipleState(): G2Spec {
transform: [{ type: 'groupX', y: 'sum' }],
axis: {
y: { labelFormatter: '~s' },
x: { style: { labelTransform: 'rotate(90)' } },
x: { labelTransform: 'rotate(90)' },
},
encode: {
x: 'Major Genre',
Expand Down
2 changes: 1 addition & 1 deletion __tests__/plots/interaction/points-point-regression-quad-inset.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ export function pointsPointRegressionQuadInset(): G2Spec {
scale: { x: { domain: [-4, 4] }, y: { domain: [-2, 14] } },
axis: { x: { title: false }, y: { title: false } },
interaction: {
tooltip: { body: false, style: { crosshairsStrokeWidth: 30 } },
tooltip: { body: false, crosshairsStrokeWidth: 30 },
},
children: [
{
Expand Down
2 changes: 1 addition & 1 deletion __tests__/plots/interaction/points-point-regression-quad-transpose.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ export function pointsPointRegressionQuadTranspose(): G2Spec {
scale: { x: { domain: [-4, 4] }, y: { domain: [-2, 14] } },
axis: { x: { title: false }, y: { title: false } },
interaction: {
tooltip: { body: false, style: { crosshairsStrokeWidth: 30 } },
tooltip: { body: false, crosshairsStrokeWidth: 30 },
},
coordinate: { transform: [{ type: 'transpose' }] },
children: [
Expand Down
2 changes: 1 addition & 1 deletion __tests__/plots/interaction/points-point-regression-quad.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ export function pointsPointRegressionQuad(): G2Spec {
scale: { x: { domain: [-4, 4] }, y: { domain: [-2, 14] } },
axis: { x: { title: false }, y: { title: false } },
interaction: {
tooltip: { body: false, style: { crosshairsStrokeWidth: 30 } },
tooltip: { body: false, crosshairsStrokeWidth: 30 },
},
children: [
{
Expand Down
8 changes: 3 additions & 5 deletions __tests__/plots/interaction/score-by-item-area-radar.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ export function scoreByItemAreaRadar(): G2Spec {
data: scoreByItem,
coordinate: { type: 'polar' },
axis: {
x: { style: { grid: true } },
x: { grid: true },
y: { zIndex: 1, title: false, direction: 'center' },
},
scale: {
Expand All @@ -19,10 +19,8 @@ export function scoreByItemAreaRadar(): G2Spec {
interaction: {
tooltip: {
body: false,
style: {
crosshairsLineDash: [4, 4],
crosshairsStrokeWidth: 10,
},
crosshairsLineDash: [4, 4],
crosshairsStrokeWidth: 10,
},
},
children: [
Expand Down
12 changes: 3 additions & 9 deletions __tests__/plots/interaction/weather-line-legend-mark.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,9 +33,7 @@ export function weatherLineLegendMark(): G2Spec {
y: {
title: 'Temperature (°C)',
grid: false,
style: {
titleFill: '#EE6666',
},
titleFill: '#EE6666',
},
},
},
Expand All @@ -56,9 +54,7 @@ export function weatherLineLegendMark(): G2Spec {
y: {
title: 'Evaporation (°C)',
grid: null,
style: {
titleFill: '#5470C6',
},
titleFill: '#5470C6',
},
},
},
Expand All @@ -81,9 +77,7 @@ export function weatherLineLegendMark(): G2Spec {
position: 'right',
title: 'Precipitation (ml)',
grid: false,
style: {
titleFill: '#91CC75',
},
titleFill: '#91CC75',
},
},
},
Expand Down
16 changes: 6 additions & 10 deletions __tests__/plots/static/acme-crop-income-interval-connector.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ export function acmeCropIncomeIntervalConnector() {
paddingTop: 40,
data: acmeCropIncome,
axis: {
x: { title: false, style: { labelTransform: 'rotate(-90)' } },
x: { title: false, labelTransform: 'rotate(-90)' },
y: { labelFormatter: '~s' },
},
legend: false,
Expand All @@ -50,10 +50,8 @@ export function acmeCropIncomeIntervalConnector() {
{
text: (d) => `${d.y2 - d.y1}`,
formatter: '~s',
style: {
fontSize: 10,
dy: 2,
},
fontSize: 10,
dy: 2,
},
],
style: {
Expand Down Expand Up @@ -84,11 +82,9 @@ export function acmeCropIncomeIntervalConnector() {
text: 'value',
formatter: '~s',
position: (d) => (d.value > 0 ? 'top' : 'bottom'),
style: {
textBaseline: (d) => (d.value > 0 ? 'bottom' : 'top'),
fontSize: 10,
dy: (d) => (d.value > 0 ? -4 : 4),
},
textBaseline: (d) => (d.value > 0 ? 'bottom' : 'top'),
fontSize: 10,
dy: (d) => (d.value > 0 ? -4 : 4),
},
],
},
Expand Down
2 changes: 1 addition & 1 deletion __tests__/plots/static/alphabet-interval-auto-padding-rotate.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ export function alphabetIntervalAutoRotate(): G2Spec {
y: { labelFormatter: (d) => d + '0000' },
x: {
labelFormatter: (d) => d + '00',
style: { labelTransform: 'rotate(60)' },
labelTransform: 'rotate(60)',
},
},
viewStyle: {
Expand Down
8 changes: 3 additions & 5 deletions __tests__/plots/static/alphabet-interval-auto-padding-style.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,12 +17,10 @@ export function alphabetIntervalAutoPaddingStyle(): G2Spec {
axis: {
y: {
labelFormatter: (d) => d + '0000',
style: {
labelFontSize: (_, i) => 10 + i,
labelFill: 'steelblue',
},
labelFontSize: (_, i) => 10 + i,
labelFill: 'steelblue',
},
x: { labelFormatter: (d) => d + '0000', style: { labelFontSize: 20 } },
x: { labelFormatter: (d) => d + '0000', labelFontSize: 20 },
},
viewStyle: {
viewFill: '#4e79a7',
Expand Down
6 changes: 2 additions & 4 deletions __tests__/plots/static/alphabet-interval-axis.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ export function alphabetIntervalAxis(): G2Spec {
},
axis: { y: { tickCount: 10 }, x: false },
},
{ type: 'axisX', title: 'Letter', style: { labelFontSize: 20 } },
{ type: 'axisX', title: 'Letter', labelFontSize: 20 },
{
type: 'axisY',
labelFormatter: '.0%',
Expand All @@ -37,9 +37,7 @@ export function alphabetIntervalAxis(): G2Spec {
range: [1, 0],
},
},
style: {
grid: false,
},
grid: false,
},
],
};
Expand Down
4 changes: 1 addition & 3 deletions __tests__/plots/static/alphabet-interval-label-contrast-reverse.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,9 +28,7 @@ export function alphabetIntervalLabelContrastReverse(): G2Spec {
palette: ['#00FF00', '#ffff00'], // Use full color string to avoid screenshot error.
},
],
style: {
fill: '#000',
},
fill: '#000',
},
],
};
Expand Down
Loading