future-charts-example
Version:
Future Charts - Example
1 lines • 2.67 kB
JavaScript
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("preact-compat")):"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.DonutChart=t(require("preact-compat")):e.DonutChart=t(e.preactCompat)}(this,function(e){return function(e){function t(o){if(r[o])return r[o].exports;var n=r[o]={exports:{},id:o,loaded:!1};return e[o].call(n.exports,n,n.exports,t),n.loaded=!0,n.exports}var r={};return t.m=e,t.c=r,t.p="",t(0)}([function(e,t,r){"use strict";function o(e){return e&&e.__esModule?e:{default:e}}var n=r(1),a=o(n);e.exports=a.default},function(e,t,r){"use strict";function o(e){return e&&e.__esModule?e:{default:e}}function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function a(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function u(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var r=0;r<t.length;r++){var o=t[r];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(e,o.key,o)}}return function(t,r,o){return r&&e(t.prototype,r),o&&e(t,o),t}}(),l=r(2),c=o(l),f=function(e){function t(){return n(this,t),a(this,(t.__proto__||Object.getPrototypeOf(t)).apply(this,arguments))}return u(t,e),i(t,[{key:"render",value:function(){var e=this.props,t=e.radius,r=e.holeSize,o=e.text,n=e.value,a=e.total,u=e.backgroundColor,i=e.valueColor,l=t*(1-(1-r)/2),f=t*(1-r),p=2*Math.PI*l,s=n*p/a+" "+p,d="rotate(-90 "+t+","+t+")",x=l*r*.6;return c.default.createElement("div",{style:{textAlign:"center",fontFamily:"sans-serif"}},c.default.createElement("svg",{width:2*t+"px",height:2*t+"px"},c.default.createElement("circle",{r:l+"px",cx:t+"px",cy:t+"px",transform:d,strokeWidth:f,stroke:u,fill:"none"}),c.default.createElement("circle",{r:l+"px",cx:t+"px",cy:t+"px",transform:d,strokeWidth:f,strokeDasharray:s,fill:"none",stroke:i}),c.default.createElement("text",{x:t+"px",y:t+"px",dy:x/3+"px",textAnchor:"middle",fill:i,fontSize:x+"px"},~~(1e3*n/a)/10,"%")),c.default.createElement("div",{style:{marginTop:"10px"}},o))}}]),t}(c.default.Component);t.default=f,f.defaultProps={holeSize:.8,radius:65,backgroundColor:"#d1d8e7",valueColor:"#49649f"}},function(t,r){t.exports=e}])});