@devexpress/dx-react-chart
Advanced tools
Comparing version 1.6.1 to 1.7.0
@@ -21,16 +21,2 @@ import * as React from 'react'; | ||
export namespace AreaSeries { | ||
/** Describes properties passed to a component that renders a series point. */ | ||
export interface PointProps { | ||
/** The point's x coordinate. */ | ||
x: number; | ||
/** The point's y coordinate. */ | ||
y: number; | ||
/** The point's path(https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/d). */ | ||
d: string; | ||
/** The point's value. */ | ||
value: number; | ||
} | ||
} | ||
export interface AreaSeriesProps { | ||
@@ -47,8 +33,4 @@ /** A series name. */ | ||
stack?: string; | ||
/** Point options. */ | ||
point?: { size : number }; | ||
/** A component that renders the series. */ | ||
seriesComponent: React.ComponentType<AreaSeries.SeriesProps>; | ||
/** A component that renders a series point. */ | ||
pointComponent: React.ComponentType<AreaSeries.PointProps>; | ||
} | ||
@@ -299,16 +281,2 @@ | ||
export namespace LineSeries { | ||
/** Describes properties passed to a component that renders a point. */ | ||
export interface PointProps { | ||
/** The point's x coordinate. */ | ||
x: number; | ||
/** The point's y coordinate. */ | ||
y: number; | ||
/** The point's path(https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/d). */ | ||
d: string; | ||
/** The point's value. */ | ||
value: number; | ||
} | ||
} | ||
export interface LineSeriesProps { | ||
@@ -325,8 +293,4 @@ /** A series name. */ | ||
stack?: string; | ||
/** Point options. */ | ||
point?: { size : number }; | ||
/** A component that renders the series. */ | ||
seriesComponent: React.ComponentType<LineSeries.SeriesProps>; | ||
/** A component that renders a point. */ | ||
pointComponent: React.ComponentType<LineSeries.PointProps>; | ||
} | ||
@@ -391,2 +355,14 @@ | ||
export namespace ScatterSeries { | ||
/** Describes properties passed to a component that renders the series. */ | ||
export interface SeriesProps { | ||
/** A component that renders a series point. */ | ||
pointComponent: React.ComponentType<ScatterSeries.PointProps>; | ||
/** Coordinates of the series' points. */ | ||
coordinates: Array<{ x: number, y: number }>; | ||
/** Point options. */ | ||
point?: { size : number }; | ||
} | ||
} | ||
export interface ScatterSeriesProps { | ||
@@ -428,16 +404,2 @@ /** A series name. */ | ||
export namespace SplineSeries { | ||
/** Describes properties passed to a component that renders the point. */ | ||
export interface PointProps { | ||
/** The point's x coordinate. */ | ||
x: number; | ||
/** The point's y coordinate. */ | ||
y: number; | ||
/** The point's path(https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/d). */ | ||
d: string; | ||
/** The point's value. */ | ||
value: number; | ||
} | ||
} | ||
export interface SplineSeriesProps { | ||
@@ -454,8 +416,4 @@ /** A series name. */ | ||
stack?: string; | ||
/** Point options. */ | ||
point?: { size : number }; | ||
/** A component that renders the series. */ | ||
seriesComponent: React.ComponentType<SplineSeries.SeriesProps>; | ||
/** A component that renders a series point. */ | ||
pointComponent: React.ComponentType<SplineSeries.PointProps>; | ||
} | ||
@@ -462,0 +420,0 @@ |
/** | ||
* Bundle of @devexpress/dx-react-chart | ||
* Generated: 2018-08-21 | ||
* Version: 1.6.1 | ||
* Generated: 2018-08-23 | ||
* Version: 1.7.0 | ||
* License: https://js.devexpress.com/Licensing | ||
@@ -11,3 +11,3 @@ */ | ||
import { Action, Getter, Plugin, PluginHost, Sizer, Template, TemplateConnector, TemplatePlaceholder, createStateHelper } from '@devexpress/dx-react-core'; | ||
import { BOTTOM, HORIZONTAL, LEFT, RIGHT, TOP, axesData, axisCoordinates, axisName, bBoxes, barPointAttributes, checkZeroStart, coordinates, domains, findSeriesByName, lineAttributes, palette, pieAttributes, pointAttributes, prepareData, processData, seriesData, seriesWithStacks, stacks, xyScales } from '@devexpress/dx-chart-core'; | ||
import { BOTTOM, HORIZONTAL, LEFT, RIGHT, TOP, axesData, axisCoordinates, axisName, bBoxes, barCoordinates, checkZeroStart, coordinates, dArea, dBar, dLine, dSpline, domains, findSeriesByName, palette, pieAttributes, pointAttributes, prepareData, processData, seriesData, seriesWithStacks, stacks, xyScales } from '@devexpress/dx-chart-core'; | ||
import { stackOffsetDiverging, stackOrderNone } from 'd3-shape'; | ||
@@ -297,5 +297,5 @@ | ||
ChartCore.propTypes = { | ||
process.env.NODE_ENV !== "production" ? ChartCore.propTypes = { | ||
data: array.isRequired | ||
}; | ||
} : void 0; | ||
@@ -383,5 +383,5 @@ var AxesLayout = function AxesLayout() { | ||
SpaceFillingRects.propTypes = { | ||
process.env.NODE_ENV !== "production" ? SpaceFillingRects.propTypes = { | ||
placeholders: arrayOf(string).isRequired | ||
}; | ||
} : void 0; | ||
@@ -448,7 +448,7 @@ var Pane = function (_React$PureComponent) { | ||
Pane.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Pane.propTypes = { | ||
changeBBox: func.isRequired, | ||
width: number.isRequired, | ||
height: number.isRequired | ||
}; | ||
} : void 0; | ||
@@ -557,7 +557,7 @@ /* eslint-disable-next-line react/prefer-stateless-function */ | ||
LayoutManager.propTypes = { | ||
process.env.NODE_ENV !== "production" ? LayoutManager.propTypes = { | ||
width: number, | ||
height: number.isRequired, | ||
rootComponent: func.isRequired | ||
}; | ||
} : void 0; | ||
@@ -620,2 +620,9 @@ LayoutManager.defaultProps = { | ||
}; | ||
var pieThemeComputing = function pieThemeComputing(_ref2) { | ||
var domains$$1 = _ref2.domains, | ||
argumentAxisName = _ref2.argumentAxisName; | ||
return palette(domains$$1[argumentAxisName].domain.map(function (uniqueName) { | ||
return { uniqueName: uniqueName }; | ||
})); | ||
}; | ||
@@ -626,3 +633,4 @@ var ThemeManager = function ThemeManager() { | ||
{ name: 'ThemeManager' }, | ||
createElement(Getter, { name: 'series', computed: themeComputing }) | ||
createElement(Getter, { name: 'colorDomain', computed: themeComputing }), | ||
createElement(Getter, { name: 'pieColorDomain', computed: pieThemeComputing }) | ||
); | ||
@@ -672,3 +680,3 @@ }; | ||
}(PureComponent); | ||
Chart.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Chart.propTypes = { | ||
data: array.isRequired, | ||
@@ -679,3 +687,3 @@ rootComponent: func.isRequired, | ||
children: node | ||
}; | ||
} : void 0; | ||
@@ -718,13 +726,19 @@ Chart.defaultProps = { | ||
function (_ref) { | ||
var series = _ref.series; | ||
var series = _ref.series, | ||
colorDomain = _ref.colorDomain; | ||
return createElement( | ||
Root, | ||
{ name: 'legend-' + placeholder }, | ||
series.map(function (_ref2) { | ||
var name = _ref2.name, | ||
themeColor = _ref2.themeColor; | ||
colorDomain.domain().map(function (domainName) { | ||
var _series$find = series.find(function (_ref2) { | ||
var uniqueName = _ref2.uniqueName; | ||
return uniqueName === domainName; | ||
}), | ||
name = _series$find.name, | ||
color = _series$find.color; | ||
return createElement( | ||
Item, | ||
{ key: name + themeColor }, | ||
createElement(Marker, { name: name, themeColor: themeColor }), | ||
{ key: domainName }, | ||
createElement(Marker, { name: name, color: color || colorDomain(domainName) }), | ||
createElement(Label, { text: name }) | ||
@@ -743,3 +757,3 @@ ); | ||
Legend.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Legend.propTypes = { | ||
markerComponent: func.isRequired, | ||
@@ -750,3 +764,3 @@ labelComponent: func.isRequired, | ||
position: string | ||
}; | ||
} : void 0; | ||
@@ -790,7 +804,7 @@ Legend.defaultProps = { | ||
Title.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Title.propTypes = { | ||
textComponent: func.isRequired, | ||
text: string.isRequired, | ||
position: string | ||
}; | ||
} : void 0; | ||
@@ -840,6 +854,6 @@ Title.defaultProps = { | ||
Stack.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Stack.propTypes = { | ||
offset: func, | ||
order: func | ||
}; | ||
} : void 0; | ||
@@ -851,3 +865,3 @@ Stack.defaultProps = { | ||
var withSeriesPlugin = function withSeriesPlugin(Path, Point, pluginName, pathType, processLine, processPoint, extraOptions) { | ||
var withSeriesPlugin = function withSeriesPlugin(Series, pluginName, pathType, calculateCoordinates) { | ||
var Component$$1 = function (_React$PureComponent) { | ||
@@ -870,10 +884,19 @@ inherits(Component$$1, _React$PureComponent); | ||
stackProp = _props.stack, | ||
restProps = objectWithoutProperties(_props, ['name', 'valueField', 'argumentField', 'axisName', 'stack']); | ||
color = _props.color, | ||
groupWidth = _props.groupWidth, | ||
restProps = objectWithoutProperties(_props, ['name', 'valueField', 'argumentField', 'axisName', 'stack', 'color', 'groupWidth']); | ||
var uniqueName = Symbol(name); | ||
var symbolName = Symbol(name); | ||
var getSeriesDataComputed = function getSeriesDataComputed(_ref) { | ||
var series = _ref.series; | ||
return seriesData(series, { | ||
valueField: valueField, argumentField: argumentField, name: name, uniqueName: uniqueName, axisName: axisName$$1, stack: stackProp | ||
valueField: valueField, | ||
argumentField: argumentField, | ||
name: name, | ||
symbolName: symbolName, | ||
axisName: axisName$$1, | ||
stack: stackProp, | ||
color: color, | ||
uniqueName: name | ||
}); | ||
@@ -904,27 +927,19 @@ }; | ||
argumentAxisName = _ref3.argumentAxisName, | ||
layouts = _ref3.layouts; | ||
layouts = _ref3.layouts, | ||
colorDomain = _ref3.colorDomain, | ||
pieColorDomain = _ref3.pieColorDomain; | ||
var _findSeriesByName = findSeriesByName(uniqueName, series), | ||
var _findSeriesByName = findSeriesByName(symbolName, series), | ||
stack = _findSeriesByName.stack, | ||
themeColor = _findSeriesByName.themeColor; | ||
uniqueName = _findSeriesByName.uniqueName; | ||
var options = extraOptions(_extends({}, restProps)); | ||
var scales = xyScales(domains$$1, argumentAxisName, axisName$$1, layouts.pane, stacks$$1, options); | ||
var coord = coordinates(data, scales, argumentField, valueField, name); | ||
var pointParameters = processPoint(scales, options, stack); | ||
return createElement( | ||
Fragment, | ||
null, | ||
createElement(Path, _extends({ | ||
themeColor: themeColor, | ||
coordinates: coord | ||
}, processLine(pathType, scales), restProps)), | ||
coord.map(function (item) { | ||
return createElement(Point, _extends({ | ||
themeColor: themeColor, | ||
key: item.id.toString(), | ||
value: item.value | ||
}, pointParameters(item), restProps)); | ||
}) | ||
); | ||
var scales = xyScales(domains$$1[argumentAxisName], domains$$1[axisName$$1], layouts.pane, groupWidth); | ||
var calculatedCoordinates = calculateCoordinates(data, scales, argumentField, valueField, name, stack, stacks$$1, restProps); | ||
return createElement(Series, _extends({ | ||
uniqueName: uniqueName, | ||
colorDomain: pluginName === 'PieSeries' ? pieColorDomain : colorDomain, | ||
coordinates: calculatedCoordinates, | ||
color: color | ||
}, restProps)); | ||
} | ||
@@ -939,3 +954,3 @@ ) | ||
Component$$1.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Component$$1.propTypes = { | ||
name: string, | ||
@@ -945,8 +960,12 @@ valueField: string.isRequired, | ||
axisName: string, | ||
stack: string | ||
}; | ||
stack: string, | ||
color: string, | ||
groupWidth: number | ||
} : void 0; | ||
Component$$1.defaultProps = { | ||
name: 'defaultSeriesName', | ||
color: undefined, | ||
axisName: undefined, | ||
stack: undefined | ||
stack: undefined, | ||
groupWidth: 0.7 | ||
}; | ||
@@ -956,31 +975,46 @@ return Component$$1; | ||
var EmptyFunction = function EmptyFunction() { | ||
return null; | ||
var withColor = function withColor(Series) { | ||
var ColorizedSeries = function ColorizedSeries(_ref) { | ||
var colorDomain = _ref.colorDomain, | ||
uniqueName = _ref.uniqueName, | ||
seriesColor = _ref.color, | ||
restProps = objectWithoutProperties(_ref, ['colorDomain', 'uniqueName', 'color']); | ||
var color = colorDomain(uniqueName); | ||
return createElement(Series, _extends({ color: seriesColor || color }, restProps)); | ||
}; | ||
process.env.NODE_ENV !== "production" ? ColorizedSeries.propTypes = { | ||
color: string, | ||
colorDomain: func.isRequired, | ||
uniqueName: string.isRequired | ||
} : void 0; | ||
ColorizedSeries.defaultProps = { | ||
color: undefined | ||
}; | ||
return ColorizedSeries; | ||
}; | ||
var Dot = function Dot(_ref) { | ||
var Series = function Series(_ref) { | ||
var props = objectWithoutProperties(_ref, []); | ||
var Point = props.pointComponent, | ||
restProps = objectWithoutProperties(props, ['pointComponent']); | ||
coordinates$$1 = props.coordinates, | ||
path = props.path, | ||
barWidth = props.barWidth, | ||
restProps = objectWithoutProperties(props, ['pointComponent', 'coordinates', 'path', 'barWidth']); | ||
return createElement(Point, restProps); | ||
return coordinates$$1.map(function (item) { | ||
return createElement(Point, _extends({ | ||
key: item.id.toString() | ||
}, item, dBar(item), restProps)); | ||
}); | ||
}; | ||
var options = function options(_ref2) { | ||
var props = objectWithoutProperties(_ref2, []); | ||
var _props$barWidth = props.barWidth, | ||
barWidth = _props$barWidth === undefined ? 0.9 : _props$barWidth, | ||
_props$groupWidth = props.groupWidth, | ||
groupWidth = _props$groupWidth === undefined ? 0.7 : _props$groupWidth; | ||
var BarSeries = withSeriesPlugin(withColor(Series), 'BarSeries', 'bar', barCoordinates); | ||
return { barWidth: barWidth, groupWidth: groupWidth }; | ||
}; | ||
var BarSeries = withSeriesPlugin(EmptyFunction, Dot, 'BarSeries', 'bar', EmptyFunction, barPointAttributes, options); | ||
Dot.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Series.propTypes = { | ||
pointComponent: func.isRequired | ||
}; | ||
} : void 0; | ||
var Series = function Series(_ref) { | ||
var Series$1 = function Series(_ref) { | ||
var props = objectWithoutProperties(_ref, []); | ||
@@ -990,40 +1024,12 @@ var Path = props.seriesComponent, | ||
return createElement(Path, restProps); | ||
return createElement(Path, _extends({}, restProps, { path: dLine })); | ||
}; | ||
var Dot$1 = function Dot(_ref2) { | ||
var props = objectWithoutProperties(_ref2, []); | ||
var pointStyle = props.pointStyle, | ||
Point = props.pointComponent, | ||
restProps = objectWithoutProperties(props, ['pointStyle', 'pointComponent']); | ||
var LineSeries = withSeriesPlugin(withColor(Series$1), 'LineSeries', 'line', coordinates); | ||
return createElement(Point, _extends({}, restProps, { | ||
style: pointStyle | ||
})); | ||
}; | ||
var options$1 = function options(_ref3) { | ||
var props = objectWithoutProperties(_ref3, []); | ||
var _props$point = props.point, | ||
point = _props$point === undefined ? {} : _props$point; | ||
return { size: point.size }; | ||
}; | ||
var LineSeries = withSeriesPlugin(Series, Dot$1, 'LineSeries', 'line', lineAttributes, pointAttributes, options$1); | ||
Series.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Series$1.propTypes = { | ||
seriesComponent: func.isRequired | ||
}; | ||
} : void 0; | ||
Dot$1.propTypes = { | ||
pointStyle: object, | ||
pointComponent: func.isRequired | ||
}; | ||
Dot$1.defaultProps = { | ||
pointStyle: {} | ||
}; | ||
var Series$1 = function Series(_ref) { | ||
var Series$2 = function Series(_ref) { | ||
var props = objectWithoutProperties(_ref, []); | ||
@@ -1033,66 +1039,53 @@ var Path = props.seriesComponent, | ||
return createElement(Path, restProps); | ||
return createElement(Path, _extends({}, restProps, { path: dSpline })); | ||
}; | ||
var Dot$2 = function Dot(_ref2) { | ||
var props = objectWithoutProperties(_ref2, []); | ||
var pointStyle = props.pointStyle, | ||
Point = props.pointComponent, | ||
restProps = objectWithoutProperties(props, ['pointStyle', 'pointComponent']); | ||
var SplineSeries = withSeriesPlugin(withColor(Series$2), 'SplineSeries', 'spline', coordinates); | ||
return createElement(Point, _extends({}, restProps, { | ||
style: pointStyle | ||
})); | ||
}; | ||
var options$2 = function options(_ref3) { | ||
var props = objectWithoutProperties(_ref3, []); | ||
var _props$point = props.point, | ||
point = _props$point === undefined ? {} : _props$point; | ||
return { size: point.size }; | ||
}; | ||
var SplineSeries = withSeriesPlugin(Series$1, Dot$2, 'SplineSeries', 'spline', lineAttributes, pointAttributes, options$2); | ||
Series$1.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Series$2.propTypes = { | ||
seriesComponent: func.isRequired | ||
}; | ||
} : void 0; | ||
Dot$2.propTypes = { | ||
pointStyle: object, | ||
pointComponent: func.isRequired | ||
}; | ||
var Series$3 = function Series(_ref) { | ||
var props = objectWithoutProperties(_ref, []); | ||
var Point = props.pointComponent, | ||
coordinates$$1 = props.coordinates, | ||
_props$point = props.point, | ||
point = _props$point === undefined ? {} : _props$point, | ||
restProps = objectWithoutProperties(props, ['pointComponent', 'coordinates', 'point']); | ||
Dot$2.defaultProps = { | ||
pointStyle: {} | ||
var getAttributes = pointAttributes(point); | ||
return coordinates$$1.map(function (item) { | ||
return createElement(Point, _extends({ | ||
key: item.id.toString() | ||
}, getAttributes(item), item, restProps)); | ||
}); | ||
}; | ||
var EmptyFunction$1 = function EmptyFunction() { | ||
return null; | ||
var BaseSeries = function BaseSeries(_ref2) { | ||
var Path = _ref2.Path, | ||
path = _ref2.path, | ||
props = objectWithoutProperties(_ref2, ['Path', 'path']); | ||
return createElement(Path, props); | ||
}; | ||
var Dot$3 = function Dot(_ref) { | ||
var props = objectWithoutProperties(_ref, []); | ||
var Point = props.pointComponent, | ||
restProps = objectWithoutProperties(props, ['pointComponent']); | ||
process.env.NODE_ENV !== "production" ? BaseSeries.propTypes = { | ||
Path: func, | ||
path: func | ||
} : void 0; | ||
return createElement(Point, restProps); | ||
BaseSeries.defaultProps = { | ||
Path: Series$3, | ||
path: null | ||
}; | ||
var options$3 = function options(_ref2) { | ||
var props = objectWithoutProperties(_ref2, []); | ||
var _props$point = props.point, | ||
point = _props$point === undefined ? {} : _props$point; | ||
var ScatterSeries = withSeriesPlugin(withColor(BaseSeries), 'ScatterSeries', 'scatter', coordinates); | ||
return { size: point.size }; | ||
}; | ||
ScatterSeries.Path = Series$3; | ||
var ScatterSeries = withSeriesPlugin(EmptyFunction$1, Dot$3, 'ScatterSeries', 'scatter', EmptyFunction$1, pointAttributes, options$3); | ||
Dot$3.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Series$3.propTypes = { | ||
pointComponent: func.isRequired | ||
}; | ||
} : void 0; | ||
var Series$2 = function Series(_ref) { | ||
var Series$4 = function Series(_ref) { | ||
var props = objectWithoutProperties(_ref, []); | ||
@@ -1102,126 +1095,44 @@ var Path = props.seriesComponent, | ||
return createElement(Path, restProps); | ||
return createElement(Path, _extends({ | ||
path: dArea | ||
}, restProps)); | ||
}; | ||
var Dot$4 = function Dot(_ref2) { | ||
var props = objectWithoutProperties(_ref2, []); | ||
var pointStyle = props.pointStyle, | ||
Point = props.pointComponent, | ||
restProps = objectWithoutProperties(props, ['pointStyle', 'pointComponent']); | ||
var AreaSeries = withSeriesPlugin(withColor(Series$4), 'AreaSeries', 'area', coordinates); | ||
return createElement(Point, _extends({}, restProps, { | ||
style: pointStyle | ||
})); | ||
}; | ||
process.env.NODE_ENV !== "production" ? Series$4.propTypes = { | ||
seriesComponent: func.isRequired | ||
} : void 0; | ||
var options$4 = function options(_ref3) { | ||
var props = objectWithoutProperties(_ref3, []); | ||
var _props$point = props.point, | ||
point = _props$point === undefined ? {} : _props$point; | ||
var Series$5 = function Series(_ref) { | ||
var props = objectWithoutProperties(_ref, []); | ||
var Point = props.pointComponent, | ||
coordinates$$1 = props.coordinates, | ||
colorDomain = props.colorDomain, | ||
uniqueName = props.uniqueName, | ||
restProps = objectWithoutProperties(props, ['pointComponent', 'coordinates', 'colorDomain', 'uniqueName']); | ||
var innerRadius = restProps.innerRadius, | ||
outerRadius = restProps.outerRadius, | ||
pointOptions = objectWithoutProperties(restProps, ['innerRadius', 'outerRadius']); | ||
return { size: point.size }; | ||
return coordinates$$1.map(function (item) { | ||
return createElement(Point, _extends({ | ||
key: item.id.toString() | ||
}, item, pointOptions, { | ||
color: colorDomain(item.id) | ||
})); | ||
}); | ||
}; | ||
var AreaSeries = withSeriesPlugin(Series$2, Dot$4, 'AreaSeries', 'area', lineAttributes, pointAttributes, options$4); | ||
var PieSeries = withSeriesPlugin(Series$5, 'PieSeries', 'arc', pieAttributes); | ||
Series$2.propTypes = { | ||
seriesComponent: func.isRequired | ||
}; | ||
Dot$4.propTypes = { | ||
pointStyle: object, | ||
process.env.NODE_ENV !== "production" ? Series$5.propTypes = { | ||
style: object, | ||
pointComponent: func.isRequired | ||
}; | ||
} : void 0; | ||
Dot$4.defaultProps = { | ||
pointStyle: {} | ||
Series$5.defaultProps = { | ||
style: {} | ||
}; | ||
var PieSeries = function (_React$PureComponent) { | ||
inherits(PieSeries, _React$PureComponent); | ||
function PieSeries() { | ||
classCallCheck(this, PieSeries); | ||
return possibleConstructorReturn(this, (PieSeries.__proto__ || Object.getPrototypeOf(PieSeries)).apply(this, arguments)); | ||
} | ||
createClass(PieSeries, [{ | ||
key: 'render', | ||
value: function render() { | ||
var _props = this.props, | ||
name = _props.name, | ||
innerRadius = _props.innerRadius, | ||
outerRadius = _props.outerRadius, | ||
cx = _props.cx, | ||
cy = _props.cy, | ||
Point = _props.pointComponent, | ||
valueField = _props.valueField, | ||
argumentField = _props.argumentField, | ||
restProps = objectWithoutProperties(_props, ['name', 'innerRadius', 'outerRadius', 'cx', 'cy', 'pointComponent', 'valueField', 'argumentField']); | ||
var getSeriesDataComputed = function getSeriesDataComputed(_ref) { | ||
var series = _ref.series; | ||
return seriesData(series, { | ||
valueField: valueField, argumentField: argumentField, name: name | ||
}); | ||
}; | ||
return createElement( | ||
Plugin, | ||
{ name: 'PieSeries' }, | ||
createElement(Getter, { name: 'series', computed: getSeriesDataComputed }), | ||
createElement( | ||
Template, | ||
{ name: 'series' }, | ||
createElement(TemplatePlaceholder, null), | ||
createElement( | ||
TemplateConnector, | ||
null, | ||
function (_ref2) { | ||
var data = _ref2.data, | ||
layouts = _ref2.layouts; | ||
var _layouts$pane = layouts.pane, | ||
widthPane = _layouts$pane.width, | ||
heightPane = _layouts$pane.height; | ||
var arcs = pieAttributes(valueField, data, widthPane, heightPane, innerRadius, outerRadius); | ||
var colors = palette(Array.from(arcs)); | ||
return arcs.map(function (item, index) { | ||
return createElement(Point, _extends({ | ||
fill: colors[index].themeColor, | ||
key: item.value, | ||
x: cx || widthPane / 2, | ||
y: cy || heightPane / 2, | ||
value: item.value, | ||
d: item.d | ||
}, restProps)); | ||
}); | ||
} | ||
) | ||
) | ||
); | ||
} | ||
}]); | ||
return PieSeries; | ||
}(PureComponent); | ||
PieSeries.propTypes = { | ||
name: string, | ||
pointComponent: func.isRequired, | ||
innerRadius: number, | ||
outerRadius: number, | ||
cx: number, | ||
cy: number, | ||
valueField: string.isRequired, | ||
argumentField: string.isRequired | ||
}; | ||
PieSeries.defaultProps = { | ||
name: 'defaultSeriesName', | ||
innerRadius: 0, | ||
outerRadius: undefined, | ||
cx: undefined, | ||
cy: undefined | ||
}; | ||
var Axis = function (_React$Component) { | ||
@@ -1429,3 +1340,3 @@ inherits(Axis, _React$Component); | ||
Axis.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Axis.propTypes = { | ||
name: string, | ||
@@ -1440,3 +1351,3 @@ isArgumentAxis: bool, | ||
indentFromAxis: number | ||
}; | ||
} : void 0; | ||
@@ -1516,6 +1427,6 @@ Axis.defaultProps = { | ||
Grid.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Grid.propTypes = { | ||
name: string, | ||
lineComponent: func.isRequired | ||
}; | ||
} : void 0; | ||
@@ -1522,0 +1433,0 @@ Grid.defaultProps = { |
/** | ||
* Bundle of @devexpress/dx-react-chart | ||
* Generated: 2018-08-21 | ||
* Version: 1.6.1 | ||
* Generated: 2018-08-23 | ||
* Version: 1.7.0 | ||
* License: https://js.devexpress.com/Licensing | ||
@@ -296,5 +296,5 @@ */ | ||
ChartCore.propTypes = { | ||
process.env.NODE_ENV !== "production" ? ChartCore.propTypes = { | ||
data: PropTypes.array.isRequired | ||
}; | ||
} : void 0; | ||
@@ -382,5 +382,5 @@ var AxesLayout = function AxesLayout() { | ||
SpaceFillingRects.propTypes = { | ||
process.env.NODE_ENV !== "production" ? SpaceFillingRects.propTypes = { | ||
placeholders: PropTypes.arrayOf(PropTypes.string).isRequired | ||
}; | ||
} : void 0; | ||
@@ -447,7 +447,7 @@ var Pane = function (_React$PureComponent) { | ||
Pane.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Pane.propTypes = { | ||
changeBBox: PropTypes.func.isRequired, | ||
width: PropTypes.number.isRequired, | ||
height: PropTypes.number.isRequired | ||
}; | ||
} : void 0; | ||
@@ -556,7 +556,7 @@ /* eslint-disable-next-line react/prefer-stateless-function */ | ||
LayoutManager.propTypes = { | ||
process.env.NODE_ENV !== "production" ? LayoutManager.propTypes = { | ||
width: PropTypes.number, | ||
height: PropTypes.number.isRequired, | ||
rootComponent: PropTypes.func.isRequired | ||
}; | ||
} : void 0; | ||
@@ -619,2 +619,9 @@ LayoutManager.defaultProps = { | ||
}; | ||
var pieThemeComputing = function pieThemeComputing(_ref2) { | ||
var domains$$1 = _ref2.domains, | ||
argumentAxisName = _ref2.argumentAxisName; | ||
return dxChartCore.palette(domains$$1[argumentAxisName].domain.map(function (uniqueName) { | ||
return { uniqueName: uniqueName }; | ||
})); | ||
}; | ||
@@ -625,3 +632,4 @@ var ThemeManager = function ThemeManager() { | ||
{ name: 'ThemeManager' }, | ||
React.createElement(dxReactCore.Getter, { name: 'series', computed: themeComputing }) | ||
React.createElement(dxReactCore.Getter, { name: 'colorDomain', computed: themeComputing }), | ||
React.createElement(dxReactCore.Getter, { name: 'pieColorDomain', computed: pieThemeComputing }) | ||
); | ||
@@ -671,3 +679,3 @@ }; | ||
}(React.PureComponent); | ||
Chart.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Chart.propTypes = { | ||
data: PropTypes.array.isRequired, | ||
@@ -678,3 +686,3 @@ rootComponent: PropTypes.func.isRequired, | ||
children: PropTypes.node | ||
}; | ||
} : void 0; | ||
@@ -717,13 +725,19 @@ Chart.defaultProps = { | ||
function (_ref) { | ||
var series = _ref.series; | ||
var series = _ref.series, | ||
colorDomain = _ref.colorDomain; | ||
return React.createElement( | ||
Root, | ||
{ name: 'legend-' + placeholder }, | ||
series.map(function (_ref2) { | ||
var name = _ref2.name, | ||
themeColor = _ref2.themeColor; | ||
colorDomain.domain().map(function (domainName) { | ||
var _series$find = series.find(function (_ref2) { | ||
var uniqueName = _ref2.uniqueName; | ||
return uniqueName === domainName; | ||
}), | ||
name = _series$find.name, | ||
color = _series$find.color; | ||
return React.createElement( | ||
Item, | ||
{ key: name + themeColor }, | ||
React.createElement(Marker, { name: name, themeColor: themeColor }), | ||
{ key: domainName }, | ||
React.createElement(Marker, { name: name, color: color || colorDomain(domainName) }), | ||
React.createElement(Label, { text: name }) | ||
@@ -742,3 +756,3 @@ ); | ||
Legend.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Legend.propTypes = { | ||
markerComponent: PropTypes.func.isRequired, | ||
@@ -749,3 +763,3 @@ labelComponent: PropTypes.func.isRequired, | ||
position: PropTypes.string | ||
}; | ||
} : void 0; | ||
@@ -789,7 +803,7 @@ Legend.defaultProps = { | ||
Title.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Title.propTypes = { | ||
textComponent: PropTypes.func.isRequired, | ||
text: PropTypes.string.isRequired, | ||
position: PropTypes.string | ||
}; | ||
} : void 0; | ||
@@ -839,6 +853,6 @@ Title.defaultProps = { | ||
Stack.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Stack.propTypes = { | ||
offset: PropTypes.func, | ||
order: PropTypes.func | ||
}; | ||
} : void 0; | ||
@@ -850,3 +864,3 @@ Stack.defaultProps = { | ||
var withSeriesPlugin = function withSeriesPlugin(Path, Point, pluginName, pathType, processLine, processPoint, extraOptions) { | ||
var withSeriesPlugin = function withSeriesPlugin(Series, pluginName, pathType, calculateCoordinates) { | ||
var Component$$1 = function (_React$PureComponent) { | ||
@@ -869,10 +883,19 @@ inherits(Component$$1, _React$PureComponent); | ||
stackProp = _props.stack, | ||
restProps = objectWithoutProperties(_props, ['name', 'valueField', 'argumentField', 'axisName', 'stack']); | ||
color = _props.color, | ||
groupWidth = _props.groupWidth, | ||
restProps = objectWithoutProperties(_props, ['name', 'valueField', 'argumentField', 'axisName', 'stack', 'color', 'groupWidth']); | ||
var uniqueName = Symbol(name); | ||
var symbolName = Symbol(name); | ||
var getSeriesDataComputed = function getSeriesDataComputed(_ref) { | ||
var series = _ref.series; | ||
return dxChartCore.seriesData(series, { | ||
valueField: valueField, argumentField: argumentField, name: name, uniqueName: uniqueName, axisName: axisName$$1, stack: stackProp | ||
valueField: valueField, | ||
argumentField: argumentField, | ||
name: name, | ||
symbolName: symbolName, | ||
axisName: axisName$$1, | ||
stack: stackProp, | ||
color: color, | ||
uniqueName: name | ||
}); | ||
@@ -903,27 +926,19 @@ }; | ||
argumentAxisName = _ref3.argumentAxisName, | ||
layouts = _ref3.layouts; | ||
layouts = _ref3.layouts, | ||
colorDomain = _ref3.colorDomain, | ||
pieColorDomain = _ref3.pieColorDomain; | ||
var _findSeriesByName = dxChartCore.findSeriesByName(uniqueName, series), | ||
var _findSeriesByName = dxChartCore.findSeriesByName(symbolName, series), | ||
stack = _findSeriesByName.stack, | ||
themeColor = _findSeriesByName.themeColor; | ||
uniqueName = _findSeriesByName.uniqueName; | ||
var options = extraOptions(_extends({}, restProps)); | ||
var scales = dxChartCore.xyScales(domains$$1, argumentAxisName, axisName$$1, layouts.pane, stacks$$1, options); | ||
var coord = dxChartCore.coordinates(data, scales, argumentField, valueField, name); | ||
var pointParameters = processPoint(scales, options, stack); | ||
return React.createElement( | ||
React.Fragment, | ||
null, | ||
React.createElement(Path, _extends({ | ||
themeColor: themeColor, | ||
coordinates: coord | ||
}, processLine(pathType, scales), restProps)), | ||
coord.map(function (item) { | ||
return React.createElement(Point, _extends({ | ||
themeColor: themeColor, | ||
key: item.id.toString(), | ||
value: item.value | ||
}, pointParameters(item), restProps)); | ||
}) | ||
); | ||
var scales = dxChartCore.xyScales(domains$$1[argumentAxisName], domains$$1[axisName$$1], layouts.pane, groupWidth); | ||
var calculatedCoordinates = calculateCoordinates(data, scales, argumentField, valueField, name, stack, stacks$$1, restProps); | ||
return React.createElement(Series, _extends({ | ||
uniqueName: uniqueName, | ||
colorDomain: pluginName === 'PieSeries' ? pieColorDomain : colorDomain, | ||
coordinates: calculatedCoordinates, | ||
color: color | ||
}, restProps)); | ||
} | ||
@@ -938,3 +953,3 @@ ) | ||
Component$$1.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Component$$1.propTypes = { | ||
name: PropTypes.string, | ||
@@ -944,8 +959,12 @@ valueField: PropTypes.string.isRequired, | ||
axisName: PropTypes.string, | ||
stack: PropTypes.string | ||
}; | ||
stack: PropTypes.string, | ||
color: PropTypes.string, | ||
groupWidth: PropTypes.number | ||
} : void 0; | ||
Component$$1.defaultProps = { | ||
name: 'defaultSeriesName', | ||
color: undefined, | ||
axisName: undefined, | ||
stack: undefined | ||
stack: undefined, | ||
groupWidth: 0.7 | ||
}; | ||
@@ -955,31 +974,46 @@ return Component$$1; | ||
var EmptyFunction = function EmptyFunction() { | ||
return null; | ||
var withColor = function withColor(Series) { | ||
var ColorizedSeries = function ColorizedSeries(_ref) { | ||
var colorDomain = _ref.colorDomain, | ||
uniqueName = _ref.uniqueName, | ||
seriesColor = _ref.color, | ||
restProps = objectWithoutProperties(_ref, ['colorDomain', 'uniqueName', 'color']); | ||
var color = colorDomain(uniqueName); | ||
return React.createElement(Series, _extends({ color: seriesColor || color }, restProps)); | ||
}; | ||
process.env.NODE_ENV !== "production" ? ColorizedSeries.propTypes = { | ||
color: PropTypes.string, | ||
colorDomain: PropTypes.func.isRequired, | ||
uniqueName: PropTypes.string.isRequired | ||
} : void 0; | ||
ColorizedSeries.defaultProps = { | ||
color: undefined | ||
}; | ||
return ColorizedSeries; | ||
}; | ||
var Dot = function Dot(_ref) { | ||
var Series = function Series(_ref) { | ||
var props = objectWithoutProperties(_ref, []); | ||
var Point = props.pointComponent, | ||
restProps = objectWithoutProperties(props, ['pointComponent']); | ||
coordinates$$1 = props.coordinates, | ||
path = props.path, | ||
barWidth = props.barWidth, | ||
restProps = objectWithoutProperties(props, ['pointComponent', 'coordinates', 'path', 'barWidth']); | ||
return React.createElement(Point, restProps); | ||
return coordinates$$1.map(function (item) { | ||
return React.createElement(Point, _extends({ | ||
key: item.id.toString() | ||
}, item, dxChartCore.dBar(item), restProps)); | ||
}); | ||
}; | ||
var options = function options(_ref2) { | ||
var props = objectWithoutProperties(_ref2, []); | ||
var _props$barWidth = props.barWidth, | ||
barWidth = _props$barWidth === undefined ? 0.9 : _props$barWidth, | ||
_props$groupWidth = props.groupWidth, | ||
groupWidth = _props$groupWidth === undefined ? 0.7 : _props$groupWidth; | ||
var BarSeries = withSeriesPlugin(withColor(Series), 'BarSeries', 'bar', dxChartCore.barCoordinates); | ||
return { barWidth: barWidth, groupWidth: groupWidth }; | ||
}; | ||
var BarSeries = withSeriesPlugin(EmptyFunction, Dot, 'BarSeries', 'bar', EmptyFunction, dxChartCore.barPointAttributes, options); | ||
Dot.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Series.propTypes = { | ||
pointComponent: PropTypes.func.isRequired | ||
}; | ||
} : void 0; | ||
var Series = function Series(_ref) { | ||
var Series$1 = function Series(_ref) { | ||
var props = objectWithoutProperties(_ref, []); | ||
@@ -989,40 +1023,12 @@ var Path = props.seriesComponent, | ||
return React.createElement(Path, restProps); | ||
return React.createElement(Path, _extends({}, restProps, { path: dxChartCore.dLine })); | ||
}; | ||
var Dot$1 = function Dot(_ref2) { | ||
var props = objectWithoutProperties(_ref2, []); | ||
var pointStyle = props.pointStyle, | ||
Point = props.pointComponent, | ||
restProps = objectWithoutProperties(props, ['pointStyle', 'pointComponent']); | ||
var LineSeries = withSeriesPlugin(withColor(Series$1), 'LineSeries', 'line', dxChartCore.coordinates); | ||
return React.createElement(Point, _extends({}, restProps, { | ||
style: pointStyle | ||
})); | ||
}; | ||
var options$1 = function options(_ref3) { | ||
var props = objectWithoutProperties(_ref3, []); | ||
var _props$point = props.point, | ||
point = _props$point === undefined ? {} : _props$point; | ||
return { size: point.size }; | ||
}; | ||
var LineSeries = withSeriesPlugin(Series, Dot$1, 'LineSeries', 'line', dxChartCore.lineAttributes, dxChartCore.pointAttributes, options$1); | ||
Series.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Series$1.propTypes = { | ||
seriesComponent: PropTypes.func.isRequired | ||
}; | ||
} : void 0; | ||
Dot$1.propTypes = { | ||
pointStyle: PropTypes.object, | ||
pointComponent: PropTypes.func.isRequired | ||
}; | ||
Dot$1.defaultProps = { | ||
pointStyle: {} | ||
}; | ||
var Series$1 = function Series(_ref) { | ||
var Series$2 = function Series(_ref) { | ||
var props = objectWithoutProperties(_ref, []); | ||
@@ -1032,66 +1038,53 @@ var Path = props.seriesComponent, | ||
return React.createElement(Path, restProps); | ||
return React.createElement(Path, _extends({}, restProps, { path: dxChartCore.dSpline })); | ||
}; | ||
var Dot$2 = function Dot(_ref2) { | ||
var props = objectWithoutProperties(_ref2, []); | ||
var pointStyle = props.pointStyle, | ||
Point = props.pointComponent, | ||
restProps = objectWithoutProperties(props, ['pointStyle', 'pointComponent']); | ||
var SplineSeries = withSeriesPlugin(withColor(Series$2), 'SplineSeries', 'spline', dxChartCore.coordinates); | ||
return React.createElement(Point, _extends({}, restProps, { | ||
style: pointStyle | ||
})); | ||
}; | ||
var options$2 = function options(_ref3) { | ||
var props = objectWithoutProperties(_ref3, []); | ||
var _props$point = props.point, | ||
point = _props$point === undefined ? {} : _props$point; | ||
return { size: point.size }; | ||
}; | ||
var SplineSeries = withSeriesPlugin(Series$1, Dot$2, 'SplineSeries', 'spline', dxChartCore.lineAttributes, dxChartCore.pointAttributes, options$2); | ||
Series$1.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Series$2.propTypes = { | ||
seriesComponent: PropTypes.func.isRequired | ||
}; | ||
} : void 0; | ||
Dot$2.propTypes = { | ||
pointStyle: PropTypes.object, | ||
pointComponent: PropTypes.func.isRequired | ||
}; | ||
var Series$3 = function Series(_ref) { | ||
var props = objectWithoutProperties(_ref, []); | ||
var Point = props.pointComponent, | ||
coordinates$$1 = props.coordinates, | ||
_props$point = props.point, | ||
point = _props$point === undefined ? {} : _props$point, | ||
restProps = objectWithoutProperties(props, ['pointComponent', 'coordinates', 'point']); | ||
Dot$2.defaultProps = { | ||
pointStyle: {} | ||
var getAttributes = dxChartCore.pointAttributes(point); | ||
return coordinates$$1.map(function (item) { | ||
return React.createElement(Point, _extends({ | ||
key: item.id.toString() | ||
}, getAttributes(item), item, restProps)); | ||
}); | ||
}; | ||
var EmptyFunction$1 = function EmptyFunction() { | ||
return null; | ||
var BaseSeries = function BaseSeries(_ref2) { | ||
var Path = _ref2.Path, | ||
path = _ref2.path, | ||
props = objectWithoutProperties(_ref2, ['Path', 'path']); | ||
return React.createElement(Path, props); | ||
}; | ||
var Dot$3 = function Dot(_ref) { | ||
var props = objectWithoutProperties(_ref, []); | ||
var Point = props.pointComponent, | ||
restProps = objectWithoutProperties(props, ['pointComponent']); | ||
process.env.NODE_ENV !== "production" ? BaseSeries.propTypes = { | ||
Path: PropTypes.func, | ||
path: PropTypes.func | ||
} : void 0; | ||
return React.createElement(Point, restProps); | ||
BaseSeries.defaultProps = { | ||
Path: Series$3, | ||
path: null | ||
}; | ||
var options$3 = function options(_ref2) { | ||
var props = objectWithoutProperties(_ref2, []); | ||
var _props$point = props.point, | ||
point = _props$point === undefined ? {} : _props$point; | ||
var ScatterSeries = withSeriesPlugin(withColor(BaseSeries), 'ScatterSeries', 'scatter', dxChartCore.coordinates); | ||
return { size: point.size }; | ||
}; | ||
ScatterSeries.Path = Series$3; | ||
var ScatterSeries = withSeriesPlugin(EmptyFunction$1, Dot$3, 'ScatterSeries', 'scatter', EmptyFunction$1, dxChartCore.pointAttributes, options$3); | ||
Dot$3.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Series$3.propTypes = { | ||
pointComponent: PropTypes.func.isRequired | ||
}; | ||
} : void 0; | ||
var Series$2 = function Series(_ref) { | ||
var Series$4 = function Series(_ref) { | ||
var props = objectWithoutProperties(_ref, []); | ||
@@ -1101,126 +1094,44 @@ var Path = props.seriesComponent, | ||
return React.createElement(Path, restProps); | ||
return React.createElement(Path, _extends({ | ||
path: dxChartCore.dArea | ||
}, restProps)); | ||
}; | ||
var Dot$4 = function Dot(_ref2) { | ||
var props = objectWithoutProperties(_ref2, []); | ||
var pointStyle = props.pointStyle, | ||
Point = props.pointComponent, | ||
restProps = objectWithoutProperties(props, ['pointStyle', 'pointComponent']); | ||
var AreaSeries = withSeriesPlugin(withColor(Series$4), 'AreaSeries', 'area', dxChartCore.coordinates); | ||
return React.createElement(Point, _extends({}, restProps, { | ||
style: pointStyle | ||
})); | ||
}; | ||
process.env.NODE_ENV !== "production" ? Series$4.propTypes = { | ||
seriesComponent: PropTypes.func.isRequired | ||
} : void 0; | ||
var options$4 = function options(_ref3) { | ||
var props = objectWithoutProperties(_ref3, []); | ||
var _props$point = props.point, | ||
point = _props$point === undefined ? {} : _props$point; | ||
var Series$5 = function Series(_ref) { | ||
var props = objectWithoutProperties(_ref, []); | ||
var Point = props.pointComponent, | ||
coordinates$$1 = props.coordinates, | ||
colorDomain = props.colorDomain, | ||
uniqueName = props.uniqueName, | ||
restProps = objectWithoutProperties(props, ['pointComponent', 'coordinates', 'colorDomain', 'uniqueName']); | ||
var innerRadius = restProps.innerRadius, | ||
outerRadius = restProps.outerRadius, | ||
pointOptions = objectWithoutProperties(restProps, ['innerRadius', 'outerRadius']); | ||
return { size: point.size }; | ||
return coordinates$$1.map(function (item) { | ||
return React.createElement(Point, _extends({ | ||
key: item.id.toString() | ||
}, item, pointOptions, { | ||
color: colorDomain(item.id) | ||
})); | ||
}); | ||
}; | ||
var AreaSeries = withSeriesPlugin(Series$2, Dot$4, 'AreaSeries', 'area', dxChartCore.lineAttributes, dxChartCore.pointAttributes, options$4); | ||
var PieSeries = withSeriesPlugin(Series$5, 'PieSeries', 'arc', dxChartCore.pieAttributes); | ||
Series$2.propTypes = { | ||
seriesComponent: PropTypes.func.isRequired | ||
}; | ||
Dot$4.propTypes = { | ||
pointStyle: PropTypes.object, | ||
process.env.NODE_ENV !== "production" ? Series$5.propTypes = { | ||
style: PropTypes.object, | ||
pointComponent: PropTypes.func.isRequired | ||
}; | ||
} : void 0; | ||
Dot$4.defaultProps = { | ||
pointStyle: {} | ||
Series$5.defaultProps = { | ||
style: {} | ||
}; | ||
var PieSeries = function (_React$PureComponent) { | ||
inherits(PieSeries, _React$PureComponent); | ||
function PieSeries() { | ||
classCallCheck(this, PieSeries); | ||
return possibleConstructorReturn(this, (PieSeries.__proto__ || Object.getPrototypeOf(PieSeries)).apply(this, arguments)); | ||
} | ||
createClass(PieSeries, [{ | ||
key: 'render', | ||
value: function render() { | ||
var _props = this.props, | ||
name = _props.name, | ||
innerRadius = _props.innerRadius, | ||
outerRadius = _props.outerRadius, | ||
cx = _props.cx, | ||
cy = _props.cy, | ||
Point = _props.pointComponent, | ||
valueField = _props.valueField, | ||
argumentField = _props.argumentField, | ||
restProps = objectWithoutProperties(_props, ['name', 'innerRadius', 'outerRadius', 'cx', 'cy', 'pointComponent', 'valueField', 'argumentField']); | ||
var getSeriesDataComputed = function getSeriesDataComputed(_ref) { | ||
var series = _ref.series; | ||
return dxChartCore.seriesData(series, { | ||
valueField: valueField, argumentField: argumentField, name: name | ||
}); | ||
}; | ||
return React.createElement( | ||
dxReactCore.Plugin, | ||
{ name: 'PieSeries' }, | ||
React.createElement(dxReactCore.Getter, { name: 'series', computed: getSeriesDataComputed }), | ||
React.createElement( | ||
dxReactCore.Template, | ||
{ name: 'series' }, | ||
React.createElement(dxReactCore.TemplatePlaceholder, null), | ||
React.createElement( | ||
dxReactCore.TemplateConnector, | ||
null, | ||
function (_ref2) { | ||
var data = _ref2.data, | ||
layouts = _ref2.layouts; | ||
var _layouts$pane = layouts.pane, | ||
widthPane = _layouts$pane.width, | ||
heightPane = _layouts$pane.height; | ||
var arcs = dxChartCore.pieAttributes(valueField, data, widthPane, heightPane, innerRadius, outerRadius); | ||
var colors = dxChartCore.palette(Array.from(arcs)); | ||
return arcs.map(function (item, index) { | ||
return React.createElement(Point, _extends({ | ||
fill: colors[index].themeColor, | ||
key: item.value, | ||
x: cx || widthPane / 2, | ||
y: cy || heightPane / 2, | ||
value: item.value, | ||
d: item.d | ||
}, restProps)); | ||
}); | ||
} | ||
) | ||
) | ||
); | ||
} | ||
}]); | ||
return PieSeries; | ||
}(React.PureComponent); | ||
PieSeries.propTypes = { | ||
name: PropTypes.string, | ||
pointComponent: PropTypes.func.isRequired, | ||
innerRadius: PropTypes.number, | ||
outerRadius: PropTypes.number, | ||
cx: PropTypes.number, | ||
cy: PropTypes.number, | ||
valueField: PropTypes.string.isRequired, | ||
argumentField: PropTypes.string.isRequired | ||
}; | ||
PieSeries.defaultProps = { | ||
name: 'defaultSeriesName', | ||
innerRadius: 0, | ||
outerRadius: undefined, | ||
cx: undefined, | ||
cy: undefined | ||
}; | ||
var Axis = function (_React$Component) { | ||
@@ -1428,3 +1339,3 @@ inherits(Axis, _React$Component); | ||
Axis.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Axis.propTypes = { | ||
name: PropTypes.string, | ||
@@ -1439,3 +1350,3 @@ isArgumentAxis: PropTypes.bool, | ||
indentFromAxis: PropTypes.number | ||
}; | ||
} : void 0; | ||
@@ -1515,6 +1426,6 @@ Axis.defaultProps = { | ||
Grid.propTypes = { | ||
process.env.NODE_ENV !== "production" ? Grid.propTypes = { | ||
name: PropTypes.string, | ||
lineComponent: PropTypes.func.isRequired | ||
}; | ||
} : void 0; | ||
@@ -1521,0 +1432,0 @@ Grid.defaultProps = { |
{ | ||
"name": "@devexpress/dx-react-chart", | ||
"version": "1.6.1", | ||
"version": "1.7.0", | ||
"description": "Composable plugin-based chart component for React", | ||
@@ -44,3 +44,3 @@ "author": { | ||
"devDependencies": { | ||
"@devexpress/dx-testing": "1.6.1", | ||
"@devexpress/dx-testing": "1.7.0", | ||
"babel-core": "^6.26.3", | ||
@@ -50,2 +50,3 @@ "babel-jest": "^23.4.2", | ||
"babel-plugin-transform-object-rest-spread": "^6.26.0", | ||
"babel-plugin-transform-react-remove-prop-types": "^0.4.14", | ||
"babel-plugin-transform-runtime": "^6.23.0", | ||
@@ -75,3 +76,3 @@ "babel-preset-env": "^1.7.0", | ||
"dependencies": { | ||
"@devexpress/dx-chart-core": "1.6.1", | ||
"@devexpress/dx-chart-core": "1.7.0", | ||
"d3-scale": "^2.1.0", | ||
@@ -82,7 +83,7 @@ "d3-shape": "^1.2.0", | ||
"peerDependencies": { | ||
"@devexpress/dx-react-core": "1.6.1", | ||
"@devexpress/dx-react-core": "1.6.0", | ||
"react": ">=16.3.0", | ||
"react-dom": ">=16.3.0" | ||
}, | ||
"gitHead": "5c0e7486a4a42dd322394ae49f10e7cb2cbdfc7a" | ||
"gitHead": "1038ebcef3ea8f6be54d11c38755e86bd5490b8f" | ||
} |
@@ -9,2 +9,4 @@ # DevExtreme React Chart | ||
| | ||
[Demos](https://devexpress.github.io/devextreme-reactive/react/chart/demos/) | ||
| | ||
[Docs](https://devexpress.github.io/devextreme-reactive/react/chart/docs/) | ||
@@ -11,0 +13,0 @@ |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Environment variable access
Supply chain riskPackage accesses environment variables, which may be a sign of credential stuffing or data theft.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
16
224414
28
2912
38
+ Added@devexpress/dx-chart-core@1.7.0(transitive)
+ Added@devexpress/dx-core@1.6.0(transitive)
+ Added@devexpress/dx-react-core@1.6.0(transitive)
- Removed@devexpress/dx-chart-core@1.6.1(transitive)
- Removed@devexpress/dx-core@1.6.1(transitive)
- Removed@devexpress/dx-react-core@1.6.1(transitive)