{"type":"@webflow/XscpData","payload":{"nodes":[{"_id":"6bf3bdcc-9179-7fb7-7754-7d896c01ab7b","type":"Block","tag":"div","classes":["adbef32e-0105-8d17-9885-d5fd3dd718fe"],"children":["6bf3bdcc-9179-7fb7-7754-7d896c01ab7c"],"data":{"tag":"div"}},{"_id":"6bf3bdcc-9179-7fb7-7754-7d896c01ab7c","type":"Block","tag":"div","classes":["b0934d9a-875a-bb42-0630-12090a77fc73"],"children":["6bf3bdcc-9179-7fb7-7754-7d896c01ab7d"],"data":{"tag":"div"}},{"_id":"6bf3bdcc-9179-7fb7-7754-7d896c01ab7d","type":"Block","tag":"div","classes":["d2f5e54b-7279-2e70-b2bd-f51959755dbe"],"children":["6bf3bdcc-9179-7fb7-7754-7d896c01ab7e"],"data":{"tag":"div"}},{"_id":"6bf3bdcc-9179-7fb7-7754-7d896c01ab7e","type":"Block","tag":"div","classes":["ec996ecb-b3d5-a986-c1e4-08d563f8f4a9","f4b1cc80-00bb-576b-d47b-7cb24f557312"],"children":["3bf0a1d4-f735-6dfe-0700-39c57ae4ba2b"],"data":{"tag":"div"}},{"_id":"3bf0a1d4-f735-6dfe-0700-39c57ae4ba2b","type":"Block","tag":"div","classes":["562e2949-56e2-2c85-5ca9-84105bdffac5"],"children":["3bf0a1d4-f735-6dfe-0700-39c57ae4ba2c","6bf3bdcc-9179-7fb7-7754-7d896c01ab7f"],"data":{"tag":"div"}},{"_id":"3bf0a1d4-f735-6dfe-0700-39c57ae4ba2c","type":"Block","tag":"div","classes":["2b7ce42a-68c2-b493-7ffe-3975868fa804","227fe37b-d56b-b60c-b769-67f07f19c5db"],"children":["3bf0a1d4-f735-6dfe-0700-39c57ae4ba2d"],"data":{"tag":"div"}},{"_id":"3bf0a1d4-f735-6dfe-0700-39c57ae4ba2d","type":"Heading","tag":"h2","classes":["b0934d9a-875a-bb42-0630-12090a77fbf5"],"children":["3bf0a1d4-f735-6dfe-0700-39c57ae4ba2e"],"data":{"tag":"h2"}},{"_id":"3bf0a1d4-f735-6dfe-0700-39c57ae4ba2e","text":true,"v":"Team members"},{"_id":"6bf3bdcc-9179-7fb7-7754-7d896c01ab7f","type":"HtmlEmbed","tag":"div","classes":[],"children":[],"v":"<canvas id=\"pie-chart\"></canvas>\n<script src=\"https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.bundle.js\"></script>\n<script>\nnew Chart(document.getElementById(\"pie-chart\"), {\n type: 'pie',\n data: {\n labels: [\"Marketing\",\"Tech\",\"Sales\",\"Operations\"],\n datasets: [\n {\n label: \"Team Members\",\n backgroundColor: [\n \t\t'rgb(76, 42, 163)',\n \t\t'rgb(106, 64, 199)',\n \t \t\t'rgb(159, 120, 235)',\n \t\t'rgb(214, 187, 253)'\n ],\n data: [12,18,4,32]\n }\n ]\n },\n options: {\n }\n});\n</script>","data":{"insideRTE":false,"search":{"exclude":false},"xattr":[],"attr":{"id":""},"visibility":{"conditions":[]},"embed":{"type":"html","meta":{"html":"<canvas id=\"pie-chart\"></canvas>\n<script src=\"https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.bundle.js\"></script>\n<script>\nnew Chart(document.getElementById(\"pie-chart\"), {\n type: 'pie',\n data: {\n labels: [\"Marketing\",\"Tech\",\"Sales\",\"Operations\"],\n datasets: [\n {\n label: \"Team Members\",\n backgroundColor: [\n \t\t'rgb(76, 42, 163)',\n \t\t'rgb(106, 64, 199)',\n \t \t\t'rgb(159, 120, 235)',\n \t\t'rgb(214, 187, 253)'\n ],\n data: [12,18,4,32]\n }\n ]\n },\n options: {\n }\n});\n</script>","div":false,"iframe":false,"script":true}}}}],"styles":[{"_id":"227fe37b-d56b-b60c-b769-67f07f19c5db","fake":false,"type":"class","name":"margin-large","namespace":"","comb":"&","styleLess":"","variants":{},"children":["12eaae9e-0441-2514-40de-9b08f321fd6e"],"createdBy":"5afc9ecb796d35c3f777a957","selector":null},{"_id":"2b7ce42a-68c2-b493-7ffe-3975868fa804","fake":false,"type":"class","name":"margin-bottom","namespace":"","comb":"","styleLess":"margin-top: 0rem; margin-right: 0rem; margin-left: 0rem;","variants":{"medium":{"styleLess":"margin-top: 0rem; margin-right: 0rem; margin-left: 0rem;"},"small":{"styleLess":"margin-top: 0rem; margin-right: 0rem; margin-left: 0rem;"},"tiny":{"styleLess":"margin-top: 0rem; margin-right: 0rem; margin-left: 0rem;"}},"children":["7ebeeefc-d916-6442-5318-9181db0a596b","d49f1cf6-c082-f38c-fc8a-ee71c512df2b","7d093262-973b-b8a9-4143-024ba5aab91f","227fe37b-d56b-b60c-b769-67f07f19c5db","d7c9fdc7-ac46-0373-73f6-abd64633e1ce","d7c9fdc7-ac46-0373-73f6-abd64633e1cf","d7c9fdc7-ac46-0373-73f6-abd64633e1d2","2a5c4c01-be23-948f-632f-5f4430c2f809","c0cc5464-bd71-fa09-6332-5c44bf84767e","33c5ad2a-2edd-bb2e-7df5-00b7202f5888","b112f87f-e5ed-a172-1402-b6a90e131668","a83eb562-da45-04de-ea8f-204105b12a7e","a83eb562-da45-04de-ea8f-204105b12a7f","61f91ae3-7516-4765-2add-736d9c3a580e","ea3670d6-bb54-60a6-3ad4-3cf4708c0ae0","8f27230c-8311-03a7-3489-74912eff8b27","4afb4625-1fbb-0aa6-771a-879e8efcd9f1","e25f0702-d24f-28a2-97e1-b034ec167fdd","541fc608-9a1c-2636-d10c-bf53cef08351","12eaae9e-0441-2514-40de-9b08f321fd6d","4411e0db-ad34-24e5-485e-f9dd430a79b9","8a412fa8-0a3a-11b3-57d7-06762e56adf3","fb70f024-744e-2e4c-2797-ceac947985c8","fb70f024-744e-2e4c-2797-ceac947985cd","21a348df-fbc9-31f1-7fc7-3124a8438316","f342ac88-f3ae-1544-513c-b2e53c871c1c"],"selector":null},{"_id":"b0934d9a-875a-bb42-0630-12090a77fbf5","fake":false,"type":"class","name":"heading-medium","namespace":"","comb":"","styleLess":"font-family: Montserrat; color: #101828; font-size: 2rem; line-height: 1.2; font-weight: 700;","variants":{"small":{"styleLess":"font-size: 1.5rem;"}},"children":["b525e6c3-818a-3c45-9718-0de469373eec","36ae1735-425a-4d17-83db-e010927aabfb","b4fc8725-5c3e-1629-e319-d7d7670dfc35","6b767d21-9360-ad2d-f151-cda14fc75deb"],"selector":null},{"_id":"d2f5e54b-7279-2e70-b2bd-f51959755dbe","fake":false,"type":"class","name":"container-medium","namespace":"","comb":"","styleLess":"width: 100%; max-width: 64rem; margin-right: auto; margin-left: auto;","variants":{},"children":["8a412fa8-0a3a-11b3-57d7-06762e56adf2","f342ac88-f3ae-1544-513c-b2e53c871c20"],"selector":null},{"_id":"ec996ecb-b3d5-a986-c1e4-08d563f8f4a9","fake":false,"type":"class","name":"padding-vertical","namespace":"","comb":"","styleLess":"padding-top: 0rem; padding-bottom: 0rem;","variants":{},"children":["0b0adcbc-4c04-b024-b649-a6af39805c65","1f307a10-bc05-148a-758c-16608bd8d31c","61174a9e-710b-5652-7ea4-5cc6360fc2d6","f4b1cc80-00bb-576b-d47b-7cb24f557312","db730366-5704-b11c-7b21-fef9656aeafe","3a57d424-a9aa-685b-12dc-7474f7d7db28","4293209a-0291-ec71-a8b4-a6f781a4e854","48dc6594-9568-6022-a9af-e30d07a884ef","d6420e2f-ade8-5d64-a138-e5ece125483c","321a0c24-ddaa-24db-6f73-84216ee32ff5","5005ab55-0e28-ce73-5677-2870f1a17666","12eaae9e-0441-2514-40de-9b08f321fd69","12eaae9e-0441-2514-40de-9b08f321fd6a","e34a39a2-5caf-0586-2c36-0ee73cdb17c1"],"createdBy":"5afc9ecb796d35c3f777a957","selector":null},{"_id":"f4b1cc80-00bb-576b-d47b-7cb24f557312","fake":false,"type":"class","name":"padding-huge","namespace":"","comb":"&","styleLess":"position: relative; padding-top: 6rem; padding-bottom: 6rem;","variants":{"tiny":{"styleLess":"padding-top: 4rem; padding-bottom: 4rem;"}},"children":["ba45a163-8b5d-b2e7-24dc-8083e69c4e0e"],"createdBy":"5afc9ecb796d35c3f777a957","selector":null},{"_id":"b0934d9a-875a-bb42-0630-12090a77fc73","fake":false,"type":"class","name":"page-padding","namespace":"","comb":"","styleLess":"padding-right: 5%; padding-left: 5%;","variants":{"small":{"styleLess":"padding-right: 1.25rem; padding-left: 1.25rem;"}},"children":["e3c172b8-b768-d8b6-d05a-3a415f8ba8d2","004b1c3c-f83b-f3f6-abff-48b4d602fdbf","f9800735-c9d9-53eb-75f6-8002429e2384","63c5eb45-b7f1-4035-d7ce-6098c62af126","a4a617e2-c9c1-ea8a-cbbe-0e08e076f1eb","0c80cb99-b4d4-6caf-4b10-25ecdf6cbd2c","613aab2a-49e4-e69f-e8a6-59a235d363a2","fc822cb8-b0a8-81fa-711c-a967a2011e89"],"selector":null},{"_id":"562e2949-56e2-2c85-5ca9-84105bdffac5","fake":false,"type":"class","name":"chart-container","namespace":"","comb":"","styleLess":"padding-top: 2rem; padding-right: 3rem; padding-bottom: 2rem; padding-left: 3rem; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; box-shadow: 0 0 20px -5px hsla(0, 0.00%, 0.00%, 0.15);","variants":{},"children":[],"createdBy":"5afc9ecb796d35c3f777a957","selector":null},{"_id":"adbef32e-0105-8d17-9885-d5fd3dd718fe","fake":false,"type":"class","name":"section-pie-chart","namespace":"","comb":"","styleLess":"display: block; height: auto; justify-content: center; align-items: stretch;","variants":{},"children":[],"createdBy":"5afc9ecb796d35c3f777a957","selector":null}],"assets":[],"ix1":[],"ix2":{"interactions":[],"events":[],"actionLists":[]}},"meta":{"unlinkedSymbolCount":0,"droppedLinks":0,"dynBindRemovedCount":0,"dynListBindRemovedCount":0,"paginationRemovedCount":0}}

Pie Chart

Pie Chart
This component requiere some custom code
Paste this script into the <head> of your page
This component requiere some custom code
Paste this script into the </before> of your page
Join Superflow Pro to unlock this component.
Copy & Paste this component into your Webflow project
Copy & Paste this component into your Webflow project
Get Superflow Pro
Copy to clipboard
Copy to clipboard
Info
Category
Charts
Release
September 14, 2022
Typography
Lato