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

Audits and Adds typescript props, definitions, and demo: VictoryZoomContainer #1536

Merged
merged 12 commits into from
May 4, 2020
Merged

Audits and Adds typescript props, definitions, and demo: VictoryZoomContainer #1536

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
7c5026d
Updates the defined props for VictoryZoomContainerProps interface
wsparsons Apr 24, 2020
0cef60e
Changes the name from CursorData to CoordinatesPropType
wsparsons Apr 24, 2020
5f8e9c3
Adds ZoomContainerDemo to app
wsparsons Apr 24, 2020
dad021c
Adds ZoomContainerDemo
wsparsons Apr 24, 2020
3712fe4
Fixes type errors for zoom container demo
wsparsons Apr 25, 2020
7a49c53
Fixes type errors for zoom container demo
wsparsons Apr 28, 2020
e124b52
Updates BrushContainer to use DomainTuple instead of RangleTuple to a…
wsparsons Apr 29, 2020
e5156ba
Updates ZoomContainer to use DomainTuple instead of RangleTuple to ac…
wsparsons Apr 29, 2020
b1e42fe
Fixes type errors and removes unused proptypes and function from zoom…
wsparsons Apr 29, 2020
7ca999e
Removes the optional property for domain
wsparsons Apr 29, 2020
4439701
Removes uninvoked function
wsparsons Apr 30, 2020
68a8f49
Removes third argument since in random method for lodash should be a …
wsparsons Apr 30, 2020
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
9 changes: 2 additions & 7 deletions demo/js/components/victory-zoom-container-demo.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
/*eslint-disable no-magic-numbers,react/no-multi-comp */
import React from "react";
import PropTypes from "prop-types";
import { range, merge, random, minBy, maxBy, last, round } from "lodash";
import { range, merge, random, minBy, maxBy, last } from "lodash";
import { VictoryChart } from "Packages/victory-chart/src/index";
import { VictoryStack } from "Packages/victory-stack/src/index";
import { VictoryGroup } from "Packages/victory-group/src/index";
Expand Down Expand Up @@ -61,11 +61,6 @@ class CustomChart extends React.Component {
x: [data[0].x, last(data).x]
};
}
getZoomFactor() {
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ended up removing this uninvoked function. not sure if this should be used in the demo and somehow got missed?

const { zoomedXDomain } = this.state;
const factor = 10 / (zoomedXDomain[1] - zoomedXDomain[0]);
return round(factor, factor < 3 ? 1 : 0);
}

render() {
const renderedData = this.getData();
Expand Down Expand Up @@ -123,7 +118,7 @@ export default class App extends React.Component {

getZoomDomain() {
return {
y: [random(0, 0.4, 0.1), random(0.6, 1, 0.1)]
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ended up removing this since https://lodash.com/docs/4.17.15#random says the third argument should be a boolean. not sure if the 0.1 was intentional or if it should have a boolean value.

y: [random(0, 0.4), random(0.6, 1)]
};
}

Expand Down
4 changes: 3 additions & 1 deletion demo/ts/app.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ import TooltipDemo from "./components/victory-tooltip-demo";
import VictorySelectionContainerDemo from "./components/victory-selection-container-demo";
import VictorySharedEventsDemo from "./components/victory-shared-events-demo";
import VoronoiDemo from "./components/victory-voronoi-demo";
import ZoomContainerDemo from "./components/victory-zoom-container-demo";

const MAP = {
"/area": { component: AreaDemo, name: "AreaDemo" },
Expand All @@ -44,7 +45,8 @@ const MAP = {
name: "VictorySelectionContainerDemo"
},
"/victory-shared-events": { component: VictorySharedEventsDemo, name: "VictorySharedEventsDemo" },
"/voronoi": { component: VoronoiDemo, name: "VoronoiDemo" }
"/voronoi": { component: VoronoiDemo, name: "VoronoiDemo" },
"/zoom-container": { component: ZoomContainerDemo, name: "ZoomContainerDemo" }
};

class Home extends React.Component {
Expand Down
7 changes: 4 additions & 3 deletions demo/ts/components/victory-brush-container-demo.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,11 +10,12 @@ import { VictoryScatter } from "@packages/victory-scatter";
import { VictoryLegend } from "@packages/victory-legend";
import { VictoryZoomContainer } from "@packages/victory-zoom-container";
import { VictoryBrushContainer } from "@packages/victory-brush-container";
import { DomainTuple } from "@packages/victory-core";

interface VictoryBrushContainerDemoState {
zoomDomain: {
x?: [number, number];
y?: [number, number];
x?: DomainTuple;
y?: DomainTuple;
};
}

Expand All @@ -29,7 +30,7 @@ export default class VictoryBrushContainerDemo extends React.Component<
};
}

handleZoom(domain: { x?: [number, number]; y?: [number, number] }) {
handleZoom(domain: { x?: DomainTuple; y?: DomainTuple }) {
this.setState({ zoomDomain: domain });
}

Expand Down
14 changes: 7 additions & 7 deletions demo/ts/components/victory-cursor-container-demo.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,18 +11,18 @@ import { VictoryScatter } from "@packages/victory-scatter";
import { VictoryCursorContainer } from "@packages/victory-cursor-container";
import { VictoryTooltip } from "@packages/victory-tooltip";
import { VictoryLegend } from "@packages/victory-legend";
import { VictoryTheme, CursorData } from "@packages/victory-core";
import { VictoryTheme, CoordinatesPropType } from "@packages/victory-core";

interface VictoryCursorContainerStateInterface {
data: { a: number; b: number }[];
cursorValue: CursorData;
bigData: CursorData[];
cursorValue: CoordinatesPropType;
bigData: CoordinatesPropType[];
}

const makeData = () => range(1500).map((x) => ({ x, y: x + 10 * Math.random() }));

class App extends React.Component<any, VictoryCursorContainerStateInterface> {
defaultCursorValue?: CursorData = undefined;
defaultCursorValue?: CoordinatesPropType = undefined;
setStateInterval?: number = undefined;

constructor(props: any) {
Expand Down Expand Up @@ -67,7 +67,7 @@ class App extends React.Component<any, VictoryCursorContainerStateInterface> {

const chartStyle = { parent: { border: "1px solid #ccc", margin: "2%", maxWidth: "40%" } };

const cursorLabel = (datum: CursorData) => round(datum.x, 2);
const cursorLabel = (datum: CoordinatesPropType) => round(datum.x, 2);

return (
<div className="demo">
Expand Down Expand Up @@ -155,7 +155,7 @@ class App extends React.Component<any, VictoryCursorContainerStateInterface> {
}}
containerComponent={
<VictoryCursorContainer
cursorLabel={(datum: CursorData) => round(datum.x, 2)}
cursorLabel={(datum: CoordinatesPropType) => round(datum.x, 2)}
cursorDimension="x"
defaultCursorValue={1}
/>
Expand Down Expand Up @@ -193,7 +193,7 @@ class App extends React.Component<any, VictoryCursorContainerStateInterface> {
<VictoryCursorContainer
defaultCursorValue={2}
cursorDimension="x"
cursorLabel={(datum: CursorData) => round(datum.x, 2)}
cursorLabel={(datum: CoordinatesPropType) => round(datum.x, 2)}
cursorLabelOffset={15}
/>
}
Expand Down
Loading