@pie-lib/charting 5.1.6 → 5.1.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +11 -0
- package/lib/chart.js +6 -8
- package/lib/chart.js.map +1 -1
- package/package.json +3 -3
- package/src/chart.jsx +6 -8
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,17 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [5.1.7](https://github.com/pie-framework/pie-lib/compare/@pie-lib/charting@5.1.6...@pie-lib/charting@5.1.7) (2022-08-30)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Bug Fixes
|
|
10
|
+
|
|
11
|
+
* **plot, charting, graphing:** adjusted side pixel guides, fixed graphing rendering issue, adjusted charting dimensions PD-1963 ([5043231](https://github.com/pie-framework/pie-lib/commit/5043231ba73a0aa475115fb5fe9af29e0e67a4b6))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
|
|
6
17
|
## [5.1.6](https://github.com/pie-framework/pie-lib/compare/@pie-lib/charting@5.1.5...@pie-lib/charting@5.1.6) (2022-08-29)
|
|
7
18
|
|
|
8
19
|
|
package/lib/chart.js
CHANGED
|
@@ -206,7 +206,7 @@ var Chart = /*#__PURE__*/function (_React$Component) {
|
|
|
206
206
|
var rootCommon = (0, _cloneDeep["default"])(common);
|
|
207
207
|
rootCommon.graphProps.size.height += top + increaseHeight;
|
|
208
208
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
209
|
-
className: (0, _classnames["default"])(classes
|
|
209
|
+
className: (0, _classnames["default"])(classes.chart, className)
|
|
210
210
|
}, /*#__PURE__*/_react["default"].createElement("div", {
|
|
211
211
|
className: classes.controls
|
|
212
212
|
}, /*#__PURE__*/_react["default"].createElement(_toolMenu["default"], {
|
|
@@ -301,8 +301,12 @@ var styles = function styles(theme) {
|
|
|
301
301
|
graphBox: {
|
|
302
302
|
transform: 'translate(60px, 35px)'
|
|
303
303
|
},
|
|
304
|
+
chart: {
|
|
305
|
+
display: 'flex',
|
|
306
|
+
flexDirection: 'column',
|
|
307
|
+
width: 'min-content'
|
|
308
|
+
},
|
|
304
309
|
controls: {
|
|
305
|
-
width: 'inherit',
|
|
306
310
|
display: 'flex',
|
|
307
311
|
justifyContent: 'space-between',
|
|
308
312
|
padding: theme.spacing.unit,
|
|
@@ -312,12 +316,6 @@ var styles = function styles(theme) {
|
|
|
312
316
|
borderLeft: "solid 1px ".concat(_renderUi.color.primaryDark()),
|
|
313
317
|
borderRight: "solid 1px ".concat(_renderUi.color.primaryDark())
|
|
314
318
|
},
|
|
315
|
-
root: {
|
|
316
|
-
overflow: 'hidden'
|
|
317
|
-
},
|
|
318
|
-
svg: {
|
|
319
|
-
overflow: 'visible'
|
|
320
|
-
},
|
|
321
319
|
toolMenu: {
|
|
322
320
|
minHeight: '36px'
|
|
323
321
|
}
|
package/lib/chart.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/chart.jsx"],"names":["log","Chart","charts","chartTypes","Bar","Histogram","LineDot","LineCross","DotPlot","LinePlot","props","state","chartType","ChartComponent","chart","find","type","Component","data","onDataChange","index","newCategory","integerIndex","parseInt","range","categoryDefaultLabel","defineChart","inDefineChart","autoFocus","label","value","step","deletable","editable","interactive","map","d","classes","className","domain","size","title","addCategoryEnabled","showPixelGuides","width","height","getChart","categories","getFilteredCategories","correctValues","verticalLines","horizontalLines","leftAxis","common","graphProps","rootNode","maskSize","x","y","scale","xBand","bandWidth","bandwidth","barWidth","max","length","increaseHeight","top","rootCommon","controls","toolMenu","addCategory","r","changeData","changeCategory","React","PropTypes","object","isRequired","string","shape","number","min","axisLabel","arrayOf","labelStep","array","func","bool","theme","styles","graphBox","transform","display","justifyContent","padding","spacing","unit","backgroundColor","color","primaryLight","borderTop","primaryDark","borderBottom","borderLeft","borderRight","root","overflow","svg","minHeight","withTheme"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport classNames from 'classnames';\nimport { Root, createGraphProps } from '@pie-lib/plot';\nimport cloneDeep from 'lodash/cloneDeep';\nimport ChartGrid from './grid';\nimport ChartAxes from './axes';\nimport debug from 'debug';\nimport { color } from '@pie-lib/render-ui';\nimport {\n dataToXBand,\n getDomainAndRangeByChartType,\n getGridLinesAndAxisByChartType,\n getTopPadding\n} from './utils';\nimport ToolMenu from './tool-menu';\nimport chartTypes from './chart-types';\n\nconst log = debug('pie-lib:charts:chart');\n\nexport class Chart extends React.Component {\n static propTypes = {\n classes: PropTypes.object.isRequired,\n className: PropTypes.string,\n chartType: PropTypes.string.isRequired,\n size: PropTypes.shape({\n width: PropTypes.number,\n height: PropTypes.number\n }),\n domain: PropTypes.shape({\n label: PropTypes.string,\n min: PropTypes.number,\n max: PropTypes.number,\n axisLabel: PropTypes.string\n }),\n data: PropTypes.arrayOf(PropTypes.shape({ label: PropTypes.string, value: PropTypes.number })),\n range: PropTypes.shape({\n label: PropTypes.string,\n min: PropTypes.number,\n max: PropTypes.number,\n step: PropTypes.number,\n labelStep: PropTypes.number,\n axisLabel: PropTypes.string\n }),\n charts: PropTypes.array,\n title: PropTypes.string,\n onDataChange: PropTypes.func,\n addCategoryEnabled: PropTypes.bool,\n showPixelGuides: PropTypes.bool,\n categoryDefaultLabel: PropTypes.string,\n defineChart: PropTypes.bool,\n theme: PropTypes.object\n };\n\n static defaultProps = {\n size: {\n width: 480,\n height: 480\n }\n };\n\n state = {\n charts: [\n chartTypes.Bar(),\n chartTypes.Histogram(),\n chartTypes.LineDot(),\n chartTypes.LineCross(),\n chartTypes.DotPlot(),\n chartTypes.LinePlot()\n ]\n };\n\n getChart = () => {\n const charts = this.props.charts || this.state.charts;\n let { chartType } = this.props;\n let ChartComponent = null;\n let chart = null;\n\n if (chartType) {\n chart = charts && charts.find(chart => chart.type === chartType);\n ChartComponent = chart && chart.Component;\n } else {\n chart = charts && charts[0];\n ChartComponent = chart && chart.Component;\n chartType = chart && chart.type;\n }\n\n return {\n type: chartType,\n ChartComponent\n };\n };\n\n changeData = data => {\n const { onDataChange } = this.props;\n\n onDataChange(data);\n };\n\n changeCategory = (index, newCategory) => {\n const integerIndex = parseInt(index, 10);\n\n if (integerIndex >= 0) {\n const { data, onDataChange } = this.props;\n data[integerIndex] = {\n ...data[integerIndex],\n ...newCategory\n };\n\n onDataChange(data);\n }\n };\n\n addCategory = range => {\n const { onDataChange, data, categoryDefaultLabel, defineChart } = this.props;\n\n onDataChange([\n ...data,\n {\n inDefineChart: defineChart,\n autoFocus: true,\n label: categoryDefaultLabel || 'New Bar',\n value: range.step,\n deletable: true,\n editable: true,\n interactive: true\n }\n ]);\n };\n\n getFilteredCategories = () => {\n const { data, defineChart } = this.props;\n\n return data\n ? data.map(d => ({\n ...d,\n deletable: defineChart || d.deletable\n }))\n : [];\n };\n\n render() {\n const {\n classes,\n className,\n domain,\n range,\n size,\n title,\n addCategoryEnabled,\n showPixelGuides\n } = this.props;\n let { chartType } = this.props;\n\n const defineChart = this.props.defineChart || false;\n const { width, height } = size || {};\n\n const { ChartComponent } = this.getChart();\n const categories = this.getFilteredCategories();\n\n const correctValues = getDomainAndRangeByChartType(domain, range, chartType);\n\n const { verticalLines, horizontalLines, leftAxis } = getGridLinesAndAxisByChartType(\n correctValues.range,\n chartType\n );\n const common = {\n graphProps: createGraphProps(\n correctValues.domain,\n correctValues.range,\n size,\n () => this.rootNode\n )\n };\n\n log('[render] common:', common);\n\n const maskSize = { x: -10, y: -10, width: width + 20, height: height + 80 };\n const { scale } = common.graphProps;\n const xBand = dataToXBand(scale.x, categories, width, chartType);\n\n if (!ChartComponent) {\n return null;\n }\n\n const bandWidth = xBand.bandwidth();\n // for chartType \"line\", bandWidth will be 0, so we have to calculate it\n const barWidth = bandWidth || scale.x(correctValues.domain.max) / categories.length;\n const increaseHeight = defineChart ? 80 : 0;\n\n // if there are many categories, we have to rotate their names in order to fit\n // and we have to add extra value on top of some items\n const top = getTopPadding(barWidth);\n const rootCommon = cloneDeep(common);\n rootCommon.graphProps.size.height += top + increaseHeight;\n\n return (\n <div className={classNames(classes.class, className)}>\n <div className={classes.controls}>\n <ToolMenu\n className={classes.toolMenu}\n disabled={!addCategoryEnabled}\n addCategory={() => this.addCategory(correctValues.range)}\n />\n </div>\n <Root\n title={title}\n thisIsChart={defineChart}\n showPixelGuides={showPixelGuides}\n classes={classes}\n rootRef={r => (this.rootNode = r)}\n {...rootCommon}\n >\n <ChartGrid\n {...common}\n xBand={xBand}\n rowTickValues={horizontalLines}\n columnTickValues={verticalLines}\n />\n <ChartAxes\n {...common}\n defineChart={defineChart}\n categories={categories}\n xBand={xBand}\n leftAxis={leftAxis}\n onChange={this.changeData}\n onChangeCategory={this.changeCategory}\n top={top}\n />\n <mask id=\"myMask\">\n <rect {...maskSize} fill=\"white\" />\n </mask>\n <g id=\"marks\" mask=\"url('#myMask')\">\n <ChartComponent\n {...common}\n data={categories}\n defineChart={defineChart}\n onChange={this.changeData}\n onChangeCategory={this.changeCategory}\n />\n </g>\n </Root>\n </div>\n );\n }\n}\n\nconst styles = theme => ({\n graphBox: {\n transform: 'translate(60px, 35px)'\n },\n controls: {\n width: 'inherit',\n display: 'flex',\n justifyContent: 'space-between',\n padding: theme.spacing.unit,\n backgroundColor: color.primaryLight(),\n borderTop: `solid 1px ${color.primaryDark()}`,\n borderBottom: `solid 0px ${color.primaryDark()}`,\n borderLeft: `solid 1px ${color.primaryDark()}`,\n borderRight: `solid 1px ${color.primaryDark()}`\n },\n root: {\n overflow: 'hidden'\n },\n svg: {\n overflow: 'visible'\n },\n toolMenu: {\n minHeight: '36px'\n }\n});\n\nexport default withStyles(styles, { withTheme: true })(Chart);\n"],"file":"chart.js"}
|
|
1
|
+
{"version":3,"sources":["../src/chart.jsx"],"names":["log","Chart","charts","chartTypes","Bar","Histogram","LineDot","LineCross","DotPlot","LinePlot","props","state","chartType","ChartComponent","chart","find","type","Component","data","onDataChange","index","newCategory","integerIndex","parseInt","range","categoryDefaultLabel","defineChart","inDefineChart","autoFocus","label","value","step","deletable","editable","interactive","map","d","classes","className","domain","size","title","addCategoryEnabled","showPixelGuides","width","height","getChart","categories","getFilteredCategories","correctValues","verticalLines","horizontalLines","leftAxis","common","graphProps","rootNode","maskSize","x","y","scale","xBand","bandWidth","bandwidth","barWidth","max","length","increaseHeight","top","rootCommon","controls","toolMenu","addCategory","r","changeData","changeCategory","React","PropTypes","object","isRequired","string","shape","number","min","axisLabel","arrayOf","labelStep","array","func","bool","theme","styles","graphBox","transform","display","flexDirection","justifyContent","padding","spacing","unit","backgroundColor","color","primaryLight","borderTop","primaryDark","borderBottom","borderLeft","borderRight","minHeight","withTheme"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport classNames from 'classnames';\nimport { Root, createGraphProps } from '@pie-lib/plot';\nimport cloneDeep from 'lodash/cloneDeep';\nimport ChartGrid from './grid';\nimport ChartAxes from './axes';\nimport debug from 'debug';\nimport { color } from '@pie-lib/render-ui';\nimport {\n dataToXBand,\n getDomainAndRangeByChartType,\n getGridLinesAndAxisByChartType,\n getTopPadding\n} from './utils';\nimport ToolMenu from './tool-menu';\nimport chartTypes from './chart-types';\n\nconst log = debug('pie-lib:charts:chart');\n\nexport class Chart extends React.Component {\n static propTypes = {\n classes: PropTypes.object.isRequired,\n className: PropTypes.string,\n chartType: PropTypes.string.isRequired,\n size: PropTypes.shape({\n width: PropTypes.number,\n height: PropTypes.number\n }),\n domain: PropTypes.shape({\n label: PropTypes.string,\n min: PropTypes.number,\n max: PropTypes.number,\n axisLabel: PropTypes.string\n }),\n data: PropTypes.arrayOf(PropTypes.shape({ label: PropTypes.string, value: PropTypes.number })),\n range: PropTypes.shape({\n label: PropTypes.string,\n min: PropTypes.number,\n max: PropTypes.number,\n step: PropTypes.number,\n labelStep: PropTypes.number,\n axisLabel: PropTypes.string\n }),\n charts: PropTypes.array,\n title: PropTypes.string,\n onDataChange: PropTypes.func,\n addCategoryEnabled: PropTypes.bool,\n showPixelGuides: PropTypes.bool,\n categoryDefaultLabel: PropTypes.string,\n defineChart: PropTypes.bool,\n theme: PropTypes.object\n };\n\n static defaultProps = {\n size: {\n width: 480,\n height: 480\n }\n };\n\n state = {\n charts: [\n chartTypes.Bar(),\n chartTypes.Histogram(),\n chartTypes.LineDot(),\n chartTypes.LineCross(),\n chartTypes.DotPlot(),\n chartTypes.LinePlot()\n ]\n };\n\n getChart = () => {\n const charts = this.props.charts || this.state.charts;\n let { chartType } = this.props;\n let ChartComponent = null;\n let chart = null;\n\n if (chartType) {\n chart = charts && charts.find(chart => chart.type === chartType);\n ChartComponent = chart && chart.Component;\n } else {\n chart = charts && charts[0];\n ChartComponent = chart && chart.Component;\n chartType = chart && chart.type;\n }\n\n return {\n type: chartType,\n ChartComponent\n };\n };\n\n changeData = data => {\n const { onDataChange } = this.props;\n\n onDataChange(data);\n };\n\n changeCategory = (index, newCategory) => {\n const integerIndex = parseInt(index, 10);\n\n if (integerIndex >= 0) {\n const { data, onDataChange } = this.props;\n data[integerIndex] = {\n ...data[integerIndex],\n ...newCategory\n };\n\n onDataChange(data);\n }\n };\n\n addCategory = range => {\n const { onDataChange, data, categoryDefaultLabel, defineChart } = this.props;\n\n onDataChange([\n ...data,\n {\n inDefineChart: defineChart,\n autoFocus: true,\n label: categoryDefaultLabel || 'New Bar',\n value: range.step,\n deletable: true,\n editable: true,\n interactive: true\n }\n ]);\n };\n\n getFilteredCategories = () => {\n const { data, defineChart } = this.props;\n\n return data\n ? data.map(d => ({\n ...d,\n deletable: defineChart || d.deletable\n }))\n : [];\n };\n\n render() {\n const {\n classes,\n className,\n domain,\n range,\n size,\n title,\n addCategoryEnabled,\n showPixelGuides\n } = this.props;\n let { chartType } = this.props;\n\n const defineChart = this.props.defineChart || false;\n const { width, height } = size || {};\n\n const { ChartComponent } = this.getChart();\n const categories = this.getFilteredCategories();\n\n const correctValues = getDomainAndRangeByChartType(domain, range, chartType);\n\n const { verticalLines, horizontalLines, leftAxis } = getGridLinesAndAxisByChartType(\n correctValues.range,\n chartType\n );\n const common = {\n graphProps: createGraphProps(\n correctValues.domain,\n correctValues.range,\n size,\n () => this.rootNode\n )\n };\n\n log('[render] common:', common);\n\n const maskSize = { x: -10, y: -10, width: width + 20, height: height + 80 };\n const { scale } = common.graphProps;\n const xBand = dataToXBand(scale.x, categories, width, chartType);\n\n if (!ChartComponent) {\n return null;\n }\n\n const bandWidth = xBand.bandwidth();\n // for chartType \"line\", bandWidth will be 0, so we have to calculate it\n const barWidth = bandWidth || scale.x(correctValues.domain.max) / categories.length;\n const increaseHeight = defineChart ? 80 : 0;\n\n // if there are many categories, we have to rotate their names in order to fit\n // and we have to add extra value on top of some items\n const top = getTopPadding(barWidth);\n const rootCommon = cloneDeep(common);\n rootCommon.graphProps.size.height += top + increaseHeight;\n\n return (\n <div className={classNames(classes.chart, className)}>\n <div className={classes.controls}>\n <ToolMenu\n className={classes.toolMenu}\n disabled={!addCategoryEnabled}\n addCategory={() => this.addCategory(correctValues.range)}\n />\n </div>\n <Root\n title={title}\n thisIsChart={defineChart}\n showPixelGuides={showPixelGuides}\n classes={classes}\n rootRef={r => (this.rootNode = r)}\n {...rootCommon}\n >\n <ChartGrid\n {...common}\n xBand={xBand}\n rowTickValues={horizontalLines}\n columnTickValues={verticalLines}\n />\n <ChartAxes\n {...common}\n defineChart={defineChart}\n categories={categories}\n xBand={xBand}\n leftAxis={leftAxis}\n onChange={this.changeData}\n onChangeCategory={this.changeCategory}\n top={top}\n />\n <mask id=\"myMask\">\n <rect {...maskSize} fill=\"white\" />\n </mask>\n <g id=\"marks\" mask=\"url('#myMask')\">\n <ChartComponent\n {...common}\n data={categories}\n defineChart={defineChart}\n onChange={this.changeData}\n onChangeCategory={this.changeCategory}\n />\n </g>\n </Root>\n </div>\n );\n }\n}\n\nconst styles = theme => ({\n graphBox: {\n transform: 'translate(60px, 35px)'\n },\n chart: {\n display: 'flex',\n flexDirection: 'column',\n width: 'min-content'\n },\n controls: {\n display: 'flex',\n justifyContent: 'space-between',\n padding: theme.spacing.unit,\n backgroundColor: color.primaryLight(),\n borderTop: `solid 1px ${color.primaryDark()}`,\n borderBottom: `solid 0px ${color.primaryDark()}`,\n borderLeft: `solid 1px ${color.primaryDark()}`,\n borderRight: `solid 1px ${color.primaryDark()}`\n },\n toolMenu: {\n minHeight: '36px'\n }\n});\n\nexport default withStyles(styles, { withTheme: true })(Chart);\n"],"file":"chart.js"}
|
package/package.json
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
"publishConfig": {
|
|
4
4
|
"access": "public"
|
|
5
5
|
},
|
|
6
|
-
"version": "5.1.
|
|
6
|
+
"version": "5.1.7",
|
|
7
7
|
"description": "charting",
|
|
8
8
|
"keywords": [
|
|
9
9
|
"react",
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
"dependencies": {
|
|
20
20
|
"@mapbox/point-geometry": "^0.1.0",
|
|
21
21
|
"@material-ui/core": "^3.8.3",
|
|
22
|
-
"@pie-lib/plot": "^2.4.
|
|
22
|
+
"@pie-lib/plot": "^2.4.2",
|
|
23
23
|
"@vx/axis": "^0.0.183",
|
|
24
24
|
"@vx/event": "^0.0.182",
|
|
25
25
|
"@vx/grid": "^0.0.183",
|
|
@@ -43,5 +43,5 @@
|
|
|
43
43
|
"peerDependencies": {
|
|
44
44
|
"react": "^16.8.1"
|
|
45
45
|
},
|
|
46
|
-
"gitHead": "
|
|
46
|
+
"gitHead": "0963c3d69d1b57497c4366de26056ca82a3a7aa2"
|
|
47
47
|
}
|
package/src/chart.jsx
CHANGED
|
@@ -196,7 +196,7 @@ export class Chart extends React.Component {
|
|
|
196
196
|
rootCommon.graphProps.size.height += top + increaseHeight;
|
|
197
197
|
|
|
198
198
|
return (
|
|
199
|
-
<div className={classNames(classes.
|
|
199
|
+
<div className={classNames(classes.chart, className)}>
|
|
200
200
|
<div className={classes.controls}>
|
|
201
201
|
<ToolMenu
|
|
202
202
|
className={classes.toolMenu}
|
|
@@ -250,8 +250,12 @@ const styles = theme => ({
|
|
|
250
250
|
graphBox: {
|
|
251
251
|
transform: 'translate(60px, 35px)'
|
|
252
252
|
},
|
|
253
|
+
chart: {
|
|
254
|
+
display: 'flex',
|
|
255
|
+
flexDirection: 'column',
|
|
256
|
+
width: 'min-content'
|
|
257
|
+
},
|
|
253
258
|
controls: {
|
|
254
|
-
width: 'inherit',
|
|
255
259
|
display: 'flex',
|
|
256
260
|
justifyContent: 'space-between',
|
|
257
261
|
padding: theme.spacing.unit,
|
|
@@ -261,12 +265,6 @@ const styles = theme => ({
|
|
|
261
265
|
borderLeft: `solid 1px ${color.primaryDark()}`,
|
|
262
266
|
borderRight: `solid 1px ${color.primaryDark()}`
|
|
263
267
|
},
|
|
264
|
-
root: {
|
|
265
|
-
overflow: 'hidden'
|
|
266
|
-
},
|
|
267
|
-
svg: {
|
|
268
|
-
overflow: 'visible'
|
|
269
|
-
},
|
|
270
268
|
toolMenu: {
|
|
271
269
|
minHeight: '36px'
|
|
272
270
|
}
|