UNPKG

@data-ui/radial-chart

Version:

A package for radial-axis visualizations https://williaster.github.io/data-ui

7 lines 3.75 kB
function _extends(){return _extends=Object.assign||function(a){for(var b,c=1;c<arguments.length;c++)for(var d in b=arguments[c],b)Object.prototype.hasOwnProperty.call(b,d)&&(a[d]=b[d]);return a},_extends.apply(this,arguments)}function _objectWithoutPropertiesLoose(a,b){if(null==a)return{};var c,d,e={},f=Object.keys(a);for(d=0;d<f.length;d++)c=f[d],0<=b.indexOf(c)||(e[c]=a[c]);return e}import{Arc}from"@vx/shape";import React from"react";import PropTypes from"prop-types";import ArcLabel from"../label/ArcLabel";import callOrValue from"../util/callOrValue";import{singleHueScaleFactory}from"../util/fillScaleFactory";var grayScale=singleHueScaleFactory(),propTypes={data:PropTypes.arrayOf(PropTypes.shape({label:PropTypes.string})).isRequired,pieValue:PropTypes.func.isRequired,// (d) => pie value pieSort:PropTypes.func,radius:PropTypes.number,// likely passed by parent innerRadius:PropTypes.oneOfType([PropTypes.func,PropTypes.number]),// (radius) => num outerRadius:PropTypes.oneOfType([PropTypes.func,PropTypes.number]),// (radius) => num labelRadius:PropTypes.oneOfType([PropTypes.func,PropTypes.number]),// (radius) => num labelComponent:PropTypes.oneOfType([PropTypes.func,PropTypes.element]),label:PropTypes.func,// (arc) => node stroke:PropTypes.oneOfType([PropTypes.func,PropTypes.string]),strokeWidth:PropTypes.oneOfType([PropTypes.func,PropTypes.number]),fill:PropTypes.oneOfType([PropTypes.func,PropTypes.string]),fillOpacity:PropTypes.oneOfType([PropTypes.func,PropTypes.number]),padAngle:PropTypes.oneOfType([PropTypes.func,PropTypes.number]),padRadius:PropTypes.oneOfType([PropTypes.func,PropTypes.number]),cornerRadius:PropTypes.oneOfType([PropTypes.func,PropTypes.number]),onMouseMove:PropTypes.func,onMouseLeave:PropTypes.func},INNER_RADIUS_FRACTION=.5,OUTER_RADIUS_FRACTION=.9,LABEL_RADIUS_FRACTION=.75,MIN_ANGLE_FOR_LABEL=.1,defaultProps={radius:300,pieSort:null,innerRadius:function b(a){return a*INNER_RADIUS_FRACTION},outerRadius:function b(a){return a*OUTER_RADIUS_FRACTION},labelRadius:function b(a){return a*LABEL_RADIUS_FRACTION},cornerRadius:3,fill:function b(a){return a.data&&a.data.label?grayScale(a.data.label):"#dddddd"},fillOpacity:1,stroke:"#ffffff",strokeWidth:1,labelComponent:React.createElement(ArcLabel,null),label:null,padAngle:null,padRadius:null,onMouseMove:null,onMouseLeave:null};export default function ArcSeries(a){var b=a.data,c=a.radius,d=a.pieValue,e=a.pieSort,f=a.innerRadius,g=a.outerRadius,h=a.labelRadius,i=a.fill,j=a.fillOpacity,k=a.cornerRadius,l=a.padAngle,m=a.padRadius,n=a.stroke,o=a.strokeWidth,p=a.label,q=a.labelComponent,r=a.onMouseMove,s=a.onMouseLeave,t=_objectWithoutPropertiesLoose(a,["data","radius","pieValue","pieSort","innerRadius","outerRadius","labelRadius","fill","fillOpacity","cornerRadius","padAngle","padRadius","stroke","strokeWidth","label","labelComponent","onMouseMove","onMouseLeave"]);return React.createElement("g",null,React.createElement(Arc,_extends({data:b,pieValue:d,pieSort:e,outerRadius:callOrValue(g,c),innerRadius:callOrValue(f,c),fill:i,fillOpacity:j,stroke:n,strokeWidth:o,cornerRadius:k,padAngle:l,padRadius:m,onMouseMove:s&&function(a){return function(c){var d=Math.abs(a.startAngle-a.endAngle)/(2*Math.PI);r({event:c,data:b,datum:a.data,fraction:d})}},onMouseLeave:s&&function(){return function(){s()}}},t,{centroid:null})),p&&q&&React.createElement(Arc,{data:b,pieValue:d,pieSort:e,outerRadius:callOrValue(h,c),innerRadius:callOrValue(h,c),fill:"none",fillOpacity:0,stroke:"none",strokeWidth:0,centroid:function f(a,b){var c=a[0],d=a[1],e=p(b);return b.endAngle-b.startAngle<MIN_ANGLE_FOR_LABEL||!e?null:React.cloneElement(q,{x:c,y:d,arc:b},e)}}))}ArcSeries.propTypes=propTypes,ArcSeries.defaultProps=defaultProps,ArcSeries.displayName="ArcSeries";