{"id":55,"date":"2013-12-23T20:48:04","date_gmt":"2013-12-23T20:48:04","guid":{"rendered":"http:\/\/wordpress.dev\/crossfit\/?page_id=55"},"modified":"2013-12-23T20:48:04","modified_gmt":"2013-12-23T20:48:04","slug":"pie-charts","status":"publish","type":"page","link":"https:\/\/element5fit.com\/index.php\/shortcodes\/pie-charts\/","title":{"rendered":"Pie Charts"},"content":{"rendered":"<style type=\"text\/css\">#section-title-69ea2981cb12d {\n  margin-top: 40px !important;\n  margin-bottom: 40px !important;\n}\n#section-title-69ea2981cb12d.underline span.title:after {\n  border-color: #dddddd !important;\n}\n<\/style>\n<div id=\"section-title-69ea2981cb12d\" class=\"section_title underline\" style=\"border-color: #dddddd;\">  <span class=\"title\">Legend with Icon<\/span> <span class=\"line\"><span style=\"background: #dddddd;\"><\/span><\/span><\/div>\n<div class=\"one_third \">\n<div class=\"pie_chart\" data-percent=\"26\" data-legend_style=\"icon\" data-icon=\"typicons-weather-stormy\" data-custom_text=\"\" data-line_width=\"17\" data-bar_color=\"#e6389a\" data-background_color=\"#dcdcdc\">\n<div class=\"percentage\"><span class=\"chart_icon typicons-weather-stormy\"><\/span>\t<\/div>\n<p>\t<span class=\"caption\">Legend 1<\/span><\/div>\n<\/div>\n<div class=\"one_third \">\n<div class=\"pie_chart\" data-percent=\"50\" data-legend_style=\"icon\" data-icon=\"typicons-weather-shower\" data-custom_text=\"\" data-line_width=\"17\" data-bar_color=\"#b8e238\" data-background_color=\"#dcdcdc\">\n<div class=\"percentage\"><span class=\"chart_icon typicons-weather-shower\"><\/span>\t<\/div>\n<p>\t<span class=\"caption\">Legend 2<\/span><\/div>\n<\/div>\n<div class=\"one_third column_last\">\n<div class=\"pie_chart\" data-percent=\"90\" data-legend_style=\"icon\" data-icon=\"typicons-weather-sunny\" data-custom_text=\"\" data-line_width=\"17\" data-bar_color=\"#38d9e8\" data-background_color=\"#dcdcdc\">\n<div class=\"percentage\"><span class=\"chart_icon typicons-weather-sunny\"><\/span>\t<\/div>\n<p>\t<span class=\"caption\">Legend 3<\/span><\/div>\n<\/div>\n<p>&nbsp;<\/p>\n<h2 style=\"text-align: center;\">Set your colors, percentages, legend text and center display. Even the <span class=\"highlight\" style=\"background: #33bccc; color: #ffffff;\">thickness of the bar<\/span> can be adjusted!<\/h2>\n<style type=\"text\/css\">#section-title-69ea2981cb281 {\n  margin-top: 40px !important;\n  margin-bottom: 40px !important;\n}\n#section-title-69ea2981cb281.underline span.title:after {\n  border-color: #dddddd !important;\n}\n<\/style>\n<div id=\"section-title-69ea2981cb281\" class=\"section_title underline\" style=\"border-color: #dddddd;\">  <span class=\"title\">Legend with Percentage<\/span> <span class=\"line\"><span style=\"background: #dddddd;\"><\/span><\/span><\/div>\n<div class=\"one_fourth \">\n<div class=\"pie_chart\" data-percent=\"25\" data-legend_style=\"percentage\" data-icon=\"\" data-custom_text=\"Custom Text Here\" data-line_width=\"13\" data-bar_color=\"#9869c4\" data-background_color=\"#dcdcdc\">\n<div class=\"percentage\"><span>25<\/span>%\t<\/div>\n<p>\t<span class=\"caption\">Legend 1<\/span><\/div>\n<\/div>\n<div class=\"one_fourth \">\n<div class=\"pie_chart\" data-percent=\"45\" data-legend_style=\"percentage\" data-icon=\"\" data-custom_text=\"Custom Text Here\" data-line_width=\"13\" data-bar_color=\"#3abe88\" data-background_color=\"#dcdcdc\">\n<div class=\"percentage\"><span>45<\/span>%\t<\/div>\n<p>\t<span class=\"caption\">Legend 2<\/span><\/div>\n<\/div>\n<div class=\"one_fourth \">\n<div class=\"pie_chart\" data-percent=\"60\" data-legend_style=\"percentage\" data-icon=\"\" data-custom_text=\"Custom Text Here\" data-line_width=\"13\" data-bar_color=\"#5081cb\" data-background_color=\"#dcdcdc\">\n<div class=\"percentage\"><span>60<\/span>%\t<\/div>\n<p>\t<span class=\"caption\">Legend 3<\/span><\/div>\n<\/div>\n<div class=\"one_fourth column_last\">\n<div class=\"pie_chart\" data-percent=\"90\" data-legend_style=\"percentage\" data-icon=\"\" data-custom_text=\"Custom Text Here\" data-line_width=\"13\" data-bar_color=\"#ee5f77\" data-background_color=\"#dcdcdc\">\n<div class=\"percentage\"><span>90<\/span>%\t<\/div>\n<p>\t<span class=\"caption\">Legend 4<\/span><\/div>\n<\/div>\n<style type=\"text\/css\">#section-title-69ea2981cb388 {\n  margin-top: 40px !important;\n  margin-bottom: 40px !important;\n}\n#section-title-69ea2981cb388.underline span.title:after {\n  border-color: #dddddd !important;\n}\n<\/style>\n<div id=\"section-title-69ea2981cb388\" class=\"section_title underline\" style=\"border-color: #dddddd;\">  <span class=\"title\">Legend with Custom Text<\/span> <span class=\"line\"><span style=\"background: #dddddd;\"><\/span><\/span><\/div>\n<div class=\"one_third \">\n<div class=\"pie_chart\" data-percent=\"63\" data-legend_style=\"custom_text\" data-icon=\"\" data-custom_text=\"Add Your Own Text\" data-line_width=\"31\" data-bar_color=\"#a4d19f\" data-background_color=\"#e4e4e4\">\n<div class=\"percentage\"><span>Add Your Own Text<\/span>\t<\/div>\n<p>\t<span class=\"caption\">Legend 1<\/span><\/div>\n<\/div>\n<div class=\"one_third \">\n<div class=\"pie_chart\" data-percent=\"85\" data-legend_style=\"custom_text\" data-icon=\"\" data-custom_text=\"Add Your Own Text\" data-line_width=\"31\" data-bar_color=\"#9edde1\" data-background_color=\"#e4e4e4\">\n<div class=\"percentage\"><span>Add Your Own Text<\/span>\t<\/div>\n<p>\t<span class=\"caption\">Legend 2<\/span><\/div>\n<\/div>\n<div class=\"one_third column_last\">\n<div class=\"pie_chart\" data-percent=\"36\" data-legend_style=\"custom_text\" data-icon=\"\" data-custom_text=\"Add Your Own Text\" data-line_width=\"31\" data-bar_color=\"#e9bae0\" data-background_color=\"#e4e4e4\">\n<div class=\"percentage\"><span>Add Your Own Text<\/span>\t<\/div>\n<p>\t<span class=\"caption\">Legend 3<\/span><\/div>\n<\/div>\n<p>&nbsp;<\/p>\n<h2 style=\"text-align: center;\">Insert into columns to create eye-catching css animated pie charts in any configuration you want!<\/h2>\n","protected":false},"excerpt":{"rendered":"<p>&nbsp; Set your colors, percentages, legend text and center display. Even the can&#8230;<\/p>\n","protected":false},"author":4,"featured_media":0,"parent":1239,"menu_order":0,"comment_status":"open","ping_status":"open","template":"","meta":{"_exactmetrics_skip_tracking":false,"_exactmetrics_sitenote_active":false,"_exactmetrics_sitenote_note":"","_exactmetrics_sitenote_category":0,"footnotes":""},"class_list":["post-55","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/element5fit.com\/index.php\/wp-json\/wp\/v2\/pages\/55","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/element5fit.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/element5fit.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/element5fit.com\/index.php\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/element5fit.com\/index.php\/wp-json\/wp\/v2\/comments?post=55"}],"version-history":[{"count":0,"href":"https:\/\/element5fit.com\/index.php\/wp-json\/wp\/v2\/pages\/55\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/element5fit.com\/index.php\/wp-json\/wp\/v2\/pages\/1239"}],"wp:attachment":[{"href":"https:\/\/element5fit.com\/index.php\/wp-json\/wp\/v2\/media?parent=55"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}