# @domoinc/pie > Pie - Domo Widget Latest version **4.0.7** (published 2016-05-02) · SEE LICENSE IN LICENSE license · 0 weekly downloads ## Install ```sh npm install @domoinc/pie pnpm add @domoinc/pie yarn add @domoinc/pie bun add @domoinc/pie ``` ## Health **Score 15/100 (F)** — status: abandoned. Positive: no vulnerabilities. Warnings: low downloads; no types; no esm support. Negative: abandoned; low maintenance score. ## Facts | | | |---|---| | Version | 4.0.7 | | Published | 2016-05-02 | | First published | 2016-01-30 | | Weekly downloads | 0 | | License | SEE LICENSE IN LICENSE | | TypeScript types | none | | Module format | CommonJS | | Dependencies | 7 | | Known vulnerabilities | 0 | | Install scripts | no | | Author | Domo Inc. | | Maintainers | aharris88, andrewjensen, bkingery, clm, dallasnorton, excrispy, jaxry, jgalb, jmstewart, jonathan-law, k4paul, morganjohn12, nicksrandall, scott.davidson.domo | | Keywords | domo, app | ## Links - npm: https://www.npmjs.com/package/@domoinc/pie - npm.io page: https://npm.io/package/@domoinc/pie ## Dependencies (7) - [d3](https://npm.io/package/d3.md) ^3.5.14 - [d3.chart](https://npm.io/package/d3.chart.md) ^0.3.0 - [@domoinc/donut](https://npm.io/package/@domoinc/donut.md) ^7.0.7 - [@domoinc/da-theme2](https://npm.io/package/@domoinc/da-theme2.md) ^2.3.1 - [@domoinc/base-widget](https://npm.io/package/@domoinc/base-widget.md) ^1.5.0 - [@domoinc/domo-tooltip](https://npm.io/package/@domoinc/domo-tooltip.md) ^5.1.10 - [@domoinc/summary-number](https://npm.io/package/@domoinc/summary-number.md) ^0.1.1 ## Recent versions - 4.0.7 (latest) — 2016-05-02 - 4.0.6 — 2016-03-02 - 4.0.5 — 2016-02-18 - 4.0.4 — 2016-02-18 - 4.0.3 — 2016-02-17 - 4.0.2 — 2016-02-16 - 4.0.1 — 2016-02-02 - 4.0.0 — 2016-01-30 ## README # Pie Part to whole comparison pie chart. ## Configuration Options #### bounceOutPercent Type: `number` Default: `1.05` Percent of the inner - outer radius to bounce out on hover #### chartLabelColor Type: `undefined` Default: `"black"` undefined #### chartName Type: `string` Default: `"Pie"` Name of chart for reporting #### chartPrimarySeriesColors Type: `colorArray` Default: `[["#D9EBFD","#B7DAF5","#90c4e4","#73B0D7","#4E8CBA","#31689B"],["#DDF4BA","#BBE491","#A0D771","#80C25D","#559E38","#387B26"],["#FDECAD","#FCCF84","#FBAD56","#FB8D34","#E45621","#A43724"],["#F3E4FE","#DDC8EF","#C5ACDE","#B391CA","#8F6DC0","#7940A1"],["#FCD7E6","#FBB6DD","#F395CD","#EE76BF","#CF51AC","#A62A92"],["#D8F4DE","#ABE4CA","#8DD5BE","#68BEA8","#46998A","#227872"],["#FDDDDD","#FCBCB7","#FD9A93","#FD7F76","#e45850","#c92e25"]]` The primary colors used to represent series data #### generalSeparatorColor Type: `color` Default: `"#FFFFFF"` Color of each slice's stroke (separator) #### generalWashoutColor Type: `color` Default: `"#E4E5E5"` Fill color of any donut slice that is not being hovered #### height Type: `number` Default: `250` Units: `px` #### innerCircleBackgroundFillColor Type: `color` Default: `"none"` Fill color for the donut's inner circle background. None will hide the background. #### innerRadius Type: `number` Default: `0` Radius to the inside of the Donut #### innerTextPadding Type: `number` Default: `20` Padding for the inner text elements #### labelFontSize Type: `number` Default: `50` Units: `px` The font size used for the label text #### labelTextColor Type: `color` Default: `"#888888"` Text color of the label displayed in the center of the donut #### outerRadius Type: `number` Default: `273.5` Radius to the outside of the Donut #### percentageTextPadding Type: `number` Default: `110` Units: `px` How far out to move the percentage text #### shouldValidate Type: `boolean` Default: `true` Flag for turning off data validation #### showInnerTextIndicator Type: `boolean` Default: `false` Shows/Hides the Text indicator in the center of the donut #### sliceStrokeWidth Type: `number` Default: `0.5` Units: `px` Stroke width of each donut slice #### sortData Type: `boolean` Default: `false` If true it will sort the data in descending order #### textColor Type: `undefined` Default: `"black"` undefined #### textFontFamily Type: `string` Default: `"Open Sans"` Tooltip text font family #### tooltipBackgroundColor Type: `color` Default: `"#555555"` Background color of the tooltip #### tooltipTextColor Type: `color` Default: `"#FFFFFF"` Color of the tooltip text #### tooltipTextSize Type: `number` Default: `12` Units: `px` Text size in the tooltip #### updateSizeableConfigs Type: `boolean` Default: `true` Flag for turning off the mimic of illustrator's scale functionality #### valueFontSize Type: `number` Default: `48` Units: `px` The font size used for the value text #### valueTextColor Type: `color` Default: `"#333"` Text color of the value displayed in the center of the donut #### width Type: `number` Default: `250` Units: `px` ## Data Definition #### label Type: `string` Default validate: ```js function (d) { return this.accessor(d) !== undefined; } ``` Default accessor: ```js function (line) { return line[0] === undefined ? undefined : String(line[0]); } ``` #### value Type: `number` Default validate: ```js function (d) { return !isNaN(this.accessor(d)) && this.accessor(d) >= 0 && this.accessor(d); } ``` Default accessor: ```js function (line) { return Number(line[1]); } ``` ## Events #### Dispatch Events dispatch:mouseover dispatch:mouseout dispatch:mousemove #### External Events ## Example ```js //Setup some fake data var data = [ ["North", 5], ["South", 7], ["East", 12], ["West", 3] ]; var aHeight = 500; var aWidth = 500; //Initialze the widget var chartGroup = d3.select("#vis") .append("svg") .attr({ height: aHeight + 'px', width: aWidth + 'px' }) .append("g"); var chart = new Pie(chartGroup) .c({ width: aWidth, height: aHeight }); //Render the chart with data chart._notifier.showMessage(true); chart.draw(data); ``` --- _Source: https://npm.io/package/@domoinc/pie · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._