recharts - npm Package Compare versions

Comparing version 0.3.2 to 0.3.3

package.json

 {
   "name": "recharts",
-  "version": "0.3.2",
+  "version": "0.3.3",
   "description": "React charts",
@@ -5,0 +5,0 @@ "main": "src/index.js",

src/chart/Area.js

 /**
  * @fileOverview 面积图
  */
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 import Curve from '../shape/Curve';
@@ -58,3 +58,3 @@ import Layer from '../container/Layer';
   renderArea() {
-    const {hasDot, hasCurve, className, ...other} = this.props;
+    const { hasDot, hasCurve, className, ...other } = this.props;
 
@@ -67,3 +67,4 @@ return (
         onMouseLeave={this.props.onMouseLeave}
-        onClick={this.props.onClick}/>
+        onClick={this.props.onClick}
+      />
     );
@@ -73,3 +74,3 @@ }
   renderCurve() {
-    const {hasDot, hasCurve, baseLineType, baseLine, ...other} = this.props;
+    const { hasDot, hasCurve, baseLineType, baseLine, ...other } = this.props;
 
@@ -79,3 +80,4 @@ return (
         {...other}
-        fill="none"/>
+        fill="none"
+      />
     );
@@ -85,3 +87,3 @@ }
   renderDots() {
-    const {points, ...other} = this.props;
+    const { points, ...other } = this.props;
 
@@ -96,3 +98,3 @@ const dots = points.map((entry, i) => {
   render() {
-    const {hasDot, hasCurve, points, className, ...other} = this.props;
+    const { hasDot, hasCurve, points, className, ...other } = this.props;
 
@@ -99,0 +101,0 @@ if (!points || !points.length) {

src/chart/Bar.js

 /**
  * @fileOverview 柱图
  */
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 import Rectangle from '../shape/Rectangle';
@@ -56,6 +56,6 @@ import Layer from '../container/Layer';
   renderRectangles() {
-    const {data, className, hasLabel, customContent, ...others} = this.props;
+    const { data, className, customContent, ...others } = this.props;
 
     return data.map((entry, i) => {
-      const {value, ...rest} = entry;
+      const { value, ...rest } = entry;
 
@@ -74,3 +74,3 @@ return React.isValidElement(customContent) ? React.cloneElement(customContent, {
   renderLabels() {
-    const {data, label, fill, stroke} = this.props;
+    const { data, label, fill, stroke } = this.props;
 
@@ -91,3 +91,3 @@ return data.map((entry, i) => {
   render() {
-    const {data, className, label} = this.props;
+    const { data, className, label } = this.props;
 
@@ -94,0 +94,0 @@ if (!data || !data.length) {

src/chart/Line.js

 /**
  * @fileOverview 饼图
  */
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 import Curve from '../shape/Curve';
@@ -50,3 +50,3 @@ import Layer from '../container/Layer';
   renderDots() {
-    const {data, ...other} = this.props;
+    const { data, ...other } = this.props;
 
@@ -61,3 +61,3 @@ const dots = data.map((entry, i) => {
   render() {
-    const {dot, data, className, ...other} = this.props;
+    const { dot, data, className, ...other } = this.props;
 
@@ -76,3 +76,4 @@ if (!data || !data.length) {
           onClick={this.props.onClick}
-          points={data}/>
+          points={data}
+        />
         {dot && this.renderDots()}
@@ -79,0 +80,0 @@ </Layer>

src/chart/Pie.js

 /**
  * @fileOverview 饼图
  */
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 import Sector from '../shape/Sector';
@@ -61,3 +61,3 @@ import pureRender from 'pure-render-decorator';
   getSectors() {
-    const {cx, cy, innerRadius, outerRadius, startAngle, data, minAngle, clockWise} = this.props;
+    const { cx, cy, innerRadius, outerRadius, startAngle, data, minAngle, clockWise } = this.props;
     const len = data.length;
@@ -89,6 +89,6 @@
           fill: entry.fill,
-          cx: cx,
-          cy: cy,
-          innerRadius: innerRadius,
-          outerRadius: outerRadius,
+          cx,
+          cy,
+          innerRadius,
+          outerRadius,
           startAngle: clockWise ? _startAngle : _endAngle,
@@ -111,3 +111,3 @@ endAngle: clockWise ? _endAngle : _startAngle,
     const sectors = this.getSectors();
-    const {onMouseLeave, onClick} = this.props;
+    const { onMouseLeave, onClick } = this.props;
 
@@ -121,3 +121,4 @@ return sectors.map((entry, i) => {
           onClick={onClick}
-          key={'sector-' + i}/>
+          key={'sector-' + i}
+        />
       );
@@ -128,3 +129,3 @@ });
   render() {
-    const {data, className} = this.props;
+    const { data, className } = this.props;
 
@@ -131,0 +132,0 @@ if (!data || !data.length) {

src/chart/Radar.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 
@@ -49,4 +49,4 @@ import PolarGrid from '../component/PolarGrid';
   getGridRadius() {
-    const {gridNumber} = this.props;
-    let {innerRadius, outerRadius} = this.props;
+    const { gridNumber } = this.props;
+    let { innerRadius, outerRadius } = this.props;
     const result = [];
@@ -82,4 +82,4 @@
   getVertexCoord(data) {
-    const {min, max, value, angle} = data;
-    const {cx, cy, innerRadius, outerRadius} = this.props;
+    const { min, max, value, angle } = data;
+    const { cx, cy, innerRadius, outerRadius } = this.props;
     let r;
@@ -103,3 +103,3 @@
   getAngleTicks() {
-    const {startAngle, data, clockWise} = this.props;
+    const { startAngle, data, clockWise } = this.props;
     const sign = clockWise ? -1 : 1;
@@ -122,7 +122,7 @@ const len = data.length;
   renderPolygon() {
-    const {data} = this.props;
+    const { data } = this.props;
     const points = [];
 
     for (let i = 0, len = data.length; i < len; i++) {
-      const {x, y} = this.getVertexCoord(data[i]);
+      const { x, y } = this.getVertexCoord(data[i]);
 
@@ -137,3 +137,3 @@ points.push([x, y]);
   render() {
-    const {outerRadius, data} = this.props;
+    const { outerRadius, data } = this.props;
 
@@ -145,3 +145,3 @@ if (outerRadius <= 0 || !data || !data.length) {
     const radius = this.getGridRadius();
-    const angles = angleTicks.map(entry =>  entry.angle);
+    const angles = angleTicks.map(entry => entry.angle);
 
@@ -153,6 +153,8 @@ return (
           polarAngles={angles}
-          polarRadius={radius}/>
+          polarRadius={radius}
+        />
         <PolarAngleAxis
           {...this.props}
-          ticks={angleTicks}/>
+          ticks={angleTicks}
+        />
         {this.renderPolygon()}
@@ -159,0 +161,0 @@ </g>

src/chart/RadarSecond.js

@@ -1,2 +0,2 @@
-import React from 'react';
+import React, { PropTypes } from 'react';
 import pureRender from 'pure-render-decorator';
@@ -39,3 +39,3 @@
   getPolygonVertexs() {
-    const {data, polarAngleScale, polarRadiusScale} = this.props;
+    const { cx, cy, data, polarAngleScale, polarRadiusScale } = this.props;
 
@@ -42,0 +42,0 @@ return data.map((entry, index) => {

src/chart/RadialBar.js

 /**
  * @fileOverview 玉玦图
  */
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 import Sector from '../shape/Sector';
@@ -71,4 +71,4 @@ import Layer from '../container/Layer';
   getSectors() {
-    const {cx, cy, startAngle,
-           data, minAngle, maxAngle, clockWise} = this.props;
+    const { cx, cy, startAngle,
+           data, minAngle, maxAngle, clockWise } = this.props;
     const maxValue = Math.max.apply(null, data.map(entry => entry.value));
@@ -96,5 +96,5 @@ const absMinAngle = Math.abs(minAngle);
   getLabelPathArc(data, labelContent, style) {
-    const {label} = this.props;
+    const { label } = this.props;
     const offsetRadius = (React.isValidElement(label) ? label.props.offsetRadius : label.offsetRadius) || 2;
-    const {cx, cy, innerRadius, outerRadius, startAngle, endAngle, clockWise} = data;
+    const { cx, cy, innerRadius, outerRadius, startAngle, endAngle, clockWise } = data;
     const radius = clockWise ? innerRadius + offsetRadius : Math.max(outerRadius - offsetRadius, 0);
@@ -128,6 +128,6 @@
   renderSectors(sectors) {
-    const {className, component, data, ...others} = this.props;
+    const { className, component, data, ...others } = this.props;
 
     return sectors.map((entry, i) => {
-      const {value, ...rest} = entry;
+      const { value, ...rest } = entry;
 
@@ -145,6 +145,6 @@ return component ? React.cloneElement(component, {
   renderBackground(sectors) {
-    const {startAngle, endAngle, clockWise, background} = this.props;
+    const { startAngle, endAngle, clockWise, background } = this.props;
 
     return sectors.map((entry, i) => {
-      const {value, ...rest} = entry;
+      const { value, ...rest } = entry;
 
@@ -160,3 +160,4 @@ return React.isValidElement(background) ? React.cloneElement(background, {
           endAngle={endAngle}
-          key={'sector-' + i}/>
+          key={'sector-' + i}
+        />
       );
@@ -167,3 +168,3 @@ });
   renderLabels(sectors) {
-    const {label} = this.props;
+    const { label } = this.props;
     const isElement = React.isValidElement(label);
@@ -174,5 +175,5 @@ const formatter = isElement ? label.props.formatter : label.formatter;
     return sectors.map((entry, i) => {
-      const content =  hasFormatter ? formatter(entry.value) : entry.value;
+      const content = hasFormatter ? formatter(entry.value) : entry.value;
       const id = LodashUtils.getUniqueId('recharts-defs-');
-      const style = (isElement ? ReactUtils.getPresentationAttributes(label) : label.style) || {fontSize: 10, fill: '#000'};
+      const style = (isElement ? ReactUtils.getPresentationAttributes(label) : label.style) || { fontSize: 10, fill: '#000' };
       const path = this.getLabelPathArc(entry, content, style);
@@ -184,3 +185,3 @@
 
-      return <text {...style} key={'label-' + i} dangerouslySetInnerHTML={{__html: html}}/>;
+      return <text {...style} key={'label-' + i} dangerouslySetInnerHTML={{ __html: html }}/>;
     });
@@ -190,3 +191,3 @@ }
   render() {
-    const {data, className, background, label} = this.props;
+    const { data, className, background, label } = this.props;
 
@@ -193,0 +194,0 @@ if (!data || !data.length) {

src/chart/Scatter.js

 /**
  * @fileOverview 散点图
  */
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 import Layer from '../container/Layer';
@@ -48,3 +48,3 @@ import pureRender from 'pure-render-decorator';
   handleCircleMouseEnter(data, e) {
-    const {onMouseEnter, groupId} = this.props;
+    const { onMouseEnter, groupId } = this.props;
 
@@ -55,6 +55,6 @@ onMouseEnter(groupId, data, e);
   renderCircles() {
-    const {data, className, onMouseEnter,  ...others} = this.props;
+    const { data, className, onMouseEnter, ...others } = this.props;
 
     return data.map((entry, i) => {
-      const {value, ...rest} = entry;
+      const { value, ...rest } = entry;
 
@@ -66,3 +66,4 @@ return (
           onMouseEnter={this.handleCircleMouseEnter.bind(null, entry)}
-          key={'circle-' + i}/>
+          key={'circle-' + i}
+        />
       );
@@ -73,3 +74,3 @@ });
   render() {
-    const {data, className} = this.props;
+    const { data, className } = this.props;
 
@@ -76,0 +77,0 @@ if (!data || !data.length) {

src/chartWrapper/AreaChart.js

@@ -27,3 +27,3 @@ import React from 'react';
   getComposeData(xAxis, yAxis, dataKey) {
-    const {data, layout} = this.props;
+    const { data, layout } = this.props;
     const xTicks = this.getAxisTicks(xAxis);
@@ -51,3 +51,3 @@ const yTicks = this.getAxisTicks(yAxis);
     return {
-      points: points,
+      points,
       baseLine,
@@ -93,3 +93,3 @@ baseLineType: layout,
     items.forEach((child, i) => {
-      const {xAxisId, yAxisId, dataKey, fillOpacity, ...other} = child.props;
+      const { xAxisId, yAxisId, dataKey, fillOpacity, ...other } = child.props;
       const xAxis = xAxisMap[xAxisId];
@@ -115,3 +115,4 @@ const yAxis = yAxisMap[yAxisId];
           onMouseEnter={this.handleAreaMouseEnter.bind(null, dataKey)}
-          {...composeData}/>
+          {...composeData}
+        />
       );
@@ -150,10 +151,10 @@
     if (layout === 'horizontal') {
-      return <line className='recharts-cursor' {...style} x1={start} x2={start} y1={offset.top} y2={offset.top + offset.height}/>;
+      return <line className="recharts-cursor" {...style} x1={start} x2={start} y1={offset.top} y2={offset.top + offset.height}/>;
     }
 
-    return <line className='recharts-cursor' {...style} x1={offset.left} x2={offset.left + offset.width} y1={start} y2={start}/>;
+    return <line className="recharts-cursor" {...style} x1={offset.left} x2={offset.left + offset.width} y1={start} y2={start}/>;
   }
 
   render() {
-    const {style, children} = this.props;
+    const { style, children } = this.props;
     const items = ReactUtils.findAllByType(children, AreaItem);
@@ -171,6 +172,7 @@ const legendItem = ReactUtils.findChildByType(children, Legend);
       <div className="recharts-wrapper"
-        style={{position: 'relative', cursor: 'default', ...style}}
+        style={{ position: 'relative', cursor: 'default', ...style }}
         onMouseEnter={this.handleMouseEnter.bind(null, offset, xAxisMap, yAxisMap)}
         onMouseMove={this.handleMouseMove.bind(null, offset, xAxisMap, yAxisMap)}
-        onMouseLeave={this.handleMouseLeave}>
+        onMouseLeave={this.handleMouseLeave}
+      >
 
@@ -177,0 +179,0 @@ {legendItem && legendItem.props.layout === 'horizontal'

src/chartWrapper/AreaItem.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 
@@ -3,0 +3,0 @@ class AreaItem extends React.Component {

src/chartWrapper/BarChart.js

@@ -37,4 +37,4 @@ import React from 'react';
   getComposeData(barPosition, xAxis, yAxis, offset, dataKey) {
-    const {layout} = this.props;
-    const {dataStartIndex, dataEndIndex} = this.state;
+    const { layout } = this.props;
+    const { dataStartIndex, dataEndIndex } = this.state;
     const data = this.props.data.slice(dataStartIndex, dataEndIndex + 1);
@@ -69,3 +69,3 @@ const pos = barPosition[dataKey];
 
-      return {...entry, x, y, width, height, value};
+      return { ...entry, x, y, width, height, value };
     });
@@ -75,3 +75,3 @@ }
   getBaseLine(xAxis, yAxis) {
-    const {layout} = this.props;
+    const { layout } = this.props;
     const scale = layout === 'horizontal' ? yAxis.scale : xAxis.scale;
@@ -90,3 +90,3 @@ const domain = scale.domain();
   getBarPosition(bandSize, sizeList) {
-    const {barGap, barOffset} = this.props;
+    const { barGap, barOffset } = this.props;
     const len = sizeList.length;
@@ -102,3 +102,3 @@ let result;
       const offset = ((bandSize - sum) / 2) >> 0;
-      let prev = {offset: offset - barGap, size: 0};
+      let prev = { offset: offset - barGap, size: 0 };
 
@@ -115,3 +115,3 @@ result = sizeList.reduce((res, entry) => {
     } else {
-      let offset = LodashUtils.getPercentValue(barOffset, bandSize);
+      const offset = LodashUtils.getPercentValue(barOffset, bandSize);
       const size = (bandSize - 2 * offset - (len - 1) * barGap) / len >> 0;
@@ -137,6 +137,6 @@
   getSizeList(items) {
-    const {layout, barSize} = this.props;
+    const { layout, barSize } = this.props;
 
     const sizeList = items.reduce((result, child) => {
-      const {xAxisId, yAxisId, dataKey} = child.props;
+      const { xAxisId, yAxisId, dataKey } = child.props;
       const axisId = layout === 'horizontal' ? xAxisId : yAxisId;
@@ -146,3 +146,3 @@
 
-      list.push({dataKey, barSize: child.props.barSize || barSize});
+      list.push({ dataKey, barSize: child.props.barSize || barSize });
 
@@ -190,4 +190,4 @@ result[axisId] = list;
 
-    const {layout} = this.props;
-    const {activeTooltipIndex} = this.state;
+    const { layout } = this.props;
+    const { activeTooltipIndex } = this.state;
     const axisMap = layout === 'horizontal' ? xAxisMap : yAxisMap;
@@ -208,3 +208,4 @@ const ids = Object.keys(axisMap);
         width={layout === 'horizontal' ? bandSize : offset.width - 1}
-        height={layout === 'horizontal' ? offset.height - 1 : bandSize}/>
+        height={layout === 'horizontal' ? offset.height - 1 : bandSize}
+      />
     );
@@ -223,3 +224,3 @@ }
 
-    const {layout} = this.props;
+    const { layout } = this.props;
     const sizeList = this.getSizeList(items);
@@ -230,3 +231,3 @@
     return items.map((child, i) => {
-      const {xAxisId, yAxisId, dataKey, ...other} = child.props;
+      const { xAxisId, yAxisId, dataKey, ...other } = child.props;
       const axisId = layout === 'horizontal' ? xAxisId : yAxisId;
@@ -246,3 +247,4 @@ const bandSize = this.getBandSize(
           onMouseEnter={this.handleBarMouseEnter.bind(null, dataKey)}
-          data={this.getComposeData(barPosition, xAxisMap[xAxisId], yAxisMap[yAxisId], offset, dataKey)}/>
+          data={this.getComposeData(barPosition, xAxisMap[xAxisId], yAxisMap[yAxisId], offset, dataKey)}
+        />
       );
@@ -253,3 +255,3 @@ }, this);
   render() {
-    const {style, children} = this.props;
+    const { style, children } = this.props;
     const items = ReactUtils.findAllByType(children, BarItem);
@@ -267,6 +269,7 @@ const legendItem = ReactUtils.findChildByType(children, Legend);
       <div className="recharts-wrapper"
-        style={{position: 'relative', cursor: 'default', ...style}}
+        style={{ position: 'relative', cursor: 'default', ...style }}
         onMouseEnter={this.handleMouseEnter.bind(null, offset, xAxisMap, yAxisMap)}
         onMouseMove={this.handleMouseMove.bind(null, offset, xAxisMap, yAxisMap)}
-        onMouseLeave={this.handleMouseLeave}>
+        onMouseLeave={this.handleMouseLeave}
+      >
 
@@ -273,0 +276,0 @@ {legendItem && legendItem.props.layout === 'horizontal'

src/chartWrapper/BarItem.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 
@@ -3,0 +3,0 @@ class BarItem extends React.Component {

src/chartWrapper/CartesianChart.js

@@ -1,4 +0,4 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 import ReactDOM from 'react-dom';
-import {getNiceTickValues} from 'recharts-scale';
+import { getNiceTickValues } from 'recharts-scale';
 import D3Scale from 'd3-scale';
@@ -58,3 +58,3 @@
     layout: 'horizontal',
-    margin: {top: 5, right: 5, bottom: 5, left: 5},
+    margin: { top: 5, right: 5, bottom: 5, left: 5 },
   };
@@ -71,3 +71,3 @@
       activeTooltipPosition: 'left-bottom',
-      activeTooltipCoord: {x: 0, y: 0},
+      activeTooltipCoord: { x: 0, y: 0 },
       isTooltipActive: false,
@@ -99,4 +99,4 @@ activeLineKey: null,
   getDomainByKey(key, type) {
-    const {data} = this.props;
-    const {dataStartIndex, dataEndIndex} = this.state;
+    const { data } = this.props;
+    const { dataStartIndex, dataEndIndex } = this.state;
     const domain = data.slice(dataStartIndex, dataEndIndex + 1)
@@ -154,3 +154,3 @@ .map(entry => entry[key]);
   getAxisMap(axisType = 'xAxis', items) {
-    const {children} = this.props;
+    const { children } = this.props;
     const Axis = axisType === 'xAxis' ? XAxis : YAxis;
@@ -183,3 +183,3 @@ const axisIdKey = axisType === 'xAxis' ? 'xAxisId' : 'yAxisId';
     const axisMap = axes.reduce((result, child) => {
-      const {type, dataKey} = child.props;
+      const { type, dataKey } = child.props;
       const axisId = child.props[axisIdKey];
@@ -200,7 +200,7 @@
 
-        return {...result, [axisId]: {
+        return { ...result, [axisId]: {
           ...child.props,
           axisType,
           domain,
-        }};
+        } };
       }
@@ -222,3 +222,3 @@
   getAxisMapByItems(items, Axis, axisType, axisIdKey) {
-    const {dataEndIndex, dataStartIndex} = this.state;
+    const { dataEndIndex, dataStartIndex } = this.state;
     const len = dataEndIndex - dataStartIndex + 1;
@@ -263,3 +263,3 @@ let index = -1;
   getOffset(xAxisMap, yAxisMap) {
-    const {width, height, margin, children} = this.props;
+    const { width, height, margin, children } = this.props;
     const brushItem = ReactUtils.findChildByType(children, Brush);
@@ -274,3 +274,3 @@
       return result;
-    }, {left: margin.left, right: margin.right});
+    }, { left: margin.left, right: margin.right });
 
@@ -284,3 +284,3 @@ const offsetV = Object.keys(xAxisMap).reduce((result, id) => {
       return result;
-    }, {top: margin.top, bottom: margin.bottom});
+    }, { top: margin.top, bottom: margin.bottom });
 
@@ -308,8 +308,8 @@ if (brushItem) {
     switch (displayName) {
-    case 'LineItem':
-      result = item.props.stroke;
-      break;
-    default:
-      result = item.props.fill;
-      break;
+      case 'LineItem':
+        result = item.props.stroke;
+        break;
+      default:
+        result = item.props.fill;
+        break;
     }
@@ -353,3 +353,3 @@
   getFormatAxisMap(axisMap, offset, axisType) {
-    const {width, height, layout} = this.props;
+    const { width, height, layout } = this.props;
     const ids = Object.keys(axisMap);
@@ -365,3 +365,3 @@ const steps = {
       const axis = axisMap[id];
-      const {orient, type, domain, tickFormatter} = axis;
+      const { orient, type, domain, tickFormatter } = axis;
       let range;
@@ -387,3 +387,5 @@
       this.setTicksOfScale(scale, axis);
-      tickFormatter && scale.tickFormat(tickFormatter);
+      if (tickFormatter) {
+        scale.tickFormat(tickFormatter);
+      }
 
@@ -401,3 +403,3 @@ let x;
 
-      result[id] = {...axis,
+      result[id] = { ...axis,
         x, y, scale,
@@ -429,3 +431,3 @@ width: axisType === 'xAxis' ? offset.width : axis.width,
       return axis.ticks.map(entry => {
-        return {coord: scale(entry) + offset, value: entry};
+        return { coord: scale(entry) + offset, value: entry };
       });
@@ -436,3 +438,3 @@ }
       return scale.ticks(axis.tickCount).map(entry => {
-        return {coord: scale(entry) + offset, value: entry};
+        return { coord: scale(entry) + offset, value: entry };
       });
@@ -442,3 +444,3 @@ }
     return scale.domain().map((entry) => {
-      return {coord: scale(entry) + offset, value: entry};
+      return { coord: scale(entry) + offset, value: entry };
     });
@@ -486,3 +488,3 @@ }
 
-    const {layout} = this.props;
+    const { layout } = this.props;
     const axisMap = layout === 'horizontal' ? xAxisMap : yAxisMap;
@@ -498,4 +500,4 @@ const pos = layout === 'horizontal' ? e.chartX : e.chartY;
         || (i > 0 && i < len - 1 && pos > (ticks[i].coord + ticks[i - 1].coord) / 2
-          && pos <= (ticks[i].coord + ticks[i + 1].coord) / 2 )
-        || (i === len - 1 && pos > (ticks[i].coord + ticks[i - 1].coord) / 2) ) {
+          && pos <= (ticks[i].coord + ticks[i + 1].coord) / 2)
+        || (i === len - 1 && pos > (ticks[i].coord + ticks[i - 1].coord) / 2)) {
         index = i;
@@ -522,3 +524,3 @@ break;
   getTooltipContent(items) {
-    const {activeLineKey, activeTooltipIndex, dataStartIndex, dataEndIndex} = this.state;
+    const { activeLineKey, activeTooltipIndex, dataStartIndex, dataEndIndex } = this.state;
     const data = this.props.data.slice(dataStartIndex, dataEndIndex + 1);
@@ -535,3 +537,3 @@
     return activeItems.map((child) => {
-      const {dataKey, name, unit, formatter} = child.props;
+      const { dataKey, name, unit, formatter } = child.props;
 
@@ -543,3 +545,3 @@ return {
         value: data[activeTooltipIndex][dataKey],
-        formatter: formatter,
+        formatter,
       };
@@ -549,3 +551,3 @@ });
 
-  handleBrushChange = ({startIndex, endIndex}) => {
+  handleBrushChange = ({ startIndex, endIndex }) => {
     this.setState({
@@ -623,3 +625,3 @@ dataStartIndex: startIndex,
   renderXAxis(xAxisMap) {
-    const {width, height} = this.props;
+    const { width, height } = this.props;
     const ids = xAxisMap && Object.keys(xAxisMap);
@@ -644,4 +646,5 @@
               orient={axis.orient}
-              viewBox={{x: 0, y: 0, width, height}}
-              ticks={this.getAxisTicks(axis, true)}/>
+              viewBox={{ x: 0, y: 0, width, height }}
+              ticks={this.getAxisTicks(axis, true)}
+            />
           ));
@@ -660,3 +663,3 @@ }
   renderYAxis(yAxisMap) {
-    const {width, height} = this.props;
+    const { width, height } = this.props;
     const ids = yAxisMap && Object.keys(yAxisMap);
@@ -680,4 +683,5 @@
               orient={axis.orient}
-              viewBox={{x: 0, y: 0, width, height}}
-              ticks={this.getAxisTicks(axis, true)}/>
+              viewBox={{ x: 0, y: 0, width, height }}
+              ticks={this.getAxisTicks(axis, true)}
+            />
           ));
@@ -698,3 +702,3 @@ }
   renderGrid(xAxisMap, yAxisMap, offset) {
-    const {children, width, height} = this.props;
+    const { children, width, height } = this.props;
     const gridItem = ReactUtils.findChildByType(children, CartesianGrid);
@@ -712,3 +716,3 @@
       ticks: this.getAxisTicks(xAxis, true),
-      viewBox: {x: 0, y: 0, width, height},
+      viewBox: { x: 0, y: 0, width, height },
     }), offset.left, offset.left + offset.width);
@@ -719,3 +723,3 @@
       ticks: this.getAxisTicks(yAxis, true),
-      viewBox: {x: 0, y: 0, width, height},
+      viewBox: { x: 0, y: 0, width, height },
     }), offset.top, offset.top + offset.height);
@@ -741,3 +745,3 @@
     const legendData = items.map((child) => {
-      const {dataKey, name, legendType} = child.props;
+      const { dataKey, name, legendType } = child.props;
 
@@ -763,3 +767,3 @@ return {
   renderTooltip(items, offset) {
-    const {children} = this.props;
+    const { children } = this.props;
     const tooltipItem = ReactUtils.findChildByType(children, Tooltip);
@@ -771,5 +775,5 @@
 
-    const {chartX, chartY, isTooltipActive,
+    const { chartX, chartY, isTooltipActive,
           activeTooltipLabel, activeTooltipCoord,
-          activeTooltipPosition} = this.state;
+          activeTooltipPosition } = this.state;
     const scope = {
@@ -795,3 +799,3 @@ x1: offset.left,
   renderBrush(xAxisMap, yAxisMap, offset) {
-    const {children, data} = this.props;
+    const { children, data } = this.props;
     const brushItem = ReactUtils.findChildByType(children, Brush);
@@ -815,3 +819,3 @@
   renderReferenceLines(xAxisMap, yAxisMap, offset) {
-    const {children} = this.props;
+    const { children } = this.props;
     const lines = ReactUtils.findAllByType(children, ReferenceLine);
@@ -818,0 +822,0 @@

src/chartWrapper/LineChart.js

@@ -27,3 +27,3 @@ import React from 'react';
   getComposeData(xAxis, yAxis, dataKey) {
-    const {data, layout} = this.props;
+    const { data, layout } = this.props;
     const xTicks = this.getAxisTicks(xAxis);
@@ -68,6 +68,6 @@ const yTicks = this.getAxisTicks(yAxis);
   renderItems(items, xAxisMap, yAxisMap, offset) {
-    const {activeLineKey} = this.state;
+    const { activeLineKey } = this.state;
 
     return items.map((child, i) => {
-      const {xAxisId, yAxisId, dataKey, strokeWidth, ...other} = child.props;
+      const { xAxisId, yAxisId, dataKey, strokeWidth, ...other } = child.props;
 
@@ -88,3 +88,4 @@ let finalStrokeWidth = strokeWidth === +strokeWidth ? strokeWidth : 1;
           onMouseEnter={this.handleLineMouseEnter.bind(null, dataKey)}
-          data={this.getComposeData(xAxisMap[xAxisId], yAxisMap[yAxisId], dataKey)}/>
+          data={this.getComposeData(xAxisMap[xAxisId], yAxisMap[yAxisId], dataKey)}
+        />
       );
@@ -95,3 +96,3 @@ }, this);
   render() {
-    const {style, children} = this.props;
+    const { style, children } = this.props;
     const items = ReactUtils.findAllByType(children, LineItem);
@@ -109,6 +110,7 @@ const legendItem = ReactUtils.findChildByType(children, Legend);
       <div className="recharts-wrapper"
-        style={{position: 'relative', cursor: 'default', ...style}}
+        style={{ position: 'relative', cursor: 'default', ...style }}
         onMouseEnter={this.handleMouseEnter.bind(null, offset, xAxisMap, yAxisMap)}
         onMouseMove={this.handleMouseMove.bind(null, offset, xAxisMap, yAxisMap)}
-        onMouseLeave={this.handleMouseLeave}>
+        onMouseLeave={this.handleMouseLeave}
+      >
 
@@ -115,0 +117,0 @@ {legendItem && legendItem.props.layout === 'horizontal'

src/chartWrapper/LineItem.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 
@@ -3,0 +3,0 @@ class LineItem extends React.Component {

src/chartWrapper/PieChart.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 
@@ -46,3 +46,3 @@ import Surface from '../container/Surface';
     style: {},
-    margin: {top: 0, right: 0, bottom: 0, left: 0},
+    margin: { top: 0, right: 0, bottom: 0, left: 0 },
   };
@@ -57,3 +57,3 @@
     activeTooltipPosition: 'left-bottom',
-    activeTooltipCoord: {x: 0, y: 0},
+    activeTooltipCoord: { x: 0, y: 0 },
     isTooltipActive: false,
@@ -63,3 +63,3 @@ };
   getComposeData(item) {
-    const {fill, stroke, strokeWidth, strokeDasharray, data} = item.props;
+    const { fill, stroke, strokeWidth, strokeDasharray, data } = item.props;
 
@@ -100,3 +100,3 @@ return data.map((entry) => {
   renderLegend(items, legendItem) {
-    const {width} = this.props;
+    const { width } = this.props;
 
@@ -107,5 +107,5 @@ const legendData = items.reduce((result, child) => {
       return result.concat(data.map((entry) => {
-        const {name, value, ...rest} = entry;
+        const { name, value, ...rest } = entry;
 
-        return {value: entry.name, color: entry.fill, ...rest};
+        return { value: entry.name, color: entry.fill, ...rest };
       }));
@@ -121,3 +121,3 @@ }, []);
   renderTooltip() {
-    const {children} = this.props;
+    const { children } = this.props;
     const tooltipItem = ReactUtils.findChildByType(children, Tooltip);
@@ -135,6 +135,6 @@
   renderItems(items) {
-    const {width, height} = this.props;
+    const { width, height } = this.props;
 
     return items.map((child, i) => {
-      const {cx, cy, outerRadius, data, ...others} = child.props;
+      const { cx, cy, outerRadius, data, ...others } = child.props;
       const maxRadius = Math.min(width, height) / 2;
@@ -151,3 +151,4 @@
           onMouseLeave={this.handleMouseLeave}
-          outerRadius={outerRadius || maxRadius * 0.8}/>
+          outerRadius={outerRadius || maxRadius * 0.8}
+        />
       );
@@ -158,3 +159,3 @@ });
   render() {
-    const {style, children} = this.props;
+    const { style, children } = this.props;
     const items = ReactUtils.findAllByType(children, PieItem);
@@ -165,3 +166,4 @@ const legendItem = ReactUtils.findChildByType(children, Legend);
       <div className="recharts-wrapper"
-        style={{position: 'relative', cursor: 'default', ...style}}>
+        style={{ position: 'relative', cursor: 'default', ...style }}
+      >
 
@@ -168,0 +170,0 @@ {legendItem && legendItem.props.layout === 'horizontal'

src/chartWrapper/PieItem.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 
@@ -3,0 +3,0 @@ class PieItem extends React.Component {

src/chartWrapper/RadialBarChart.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 
@@ -61,3 +61,3 @@ import Surface from '../container/Surface';
     style: {},
-    margin: {top: 0, right: 0, bottom: 0, left: 0},
+    margin: { top: 0, right: 0, bottom: 0, left: 0 },
   };
@@ -72,3 +72,3 @@
     activeTooltipPosition: 'left-bottom',
-    activeTooltipCoord: {x: 0, y: 0},
+    activeTooltipCoord: { x: 0, y: 0 },
     isTooltipActive: false,
@@ -85,3 +85,3 @@ };
   getComposeData(barPosition, radiusScale, center, dataKey) {
-    const {data} = this.props;
+    const { data } = this.props;
     const pos = barPosition[dataKey];
@@ -107,3 +107,3 @@
   getCenter() {
-    const {cx, cy, width, height, margin} = this.props;
+    const { cx, cy, width, height, margin } = this.props;
 
@@ -121,3 +121,3 @@ return {
   getRadiusList(items) {
-    const {barRadius} = this.props;
+    const { barRadius } = this.props;
 
@@ -138,3 +138,3 @@ return items.map((child) => {
   getRadiusScale(center) {
-    const {data, innerRadius, outerRadius, margin} = this.props;
+    const { data, innerRadius, outerRadius, margin } = this.props;
     const bandCount = Math.max(data.length, 1);
@@ -162,3 +162,3 @@ const maxRadius = Math.min.apply(null, [
   getBarPosition(bandRadius, radiusList) {
-    const {barGapRadius, barOffsetRadius} = this.props;
+    const { barGapRadius, barOffsetRadius } = this.props;
     const len = radiusList.length;
@@ -173,4 +173,4 @@ let result;
       sum += (len - 1) * barGapRadius;
-      const offset =  - sum / 2   >> 0;
-      let prev = {offset: offset - barGapRadius, radius: 0};
+      const offset = -sum / 2 >> 0;
+      let prev = { offset: offset - barGapRadius, radius: 0 };
 
@@ -229,3 +229,3 @@ result = radiusList.reduce((res, entry) => {
   renderLegend(legendItem) {
-    const {data, width, height} = this.props;
+    const { data, width, height } = this.props;
 
@@ -248,3 +248,3 @@ const legendData = data.map(entry => {
   renderTooltip() {
-    const {children} = this.props;
+    const { children } = this.props;
     const tooltipItem = ReactUtils.findChildByType(children, Tooltip);
@@ -271,3 +271,3 @@
     return items.map((child, i) => {
-      const {dataKey, ...other} = child.props;
+      const { dataKey, ...other } = child.props;
 
@@ -281,3 +281,4 @@ return (
           onMouseEnter={this.handleMouseEnter.bind(null, dataKey)}
-          data={this.getComposeData(barPosition, radiusScale, center, dataKey)}/>
+          data={this.getComposeData(barPosition, radiusScale, center, dataKey)}
+        />
       );
@@ -288,3 +289,3 @@ }, this);
   render() {
-    const {style, children} = this.props;
+    const { style, children } = this.props;
     const items = ReactUtils.findAllByType(children, RadialBarItem);
@@ -297,3 +298,4 @@ const legendItem = ReactUtils.findChildByType(children, Legend);
       <div className="recharts-wrapper"
-        style={{cursor: 'default', ...style, position: 'relative'}}>
+        style={{ cursor: 'default', ...style, position: 'relative' }}
+      >
 
@@ -300,0 +302,0 @@ {legendItem && legendItem.props.layout === 'horizontal'

src/chartWrapper/RadialBarItem.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 
@@ -3,0 +3,0 @@ class RadialBarItem extends React.Component {

src/chartWrapper/ScatterChart.js

@@ -1,6 +0,5 @@
-import React, {PropTypes} from 'react';
-import {getNiceTickValues} from 'recharts-scale';
-import {linear} from 'd3-scale';
+import React, { PropTypes } from 'react';
+import { getNiceTickValues } from 'recharts-scale';
+import { linear } from 'd3-scale';
 
-
 import Surface from '../container/Surface';
@@ -46,3 +45,3 @@ import Layer from '../container/Layer';
     style: {},
-    margin: {top: 20, right: 20, bottom: 20, left: 20},
+    margin: { top: 20, right: 20, bottom: 20, left: 20 },
   };
@@ -56,3 +55,3 @@
     activeTooltipPosition: 'left-bottom',
-    activeTooltipCoord: {x: 0, y: 0},
+    activeTooltipCoord: { x: 0, y: 0 },
     isTooltipActive: false,
@@ -167,3 +166,3 @@ activeGroupId: null,
   getAxis(axisType = 'xAxis', items) {
-    const {children} = this.props;
+    const { children } = this.props;
     const Axis = axisType === 'xAxis' ? XAxis : YAxis;
@@ -192,3 +191,3 @@ const axis = ReactUtils.findChildByType(children, Axis);
   getZAxis(items) {
-    const {children} = this.props;
+    const { children } = this.props;
     const axisItem = ReactUtils.findChildByType(children, ZAxis);
@@ -206,4 +205,4 @@ const axisProps = (axisItem && axisItem.props) || ZAxis.defaultProps;
   getOffset(xAxis, yAxis) {
-    const {width, height, margin} = this.props;
-    const offset = {...margin};
+    const { width, height, margin } = this.props;
+    const offset = { ...margin };
 
@@ -250,3 +249,3 @@ offset[xAxis.orient] += xAxis.height;
   getFormatAxis(axis, offset, axisType) {
-    const {orient, domain, tickFormat} = axis;
+    const { orient, domain, tickFormat } = axis;
     const range = axisType === 'xAxis' ?
@@ -258,3 +257,5 @@ [offset.left, offset.left + offset.width] :
     this.setTicksOfScale(scale, axis);
-    tickFormat && scale.tickFormat(tickFormat);
+    if (tickFormat) {
+      scale.tickFormat(tickFormat);
+    }
 
@@ -268,3 +269,3 @@ let x;
     } else {
-      x  = orient === 'left' ? offset.left - axis.width : offset.right;
+      x = orient === 'left' ? offset.left - axis.width : offset.right;
       y = offset.top;
@@ -325,3 +326,3 @@ }
       activeItem: el,
-      activeTooltipCoord: {x: el.cx, y: el.cy},
+      activeTooltipCoord: { x: el.cx, y: el.cy },
     });
@@ -347,3 +348,3 @@ }
   renderTooltip(items, xAxis, yAxis, zAxis) {
-    const {children} = this.props;
+    const { children } = this.props;
     const tooltipItem = ReactUtils.findChildByType(children, Tooltip);
@@ -355,5 +356,5 @@
 
-    const {chartX, chartY, isTooltipActive,
+    const { chartX, chartY, isTooltipActive,
           activeItem, activeTooltipCoord,
-          activeTooltipPosition} = this.state;
+          activeTooltipPosition } = this.state;
 
@@ -386,3 +387,4 @@ return React.cloneElement(tooltipItem, {
         verticalPoints={this.getGridTicks(xAxis)}
-        horizontalPoints={this.getGridTicks(yAxis)}/>
+        horizontalPoints={this.getGridTicks(yAxis)}
+      />
     );
@@ -400,3 +402,3 @@ }
     const legendData = items.map((child) => {
-      const {name, fill, legendType} = child.props;
+      const { name, fill, legendType } = child.props;
 
@@ -422,3 +424,3 @@ return {
   renderAxis(axis, layerKey) {
-    const {width, height} = this.props;
+    const { width, height } = this.props;
 
@@ -434,4 +436,5 @@ if (axis) {
             orient={axis.orient}
-            viewBox={{x: 0, y: 0, width, height}}
-            ticks={this.getAxisTicks(axis)}/>
+            viewBox={{ x: 0, y: 0, width, height }}
+            ticks={this.getAxisTicks(axis)}
+          />
         </Layer>
@@ -450,6 +453,6 @@ );
   renderItems(items, xAxis, yAxis, zAxis) {
-    const {activeScatterKey} = this.state;
+    const { activeScatterKey } = this.state;
 
     return items.map((child, i) => {
-      const {strokeWidth, data, ...other} = child.props;
+      const { strokeWidth, data, ...other } = child.props;
 
@@ -467,3 +470,4 @@ let finalStrokeWidth = strokeWidth === +strokeWidth ? strokeWidth : 1;
           onMouseEnter={this.handleScatterMouseEnter}
-          data={this.getComposeData(data, xAxis, yAxis, zAxis)}/>
+          data={this.getComposeData(data, xAxis, yAxis, zAxis)}
+        />
       );
@@ -474,3 +478,3 @@ }, this);
   render() {
-    const {style, children} = this.props;
+    const { style, children } = this.props;
     const items = ReactUtils.findAllByType(children, ScatterItem);
@@ -488,3 +492,4 @@ const legendItem = ReactUtils.findChildByType(children, Legend);
       <div className="recharts-wrapper"
-        style={{position: 'relative', cursor: 'default', ...style}}>
+        style={{ position: 'relative', cursor: 'default', ...style }}
+      >
 
@@ -491,0 +496,0 @@ {legendItem && legendItem.props.layout === 'horizontal'

src/chartWrapper/ScatterItem.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 
@@ -3,0 +3,0 @@ class ScatterItem extends React.Component {

src/chartWrapper/TreemapChart.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 
@@ -19,2 +19,6 @@ import Surface from '../container/Surface';
     ratio: PropTypes.number,
+    children: PropTypes.oneOfType([
+      PropTypes.arrayOf(PropTypes.node),
+      PropTypes.node,
+    ]),
   };
@@ -27,3 +31,3 @@
   pad(node) {
-    return {x: node.x, y: node.y, dx: node.dx, dy: node.dy};
+    return { x: node.x, y: node.y, dx: node.dx, dy: node.dy };
   }
@@ -95,3 +99,3 @@
     const n = row.length;
-    const {ratio} = this.props;
+    const { ratio } = this.props;
 
@@ -150,7 +154,7 @@ while (++i < n) {
   renderAllNodes() {
-    const {width, height, data, children} = this.props;
+    const { width, height, data, children } = this.props;
     const treemapItem = children.props.element;
-    
+
     const nodes = {
-      value: data.reduce((a, b)=>(a + b.value), 0),
+      value: data.reduce((a, b) => (a + b.value), 0),
       children: data,
@@ -169,3 +173,3 @@ x: 0,
         {
-          React.cloneElement(treemapItem, {node: v, index: i})
+          React.cloneElement(treemapItem, { node: v, index: i })
         }
@@ -177,3 +181,3 @@ </Layer>
   render() {
-    const {width, height} = this.props;
+    const { width, height } = this.props;
 
@@ -180,0 +184,0 @@ return (

src/chartWrapper/TreemapItem.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 
@@ -7,3 +7,3 @@ class TreemapItem extends React.Component {
   static propTypes = {
-    element: PropTypes.element
+    element: PropTypes.element,
   };
@@ -10,0 +10,0 @@

src/chartWrapper/XAxis.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 
@@ -3,0 +3,0 @@ class XAxis extends React.Component {

src/chartWrapper/YAxis.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 
@@ -3,0 +3,0 @@ class YAxis extends React.Component {

src/chartWrapper/ZAxis.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 
@@ -3,0 +3,0 @@ class ZAxis extends React.Component {

src/component/Background.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 import pureRender from 'pure-render-decorator';
@@ -30,3 +30,3 @@
   render() {
-    const {className, ...others} = this.props;
+    const { className, ...others } = this.props;
 
@@ -33,0 +33,0 @@ return (

src/component/Brush.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 import D3Scale from 'd3-scale';
@@ -80,3 +80,3 @@ import Layer from '../container/Layer';
 
-  getIndex({startX, endX}) {
+  getIndex({ startX, endX }) {
     const min = Math.min(startX, endX);
@@ -117,4 +117,4 @@ const max = Math.max(startX, endX);
   handleSlideMove = (e) => {
-    const {slideMoveStartX, startX, endX} = this.state;
-    const {x, width, burshWidth, onBrushChange} = this.props;
+    const { slideMoveStartX, startX, endX } = this.state;
+    const { x, width, burshWidth, onBrushChange } = this.props;
     let delta = e.pageX - slideMoveStartX;
@@ -138,3 +138,5 @@
     }, () => {
-      onBrushChange && onBrushChange(newIndex);
+      if (onBrushChange) {
+        onBrushChange(newIndex);
+      }
     });
@@ -153,7 +155,7 @@ }
   handleBrushMove = (e) => {
-    const {brushMoveStartX, movingBrushId} = this.state;
+    const { brushMoveStartX, movingBrushId } = this.state;
     const prevValue = this.state[movingBrushId];
-    const {x, width, burshWidth, onBrushChange} = this.props;
+    const { x, width, burshWidth, onBrushChange } = this.props;
 
-    const params = {startX: this.state.startX, endX: this.state.endX};
+    const params = { startX: this.state.startX, endX: this.state.endX };
     let delta = e.pageX - brushMoveStartX;
@@ -175,3 +177,5 @@
     }, () => {
-      onBrushChange && onBrushChange(newIndex);
+      if (onBrushChange) {
+        onBrushChange(newIndex);
+      }
     });
@@ -181,3 +185,3 @@ }
   renderBackground() {
-    const {x, y, width, height, fill, stroke} = this.props;
+    const { x, y, width, height, fill, stroke } = this.props;
 
@@ -191,3 +195,4 @@ return (
         width={width}
-        height={height}/>
+        height={height}
+      />
     );
@@ -197,3 +202,3 @@ }
   renderBrush(startX, id) {
-    const {y, burshWidth, height, stroke} = this.props;
+    const { y, burshWidth, height, stroke } = this.props;
     const lineY = Math.floor(y + height / 2) - 1;
@@ -206,3 +211,4 @@ const x = Math.max(startX, this.props.x);
         onMouseDown={this.handleBrushDown.bind(null, id)}
-        style={{cursor: 'col-resize'}}>
+        style={{ cursor: 'col-resize' }}
+      >
         <rect
@@ -214,3 +220,4 @@ x={x}
           fill={stroke}
-          stroke="none"/>
+          stroke="none"
+        />
         <line x1={x + 1} y1={lineY} x2={x + burshWidth - 1} y2={lineY} fill="none" stroke="#fff"/>
@@ -223,3 +230,3 @@ <line x1={x + 1} y1={lineY + 2} x2={x + burshWidth - 1} y2={lineY + 2} fill="none" stroke="#fff"/>
   renderSlide(startX, endX) {
-    const {y, height} = this.props;
+    const { y, height } = this.props;
 
@@ -229,3 +236,3 @@ return (
         onMouseDown={this.handleSlideDown}
-        style={{cursor: 'move'}}
+        style={{ cursor: 'move' }}
         stroke="none"
@@ -236,3 +243,4 @@ fill="#e5e5f7"
         width={Math.abs(endX - startX)}
-        height={height}/>
+        height={height}
+      />
     );
@@ -242,4 +250,4 @@ }
   renderText() {
-    const {data, y, height, burshWidth, stroke} = this.props;
-    const {startIndex, endIndex, startX, endX} = this.state;
+    const { data, y, height, burshWidth, stroke } = this.props;
+    const { startIndex, endIndex, startX, endX } = this.state;
     const offset = 5;
@@ -264,4 +272,4 @@ const style = {
   render() {
-    const {x, width, burshWidth, data, className} = this.props;
-    const {startX, endX} = this.state;
+    const { x, width, burshWidth, data, className } = this.props;
+    const { startX, endX } = this.state;
 
@@ -273,3 +281,4 @@ if (!data || !data.length) {return null;}
         onMouseUp={this.handleUp}
-        onMouseMove={this.handleMove}>
+        onMouseMove={this.handleMove}
+      >
         {this.renderBackground()}
@@ -276,0 +285,0 @@ {this.renderSlide(startX, endX)}

src/component/CartesianAxis.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 import DOMUtils from '../util/DOMUtils';
@@ -43,3 +43,3 @@ import pureRender from 'pure-render-decorator';
     height: 0,
-    viewBox: {x: 0, y: 0, width: 0, height: 0},
+    viewBox: { x: 0, y: 0, width: 0, height: 0 },
     // 坐标轴所在的方位
@@ -65,3 +65,3 @@ orient: 'bottom',
   static getTicks(props) {
-    const {ticks, viewBox, minLabelGap, orient, interval} = props;
+    const { ticks, viewBox, minLabelGap, orient, interval } = props;
 
@@ -82,3 +82,3 @@ if (!ticks || !ticks.length) { return [];}
   static getAutoIntervalTicks(ticks, viewBox, orient, minLabelGap) {
-    const {x, y, width, height} = viewBox;
+    const { x, y, width, height } = viewBox;
     const sizeKey = (orient === 'top' || orient === 'bottom') ? 'width' : 'height';
@@ -112,3 +112,3 @@ const sign = ticks.length >= 2 ? Math.sign(ticks[1].coord - ticks[0].coord) : 1;
   getTickLineCoord(data) {
-    const {x, y, width, height, orient, tickSize} = this.props;
+    const { x, y, width, height, orient, tickSize } = this.props;
     let x1;
@@ -122,41 +122,41 @@ let x2;
     switch (orient) {
-    case 'top':
-      x1 = x2 = data.coord;
-      y1 = y + height - finalTickSize;
-      y2 = y + height;
-      break;
-    case 'left':
-      y1 = y2 = data.coord;
-      x1 = x + width - finalTickSize;
-      x2 = x + width;
-      break;
-    case 'right':
-      y1 = y2 = data.coord;
-      x1 = x + finalTickSize;
-      x2 = x;
-      break;
-    default:
-      x1 = x2 = data.coord;
-      y1 = y + finalTickSize;
-      y2 = y;
-      break;
+      case 'top':
+        x1 = x2 = data.coord;
+        y1 = y + height - finalTickSize;
+        y2 = y + height;
+        break;
+      case 'left':
+        y1 = y2 = data.coord;
+        x1 = x + width - finalTickSize;
+        x2 = x + width;
+        break;
+      case 'right':
+        y1 = y2 = data.coord;
+        x1 = x + finalTickSize;
+        x2 = x;
+        break;
+      default:
+        x1 = x2 = data.coord;
+        y1 = y + finalTickSize;
+        y2 = y;
+        break;
     }
 
-    return {x1, y1, x2, y2};
+    return { x1, y1, x2, y2 };
   }
 
   getBaseline() {
-    const {orient} = this.props;
+    const { orient } = this.props;
     let baseline;
 
     switch (orient) {
-    case 'top':
-      baseline = 'auto';
-      break;
-    case 'bottom':
-      baseline = 'text-before-edge';
-      break;
-    default:
-      baseline = 'central';
-      break;
+      case 'top':
+        baseline = 'auto';
+        break;
+      case 'bottom':
+        baseline = 'text-before-edge';
+        break;
+      default:
+        baseline = 'central';
+        break;
     }
@@ -168,15 +168,15 @@
   getTickTextAnchor() {
-    const {orient} = this.props;
+    const { orient } = this.props;
     let textAnchor;
 
     switch (orient) {
-    case 'left':
-      textAnchor = 'end';
-      break;
-    case 'right':
-      textAnchor = 'start';
-      break;
-    default:
-      textAnchor = 'middle';
-      break;
+      case 'left':
+        textAnchor = 'end';
+        break;
+      case 'right':
+        textAnchor = 'start';
+        break;
+      default:
+        textAnchor = 'middle';
+        break;
     }
@@ -188,16 +188,16 @@
   getDy() {
-    const {orient} = this.props;
+    const { orient } = this.props;
     let dy = 0;
 
     switch (orient) {
-    case 'left':
-    case 'right':
-      dy = 8;
-      break;
-    case 'top':
-      dy = -2;
-      break;
-    default:
-      dy = 15;
-      break;
+      case 'left':
+      case 'right':
+        dy = 8;
+        break;
+      case 'top':
+        dy = -2;
+        break;
+      default:
+        dy = 15;
+        break;
     }
@@ -209,18 +209,18 @@
   renderAxis() {
-    const {x, y, width, height, orient, stroke} = this.props;
+    const { x, y, width, height, orient, stroke } = this.props;
     let axis;
 
     switch (orient) {
-    case 'top':
-      axis = <line className="axis-line" stroke={stroke} x1={x} y1={y + height} x2={x + width} y2={y + height}/>;
-      break;
-    case 'left':
-      axis = <line className="axis-line" stroke={stroke} x1={x + width} y1={y} x2={x + width} y2={y + height}/>;
-      break;
-    case 'right':
-      axis = <line className="axis-line" stroke={stroke} x1={x} y1={y} x2={x} y2={y + height}/>;
-      break;
-    default:
-      axis = <line className="axis-line" stroke={stroke} x1={x} y1={y} x2={x + width} y2={y}/>;
-      break;
+      case 'top':
+        axis = <line className="axis-line" stroke={stroke} x1={x} y1={y + height} x2={x + width} y2={y + height}/>;
+        break;
+      case 'left':
+        axis = <line className="axis-line" stroke={stroke} x1={x + width} y1={y} x2={x + width} y2={y + height}/>;
+        break;
+      case 'right':
+        axis = <line className="axis-line" stroke={stroke} x1={x} y1={y} x2={x} y2={y + height}/>;
+        break;
+      default:
+        axis = <line className="axis-line" stroke={stroke} x1={x} y1={y} x2={x + width} y2={y}/>;
+        break;
     }
@@ -232,3 +232,3 @@
   renderTicks() {
-    const {ticks, hasTick, stroke, customContent} = this.props;
+    const { ticks, hasTick, stroke, customContent } = this.props;
 
@@ -253,3 +253,4 @@ if (!ticks || !ticks.length) { return null; }
               x2={lineCoord.x2}
-              y2={lineCoord.y2}/>
+              y2={lineCoord.y2}
+            />
           )}
@@ -267,3 +268,6 @@ {React.isValidElement(customContent) ? React.cloneElement(customContent, {
             textAnchor={textAnchor}
-            className="tick-value">{entry.value}</text>
+            className="tick-value"
+          >
+            {entry.value}
+          </text>
           )}
@@ -282,3 +286,3 @@ </g>
   render() {
-    const {hasAxis, width, height, ticks} = this.props;
+    const { hasAxis, width, height, ticks } = this.props;
 
@@ -285,0 +289,0 @@ if (width <= 0 || height <= 0 || !ticks || !ticks.length) {

src/component/CartesianGrid.js

@@ -47,4 +47,4 @@ import React, { PropTypes } from 'react';
   renderHorizontal() {
-    const {x, y, width, height, horizontal, vertical, horizontalPoints,
-        verticalPoints, ...others} = this.props;
+    const { x, y, width, height, horizontal, vertical, horizontalPoints,
+        verticalPoints, ...others } = this.props;
 
@@ -72,4 +72,4 @@ if (!horizontalPoints || !horizontalPoints.length) { return null; }
   renderVertical() {
-    const {x, y, width, height, horizontal, vertical,
-         horizontalPoints, verticalPoints, ...others} = this.props;
+    const { x, y, width, height, horizontal, vertical,
+         horizontalPoints, verticalPoints, ...others } = this.props;
 
@@ -94,3 +94,3 @@ if (!verticalPoints || !verticalPoints.length) { return null; }
   render() {
-    const {width, height, horizontal, vertical} = this.props;
+    const { width, height, horizontal, vertical } = this.props;
 
@@ -97,0 +97,0 @@ if (width <= 0 || height <= 0) {

src/component/DefaultTooltipContent.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 import pureRender from 'pure-render-decorator';
@@ -33,6 +33,6 @@
   renderContent() {
-    const {data, separator, formatter, itemStyle} = this.props;
+    const { data, separator, formatter, itemStyle } = this.props;
 
     if (data && data.length) {
-      const listStyle = {padding: 0, margin: 0};
+      const listStyle = { padding: 0, margin: 0 };
       const items = data.map((entry, i) => {
@@ -63,3 +63,3 @@ const finalItemStyle = {
   render() {
-    const {labelStyle, label} = this.props;
+    const { labelStyle, label } = this.props;
     const finalLabelStyle = {
@@ -66,0 +66,0 @@ margin: 0,

src/component/Legend.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 import Surface from '../container/Surface';
@@ -53,18 +53,18 @@ import pureRender from 'pure-render-decorator';
     switch (data.type) {
-    case 'line':
-      fill = 'none';
-      path = `M0,${halfSize}h${thirdSize}A${sixthSize},${sixthSize},0,1,1,${2 * thirdSize},${halfSize}H${SIZE}M${2 * thirdSize},${halfSize}A${sixthSize},${sixthSize},0,1,1,${thirdSize},${halfSize}`;
-      break;
-    case 'scatter':
-      stroke = 'none';
-      path = `M${halfSize},0A${halfSize},${halfSize},0,1,1,${halfSize},${SIZE}A${halfSize},${halfSize},0,1,1,${halfSize},0Z`;
-      break;
-    case 'rect':
-      stroke = 'none';
-      path = `M0,${SIZE / 8}h${SIZE}v${SIZE * 3 / 4}h${-SIZE}z`;
-      break;
-    default:
-      stroke = 'none';
-      path = `M0,0h${SIZE}v${SIZE}h${-SIZE}z`;
-      break;
+      case 'line':
+        fill = 'none';
+        path = `M0,${halfSize}h${thirdSize}A${sixthSize},${sixthSize},0,1,1,${2 * thirdSize},${halfSize}H${SIZE}M${2 * thirdSize},${halfSize}A${sixthSize},${sixthSize},0,1,1,${thirdSize},${halfSize}`;
+        break;
+      case 'scatter':
+        stroke = 'none';
+        path = `M${halfSize},0A${halfSize},${halfSize},0,1,1,${halfSize},${SIZE}A${halfSize},${halfSize},0,1,1,${halfSize},0Z`;
+        break;
+      case 'rect':
+        stroke = 'none';
+        path = `M0,${SIZE / 8}h${SIZE}v${SIZE * 3 / 4}h${-SIZE}z`;
+        break;
+      default:
+        stroke = 'none';
+        path = `M0,0h${SIZE}v${SIZE}h${-SIZE}z`;
+        break;
     }
@@ -79,6 +79,6 @@
   renderItems() {
-    const {data, iconSize, layout} = this.props;
-    const viewBox = {x: 0, y: 0, width: SIZE, height: SIZE};
-    const itemStyle = {display: layout === 'horizontal' ? 'inline-block' : 'block', marginRight: 10};
-    const svgStyle = {display: 'inline-block', verticalAlign: 'middle', marginRight: 4};
+    const { data, iconSize, layout } = this.props;
+    const viewBox = { x: 0, y: 0, width: SIZE, height: SIZE };
+    const itemStyle = { display: layout === 'horizontal' ? 'inline-block' : 'block', marginRight: 10 };
+    const svgStyle = { display: 'inline-block', verticalAlign: 'middle', marginRight: 4 };
 
@@ -98,3 +98,3 @@ return data.map((entry, i) => {
   render() {
-    const {data, width, height, layout, align, style} = this.props;
+    const { data, width, height, layout, align, style } = this.props;
 
@@ -107,4 +107,4 @@ if (!data || !data.length || width <= 0 || height <= 0) {
       margin: 0,
-      width: width,
-      height: height,
+      width,
+      height,
       textAlign: layout === 'horizontal' ? align : 'left',
@@ -117,3 +117,3 @@ };
 
-    finalStyle = {...finalStyle, ...style};
+    finalStyle = { ...finalStyle, ...style };
 
@@ -120,0 +120,0 @@ return (

src/component/PolarAngleAxis.js

@@ -50,3 +50,3 @@ /**
   getTickLineCoord(data) {
-    const {cx, cy, outerRadius, orientation, tickSize} = this.props;
+    const { cx, cy, outerRadius, orientation, tickSize } = this.props;
     const sin = Math.sin(-data.angle * RADIAN);
@@ -67,19 +67,19 @@ const cos = Math.cos(-data.angle * RADIAN);
     switch (orientation) {
-    case 'inner':
-      x0 = cx + (outerRadius - finalTickSize - offset) * cos;
-      y0 = cy + (outerRadius - finalTickSize - offset) * sin;
+      case 'inner':
+        x0 = cx + (outerRadius - finalTickSize - offset) * cos;
+        y0 = cy + (outerRadius - finalTickSize - offset) * sin;
 
-      x1 = cx + (outerRadius - finalTickSize) * cos;
-      y1 = cy + (outerRadius - finalTickSize) * sin;
-      break;
-    default:
-      x0 = cx + (outerRadius + finalTickSize + offset) * cos;
-      y0 = cy + (outerRadius + finalTickSize + offset) * sin;
+        x1 = cx + (outerRadius - finalTickSize) * cos;
+        y1 = cy + (outerRadius - finalTickSize) * sin;
+        break;
+      default:
+        x0 = cx + (outerRadius + finalTickSize + offset) * cos;
+        y0 = cy + (outerRadius + finalTickSize + offset) * sin;
 
-      x1 = cx + (outerRadius + finalTickSize) * cos;
-      y1 = cy + (outerRadius + finalTickSize) * sin;
-      break;
+        x1 = cx + (outerRadius + finalTickSize) * cos;
+        y1 = cy + (outerRadius + finalTickSize) * sin;
+        break;
     }
 
-    return {x0, y0, x1, y1, x2, y2};
+    return { x0, y0, x1, y1, x2, y2 };
   }
@@ -93,4 +93,4 @@ /**
     const orientation = this.props.orientation;
-    const cos = Math.cos(- data.angle * RADIAN);
-    let  textAnchor;
+    const cos = Math.cos(-data.angle * RADIAN);
+    let textAnchor;
 
@@ -112,3 +112,3 @@ if (cos > eps) {
   renderTicks() {
-    const {ticks} = this.props;
+    const { ticks } = this.props;
 
@@ -131,3 +131,4 @@ if (!ticks || !ticks.length) { return null; }
             x2={lineCoord.x2}
-            y2={lineCoord.y2}/>
+            y2={lineCoord.y2}
+          />
           <text
@@ -137,3 +138,6 @@ x={lineCoord.x0}
             textAnchor={textAnchor}
-            className="tick-value">{entry.value}</text>
+            className="tick-value"
+          >
+            {entry.value}
+          </text>
         </g>
@@ -151,3 +155,3 @@ );
   render() {
-    const {ticks} = this.props;
+    const { ticks } = this.props;
 
@@ -154,0 +158,0 @@ if (!ticks || !ticks.length) {

src/component/PolarGrid.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 import createFragment from 'react-addons-create-fragment';
@@ -47,3 +47,3 @@ import pureRender from 'pure-render-decorator';
   renderPolarAngles() {
-    const {cx, cy, innerRadius, outerRadius, polarAngles} = this.props;
+    const { cx, cy, innerRadius, outerRadius, polarAngles } = this.props;
 
@@ -64,3 +64,4 @@ if (!polarAngles || !polarAngles.length) { return null; }
           x2={cx + cos * outerRadius}
-          y2={cy + sin * outerRadius} />
+          y2={cy + sin * outerRadius}
+        />
       );
@@ -82,3 +83,3 @@ }, items);
   renderConcentricCircle(radius, index) {
-    const {cx, cy} = this.props;
+    const { cx, cy } = this.props;
 
@@ -94,3 +95,3 @@ return <circle className="concentric-circle" stroke="#000" fill="none" key={'circle-' + index} cx={cx} cy={cy} r={radius}/>;
   renderConcentricPolygon(radius, index) {
-    const {cx, cy, polarAngles} = this.props;
+    const { cx, cy, polarAngles } = this.props;
     let path = '';
@@ -115,3 +116,3 @@
   renderConcentricPath() {
-    const {polarRadius, concentricPathType} = this.props;
+    const { polarRadius, concentricPathType } = this.props;
 
@@ -137,3 +138,3 @@ if (!polarRadius || !polarRadius.length) { return null; }
   render() {
-    const {outerRadius} = this.props;
+    const { outerRadius } = this.props;
 
@@ -140,0 +141,0 @@ if (outerRadius <= 0) {

src/component/PolarRadiusAxis.js

@@ -6,3 +6,3 @@ /**
  */
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 import createFragment from 'react-addons-create-fragment';
@@ -48,3 +48,3 @@ import pureRender from 'pure-render-decorator';
   getTickValueCoord(data) {
-    const {angle, cx, cy} = this.props;
+    const { angle, cx, cy } = this.props;
     const sin = Math.sin(-angle * RADIAN);
@@ -60,15 +60,15 @@ const cos = Math.cos(-angle * RADIAN);
   getTickTextAnchor() {
-    const {orientation} = this.props;
+    const { orientation } = this.props;
     let textAnchor;
 
     switch (orientation) {
-    case 'left':
-      textAnchor = 'end';
-      break;
-    case 'right':
-      textAnchor = 'start';
-      break;
-    default:
-      textAnchor = 'middle';
-      break;
+      case 'left':
+        textAnchor = 'end';
+        break;
+      case 'right':
+        textAnchor = 'start';
+        break;
+      default:
+        textAnchor = 'middle';
+        break;
     }
@@ -80,3 +80,3 @@
   renderTicks() {
-    const {ticks, angle} = this.props;
+    const { ticks, angle } = this.props;
     const items = {};
@@ -95,3 +95,6 @@ const textAnchor = this.getTickTextAnchor();
             transform={`rotate(${90 - angle}, ${coord.x}, ${coord.y})`}
-            className="tick-value">{entry.value}</text>
+            className="tick-value"
+          >
+            {entry.value}
+          </text>
         </g>
@@ -109,3 +112,3 @@ );
   render() {
-    const {ticks} = this.props;
+    const { ticks } = this.props;
 
@@ -112,0 +115,0 @@ if (!ticks || !ticks.length) {

src/component/ReferenceLine.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 import pureRender from 'pure-render-decorator';
@@ -44,4 +44,4 @@
   getEndPoints() {
-    const {xAxisMap, yAxisMap, type, value, xAxisId, yAxisId,
-          x, y, width, height} = this.props;
+    const { xAxisMap, yAxisMap, type, value, xAxisId, yAxisId,
+          x, y, width, height } = this.props;
     let coord;
@@ -52,7 +52,7 @@
 
-      return [{x, y: coord}, {x: x + width, y: coord}];
+      return [{ x, y: coord }, { x: x + width, y: coord }];
     } else if (type === 'vertical') {
       coord = xAxisMap[xAxisId].scale(value);
 
-      return [{x: coord, y}, {x: coord, y: y + height}];
+      return [{ x: coord, y }, { x: coord, y: y + height }];
     }
@@ -62,3 +62,3 @@ }
   render() {
-    const {type, value, fill, stroke, fillOpacity, strokeOpacity} = this.props;
+    const { type, value, fill, stroke, fillOpacity, strokeOpacity } = this.props;
     if (!type || value !== +value) {return null;}
@@ -78,3 +78,4 @@
         fillOpacity={fillOpacity}
-        strokeOpacity={strokeOpacity}/>
+        strokeOpacity={strokeOpacity}
+      />
     );
@@ -81,0 +82,0 @@ }

src/component/Tooltip.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 import pureRender from 'pure-render-decorator';
@@ -48,5 +48,5 @@ import ReactDOMServer from 'react-dom/server';
     offset: 10,
-    scope: {x1: 0, x2: 0, y1: 0, y2: 0},
+    scope: { x1: 0, x2: 0, y1: 0, y2: 0 },
     position: 'left-bottom',
-    coordinate: {x: 0, y: 0},
+    coordinate: { x: 0, y: 0 },
     cursorStyle: {},
@@ -70,3 +70,3 @@ separator: ' : ',
     );
-    const style = {...wrapperStyle, top: -20000, left: 0, display: 'block'};
+    const style = { ...wrapperStyle, top: -20000, left: 0, display: 'block' };
     const wrapper = document.createElement('div');
@@ -85,10 +85,10 @@
   render() {
-    const {customContent, scope, coordinate, active,
-        label, style, labelStyle, offset} = this.props;
+    const { customContent, scope, coordinate, active,
+        label, style, labelStyle, offset } = this.props;
 
-    let outerStyle = {
+    const outerStyle = {
       pointerEvents: 'none',
       whiteSpace: 'nowrap',
       padding: 10,
-      border: "1px solid #ccc",
+      border: '1px solid #ccc',
       backgroundColor: '#fff',
@@ -95,0 +95,0 @@ display: active ? 'block' : 'none',

src/container/Layer.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 
@@ -19,3 +19,3 @@ class Layer extends React.Component {
   render() {
-    const {children, className, ...others} = this.props;
+    const { children, className, ...others } = this.props;
 
@@ -22,0 +22,0 @@ return (

src/container/Surface.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 
@@ -28,4 +28,4 @@ class Surface extends React.Component {
   render() {
-    const {children, width, height, viewBox, className, style} = this.props;
-    const svgView = viewBox || {width: width, height: height, x: 0, y: 0};
+    const { children, width, height, viewBox, className, style } = this.props;
+    const svgView = viewBox || { width, height, x: 0, y: 0 };
 
@@ -39,3 +39,4 @@ return (
         viewBox={`${svgView.x} ${svgView.y} ${svgView.width} ${svgView.height}`}
-        xmlns="http://www.w3.org/2000/svg" version="1.1">
+        xmlns="http://www.w3.org/2000/svg" version="1.1"
+      >
         {children}
@@ -42,0 +43,0 @@ </svg>

src/shape/Curve.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 import d3Shape from 'd3-shape';
@@ -50,3 +50,3 @@ import pureRender from 'pure-render-decorator';
   getPath() {
-    const {type, points, baseLine, baseLineType} = this.props;
+    const { type, points, baseLine, baseLineType } = this.props;
     const l = d3Shape.line().x(p => p.x)
@@ -69,4 +69,4 @@ .y(p => p.y)
   render() {
-    const {className, points, type, onClick,
-        onMouseEnter, onMouseLeave, ...others} = this.props;
+    const { className, points, type, onClick,
+        onMouseEnter, onMouseLeave, ...others } = this.props;
 
@@ -84,3 +84,4 @@ if (!points || !points.length) {
         onClick={onClick}
-        d={this.getPath()}/>
+        d={this.getPath()}
+      />
     );
@@ -87,0 +88,0 @@ }

src/shape/Rectangle.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 import pureRender from 'pure-render-decorator';
@@ -103,5 +103,5 @@
   render() {
-    const {x, y, width, height, radius,
+    const { x, y, width, height, radius,
         onClick, onMouseEnter, onMouseLeave,
-        className, ...others} = this.props;
+        className, ...others } = this.props;
 
@@ -115,3 +115,4 @@ return (
         onClick={onClick}
-        d={this.getPath(x, y, width, height, radius)}/>
+        d={this.getPath(x, y, width, height, radius)}
+      />
     );
@@ -118,0 +119,0 @@ }

src/shape/Sector.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 import pureRender from 'pure-render-decorator';
@@ -74,5 +74,5 @@ const RADIAN = Math.PI / 180;
   render() {
-    const {cx, cy, innerRadius, outerRadius, startAngle, endAngle,
+    const { cx, cy, innerRadius, outerRadius, startAngle, endAngle,
           onClick, onMouseEnter, onMouseLeave, className,
-          ...others} = this.props;
+          ...others } = this.props;
 
@@ -84,9 +84,10 @@ if (outerRadius < innerRadius || startAngle === endAngle) {
     return (
-     <path
-      {...others}
-      className={'recharts-sector' + (className || '')}
-      onMouseEnter={onMouseEnter}
-      onMouseLeave={onMouseLeave}
-      onClick={onClick}
-      d={this.getPath(cx, cy, innerRadius, outerRadius, startAngle, endAngle)}/>
+      <path
+        {...others}
+        className={'recharts-sector' + (className || '')}
+        onMouseEnter={onMouseEnter}
+        onMouseLeave={onMouseLeave}
+        onClick={onClick}
+        d={this.getPath(cx, cy, innerRadius, outerRadius, startAngle, endAngle)}
+      />
     );
@@ -93,0 +94,0 @@ }

src/shape/Triangle.js

@@ -1,2 +0,2 @@
-import React, {PropTypes} from 'react';
+import React, { PropTypes } from 'react';
 import pureRender from 'pure-render-decorator';
@@ -49,5 +49,5 @@
   render() {
-    const {points, radius, onClick,
+    const { points, radius, onClick,
         onMouseEnter, onMouseLeave,
-        className, ...others} = this.props;
+        className, ...others } = this.props;
 
@@ -61,3 +61,4 @@ return (
         onClick={onClick}
-        d={this.getPath(points, radius)}/>
+        d={this.getPath(points, radius)}
+      />
     );
@@ -64,0 +65,0 @@ }

src/util/DOMUtils.js

 function offset(el) {
-  let box = {top: 0, left: 0};
+  let box = { top: 0, left: 0 };
 
@@ -90,7 +90,7 @@ if (el.getBoundingClientRect) {
 
-  stringCache.span.setAttribute('style', getStyleString({...SPAN_STYLE, ...style}));
+  stringCache.span.setAttribute('style', getStyleString({ ...SPAN_STYLE, ...style }));
   stringCache.span.textContent = str;
 
   const rect = stringCache.span.getBoundingClientRect();
-  const result = {width: rect.width, height: rect.height};
+  const result = { width: rect.width, height: rect.height };
 
@@ -97,0 +97,0 @@ stringCache.widthCache[cacheKey] = result;

src/util/LodashUtils.js

@@ -39,3 +39,3 @@ const numberClass = '[object Number]';
 const isFunction = (value) => {
-  return typeof value == 'function';
+  return typeof value === 'function';
 };
@@ -64,3 +64,3 @@ /**
     };
-  }, {min: Infinity, max: -Infinity});
+  }, { min: Infinity, max: -Infinity });
 };
@@ -123,2 +123,19 @@ /**
 /**
+ * Pad symbol
+ * @param  {number} num    A number
+ * @param  {string} symbol pad sring
+ * @return {array}  the value after pad
+ */
+const pad = (num, symbol) => {
+  let total = '';
+  let temp = num;
+
+  while (temp > 0) {
+    total += symbol;
+    temp--;
+  }
+
+  return total;
+};
+/**
  * 转化成特定的位数
@@ -125,0 +142,0 @@ * @param  {Object} num    数值

test/index.js

 // This is demo
-

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

2340496

increased by0.07%

Lines of code

31425

increased by0.24%

No dependency changes