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.

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

feat: enable or disable scatter dot on charts except scatter chart #769

Merged
merged 7 commits into from
Sep 11, 2020
7 changes: 7 additions & 0 deletions packages/core/src/components/graphs/scatter-stacked.ts
Original file line number Diff line number Diff line change
@@ -1,11 +1,18 @@
// Internal Imports
import { Scatter } from "./scatter";
import { Roles } from "../../interfaces";
import { Tools } from "../../tools";

export class StackedScatter extends Scatter {
type = "scatter-stacked";

render(animate: boolean) {
const isScatterEnabled = Tools.getProperty(this.model.getOptions(), "scatterDotEnabled");
if (!this.configs.alwaysEnableScatterDot) {
if (!isScatterEnabled) {
return;
}
}
// Grab container SVG
const svg = this.getContainerSVG({ withinChartClip: true });

Expand Down
5 changes: 5 additions & 0 deletions packages/core/src/components/graphs/scatter.ts
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,11 @@ export class Scatter extends Component {
}

render(animate: boolean) {
const isScatterEnabled = Tools.getProperty(this.model.getOptions(), "points", "enabled") || Tools.getProperty(this.model.getOptions(), "bubble", "enabled");
if (!isScatterEnabled) {
return;
}

// Grab container SVG
const svg = this.getContainerSVG({ withinChartClip: true });

Expand Down
33 changes: 18 additions & 15 deletions packages/core/src/configuration.ts
Original file line number Diff line number Diff line change
Expand Up @@ -197,14 +197,28 @@ const stackedBarChart: StackedBarChartOptions = Tools.merge({}, baseBarChart, {
} as StackedBarOptions)
} as BarChartOptions);

/**
* options specific to scatter charts
*/
const scatterChart: ScatterChartOptions = Tools.merge({}, axisChart, {
points: {
// default point radius to 4
radius: 4,
fillOpacity: 0.3,
filled: true,
enabled: true
}
} as ScatterChartOptions);

/**
* options specific to line charts
*/
const lineChart: LineChartOptions = Tools.merge({}, axisChart, {
const lineChart: LineChartOptions = Tools.merge({}, scatterChart, {
points: {
// default point radius to 3
radius: 3,
filled: false
filled: false,
enabled: true
}
} as LineChartOptions);

Expand All @@ -222,18 +236,6 @@ const areaChart: AreaChartOptions = Tools.merge({}, lineChart, {
*/
const stackedAreaChart = areaChart;

/**
* options specific to scatter charts
*/
const scatterChart: ScatterChartOptions = Tools.merge({}, axisChart, {
points: {
// default point radius to 4
radius: 4,
fillOpacity: 0.3,
filled: true
}
} as ScatterChartOptions);

/**
* options specific to bubble charts
*/
Expand All @@ -250,7 +252,8 @@ const bubbleChart: BubbleChartOptions = Tools.merge({}, axisChart, {
(smallerChartDimension * 25) / 400
];
},
fillOpacity: 0.2
fillOpacity: 0.2,
enabled: true
}
} as BubbleChartOptions);

Expand Down
5 changes: 5 additions & 0 deletions packages/core/src/interfaces/charts.ts
Original file line number Diff line number Diff line change
Expand Up @@ -147,6 +147,7 @@ export interface ScatterChartOptions extends AxisChartOptions {
radius: number;
fillOpacity?: number;
filled?: boolean;
enabled?: boolean;
};
}

Expand All @@ -171,6 +172,10 @@ export interface BubbleChartOptions extends AxisChartOptions {
* Opacity of the fills used within each circle
*/
fillOpacity?: number;
/**
* enabled scatter dot or not
*/
enabled?: boolean;
};
}

Expand Down