Skip to content

Commit e68044c

Browse files
ashok1994ashok1994
authored
Merge pull request #29 from rohanoid5/feature/drill-down
Plot Child Map bug fixes.
2 parents 3d23724 + e5558ec commit e68044c

File tree

5 files changed

+83
-50
lines changed

5 files changed

+83
-50
lines changed

‎dist/drill-down.js‎

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -199,11 +199,14 @@ return /******/ (function(modules) { // webpackBootstrap
199199
var plotChildMap = this.props.plotChildMap;
200200

201201
if (childrenLen === 0) return;
202+
203+
// Further Optimization needed.
202204
var mapType = this.determinePlotMapType(plotChildMap);
205+
203206
// Case : Array of numbers
204207
if (mapType === 'number') {
205208
var childPosition = plotChildMap[index];
206-
if (childPosition === null || typeof childPosition === 'undefined' || childPosition >= childrenLen) return;
209+
if (childPosition === null || typeof childPosition === 'undefined' || childPosition >= childrenLen || childPosition < 0) return;
207210

208211
this.setState({
209212
selectedChild: childPosition,
@@ -219,7 +222,7 @@ return /******/ (function(modules) { // webpackBootstrap
219222
plotPosition = _plotChildMap$i.plotPosition,
220223
_childPosition = _plotChildMap$i.childPosition;
221224

222-
if (plotPosition === index && _childPosition && _childPosition > -1) {
225+
if (plotPosition === index && _childPosition !== null && typeof _childPosition !== 'undefined' && _childPosition < childrenLen && _childPosition > -1) {
223226
this.setState({
224227
selectedChild: _childPosition,
225228
isDrilledDown: true
@@ -237,8 +240,7 @@ return /******/ (function(modules) { // webpackBootstrap
237240
}, {
238241
key: 'cloneReactFCChild',
239242
value: function cloneReactFCChild(reactFCElem, customProps) {
240-
var rFCElem = _react2.default.cloneElement(reactFCElem, customProps);
241-
return rFCElem;
243+
return _react2.default.cloneElement(reactFCElem, customProps);
242244
}
243245
}, {
244246
key: 'onChildRendered',
@@ -293,7 +295,10 @@ return /******/ (function(modules) { // webpackBootstrap
293295
this.cloneReactFCChild(propChildren[selectedChild], clonedElemConfig),
294296
isBtnVisible ? _react2.default.createElement(
295297
'button',
296-
{ style: this.finBtnStyle, onClick: this.onBtnClick },
298+
{
299+
style: this.finBtnStyle,
300+
onClick: this.onBtnClick
301+
},
297302
this.finalBtnConfig.text
298303
) : null
299304
);

‎dist/react-fusioncharts.min.js‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎example/Example.js‎

Lines changed: 43 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -15,14 +15,14 @@ const zerothDataScource = {
1515
theme: 'fusion',
1616
},
1717
data: [{
18-
value: 190
18+
value: 190,
1919
},
2020
{
21-
value: 50
21+
value: 50,
2222
},
2323
{
24-
value: 280
25-
}]
24+
value: 280,
25+
}],
2626
};
2727

2828
const firstDataSource = {
@@ -51,7 +51,7 @@ const firstDataSource = {
5151
{
5252
label: 'Daly City Serramonte',
5353
value: '330000',
54-
link: "https://www.google.com"
54+
link: "https://www.google.com",
5555
}]
5656
};
5757

@@ -84,7 +84,7 @@ const secondDataSource = {
8484
};
8585

8686
const thirdDataSource = {
87-
"chart": {
87+
'chart': {
8888
"caption": "THIRD CHILD",
8989
"subCaption": "In MMbbl = One Million barrels",
9090
"xAxisName": "Country",
@@ -126,29 +126,29 @@ const thirdDataSource = {
126126
}]
127127
};
128128

129-
const mappedIdsIntegers = [0, 1, 2, 3, null]; // Index = plotPosition, array[Index] = childPosition
129+
const mappedIdsIntegers = [undefined, 1, 2, 3, null]; // Index = plotPosition, array[Index] = childPosition
130130

131131
const mappedIdsObjects = [
132132
{
133-
'plotPosition': 0,
134-
'childPosition': 1
133+
plotPosition: undefined,
134+
childPosition: 2,
135135
},
136136
{
137-
'plotPosition': 2,
138-
'childPosition': 0
137+
plotPosition: 1,
138+
childPosition: -Infinity,
139139
},
140140
{
141-
'plotPosition': 4,
142-
'childPosition': 1
143-
}
144-
]
141+
plotPosition: 2,
142+
childPosition: 1,
143+
},
144+
];
145145

146146
class Example extends React.Component {
147147
constructor(props) {
148148
super(props);
149149

150150
this.state = {
151-
mappedIds: mappedIdsIntegers,
151+
mappedIds: mappedIdsObjects,
152152
dataSource: {
153153
chart: {
154154
caption: 'PARENT',
@@ -175,13 +175,11 @@ class Example extends React.Component {
175175
{
176176
label: 'Daly City Serramonte',
177177
value: '330000',
178-
}]
179-
}
180-
}
178+
}],
179+
},
180+
};
181181
}
182182

183-
184-
185183
render() {
186184
return (
187185
<div>
@@ -193,20 +191,36 @@ class Example extends React.Component {
193191
dataSource={this.state.dataSource}
194192
plotChildMap={this.state.mappedIds}
195193
btnConfig={
196-
{ placement : 'top-left' }
194+
{
195+
placement: 'top-left',
196+
}
197197
}
198-
>
198+
>
199+
<ReactFC
200+
type="pie2d"
201+
width="600"
202+
height="400"
203+
dataFormat="JSON"
204+
dataSource={firstDataSource}
205+
/>
206+
<ReactFC
207+
type="pie2d"
208+
width="600"
209+
height="400"
210+
dataFormat="JSON"
211+
dataSource={secondDataSource}
212+
/>
199213
<ReactFC
200214
type="pie2d"
201-
width='600'
202-
height='400'
215+
width="600"
216+
height="400"
203217
dataFormat="JSON"
204-
dataSource={firstDataSource} />
218+
dataSource={thirdDataSource}
219+
/>
205220
</DrillDown>
206-
<div style={{ height: 300, width: 400 }}></div>
207221
</div>
208-
)
222+
);
209223
}
210224
}
211225

212-
export default Example;
226+
export default Example;

‎lib/DrillDown.js‎

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -129,11 +129,14 @@ var DrillDown = function (_React$Component) {
129129
var plotChildMap = this.props.plotChildMap;
130130

131131
if (childrenLen === 0) return;
132+
133+
// Further Optimization needed.
132134
var mapType = this.determinePlotMapType(plotChildMap);
135+
133136
// Case : Array of numbers
134137
if (mapType === 'number') {
135138
var childPosition = plotChildMap[index];
136-
if (childPosition === null || typeof childPosition === 'undefined' || childPosition >= childrenLen) return;
139+
if (childPosition === null || typeof childPosition === 'undefined' || childPosition >= childrenLen || childPosition < 0) return;
137140

138141
this.setState({
139142
selectedChild: childPosition,
@@ -149,7 +152,7 @@ var DrillDown = function (_React$Component) {
149152
plotPosition = _plotChildMap$i.plotPosition,
150153
_childPosition = _plotChildMap$i.childPosition;
151154

152-
if (plotPosition === index && _childPosition && _childPosition > -1) {
155+
if (plotPosition === index && _childPosition !== null && typeof _childPosition !== 'undefined' && _childPosition < childrenLen && _childPosition > -1) {
153156
this.setState({
154157
selectedChild: _childPosition,
155158
isDrilledDown: true
@@ -167,8 +170,7 @@ var DrillDown = function (_React$Component) {
167170
}, {
168171
key: 'cloneReactFCChild',
169172
value: function cloneReactFCChild(reactFCElem, customProps) {
170-
var rFCElem = _react2.default.cloneElement(reactFCElem, customProps);
171-
return rFCElem;
173+
return _react2.default.cloneElement(reactFCElem, customProps);
172174
}
173175
}, {
174176
key: 'onChildRendered',
@@ -223,7 +225,10 @@ var DrillDown = function (_React$Component) {
223225
this.cloneReactFCChild(propChildren[selectedChild], clonedElemConfig),
224226
isBtnVisible ? _react2.default.createElement(
225227
'button',
226-
{ style: this.finBtnStyle, onClick: this.onBtnClick },
228+
{
229+
style: this.finBtnStyle,
230+
onClick: this.onBtnClick
231+
},
227232
this.finalBtnConfig.text
228233
) : null
229234
);

‎src/DrillDown.js‎

Lines changed: 19 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -66,18 +66,23 @@ class DrillDown extends React.Component {
6666
return 'noop';
6767
}
6868

69-
plotClicked(e) {
69+
plotClicked(e) {
7070
const { index } = e.data;
71-
const propChildren = Array.isArray(this.props.children) ? this.props.children : [this.props.children];
71+
const propChildren = Array.isArray(this.props.children) ?
72+
this.props.children : [this.props.children];
7273
const childrenLen = propChildren.length;
7374
const { plotChildMap } = this.props;
7475
if (childrenLen === 0) return;
76+
77+
// Further Optimization needed.
7578
const mapType = this.determinePlotMapType(plotChildMap);
79+
7680
// Case : Array of numbers
7781
if (mapType === 'number') {
7882
const childPosition = plotChildMap[index];
79-
if (childPosition === null || typeof childPosition === 'undefined' || childPosition >= childrenLen) return;
80-
83+
if (childPosition === null || typeof childPosition === 'undefined' ||
84+
childPosition >= childrenLen || childPosition < 0) return;
85+
8186
this.setState({
8287
selectedChild: childPosition,
8388
isDrilledDown: true,
@@ -89,7 +94,9 @@ class DrillDown extends React.Component {
8994
for (let i = 0; i < childrenLen; i++) {
9095
if (typeof plotChildMap[i] === 'undefined' || plotChildMap[i] === null) continue;
9196
const { plotPosition, childPosition } = plotChildMap[i];
92-
if (plotPosition === index && childPosition && childPosition > -1) {
97+
if (plotPosition === index &&
98+
(childPosition !== null && typeof childPosition !== 'undefined') &&
99+
childPosition < childrenLen && childPosition > -1) {
93100
this.setState({
94101
selectedChild: childPosition,
95102
isDrilledDown: true,
@@ -106,11 +113,10 @@ class DrillDown extends React.Component {
106113
}
107114

108115
cloneReactFCChild(reactFCElem, customProps) {
109-
const rFCElem = React.cloneElement(
116+
return React.cloneElement(
110117
reactFCElem,
111118
customProps,
112119
);
113-
return rFCElem;
114120
}
115121

116122
onChildRendered() {
@@ -161,9 +167,12 @@ class DrillDown extends React.Component {
161167
{/* Back Button */}
162168
{
163169
isBtnVisible ?
164-
<button style={this.finBtnStyle} onClick={this.onBtnClick}>{this.finalBtnConfig.text}</button>
165-
:
166-
null
170+
<button
171+
style={this.finBtnStyle}
172+
onClick={this.onBtnClick}
173+
>
174+
{this.finalBtnConfig.text}
175+
</button> : null
167176
}
168177
</div>
169178
);

0 commit comments

Comments
 (0)