{"id":9180,"date":"2020-05-22T17:46:42","date_gmt":"2020-05-22T21:46:42","guid":{"rendered":"https:\/\/g33kinfo.com\/info\/?p=9180"},"modified":"2020-05-22T17:46:45","modified_gmt":"2020-05-22T21:46:45","slug":"charts-css","status":"publish","type":"post","link":"https:\/\/g33kinfo.com\/info\/charts-css\/","title":{"rendered":"ChartS.css"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">The point of C\ud83d\udc9aSS.css is to allow easy creation of simple charts for documentation, data storytelling \/ journalism, etc. It features plots of 1-D lists, and has a custom markdown filter that converts suitably formatted lists directly to charts. It has no dependencies (other than a modern browser), and is minimal compared to javascript based charting tools. The html is based on\u00a0<code>&lt;ul><\/code>\u00a0lists and will collapse back to readable lists in the absence of css support, making it accessible to all readers. It is open source and easily configurable according to project needs.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">The non-chart elements on the html version of this page were styled with&nbsp;<a href=\"https:\/\/andybrewer.github.io\/mvp\/\">mvp.css<\/a>. MVP.css was one of the inspirations for C\ud83d\udc9aSS.css. Although C\ud83d\udc9aSS.css turned out very differently, MVP.css got me on to the idea of having a simple, self-contained .css file that could easily transform a text page into something nice.<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-rich\"><div class=\"wp-block-embed__wrapper\">\n<div class=\"github-embed github-embed-repository github-logo-mark\">    <p>        <a href=\"https:\/\/github.com\/rbitr\/ChartS.css\" target=\"_blank\">\t\t\t<strong>\t\t\t\t\t\t\t<\/strong>\t\t<\/a>\t\t<br>        <a href=\"https:\/\/github.com\/rbitr\/ChartS.css\" target=\"_blank\">https:\/\/github.com\/rbitr\/ChartS.css<\/a><br>        <a href=\"https:\/\/github.com\/rbitr\/ChartS.css\/network\" target=\"_blank\">9<\/a> forks.<br>        <a href=\"https:\/\/github.com\/rbitr\/ChartS.css\/stargazers\" target=\"_blank\">177<\/a> stars.<br>        <a href=\"https:\/\/github.com\/rbitr\/ChartS.css\/issues\" target=\"_blank\">4<\/a> open issues.<br>        <details open>            <summary>Recent commits:<\/summary>            <ul class=\"github_commits\">                                    <li class=\"github_commit\">                        <a href=\"https:\/\/github.com\/rbitr\/ChartS.css\/commit\/71fdd6c8984fa52b0fdba9503714b4b88d63933a\" target=\"_blank\">broken link<\/a>, Andrew Marble                    <\/li>                                    <li class=\"github_commit\">                        <a href=\"https:\/\/github.com\/rbitr\/ChartS.css\/commit\/eedc628c46b5f41c44c7d7c4fbf228aa532f8df4\" target=\"_blank\">Minor bugfix and added details to readme<\/a>, Andrew Marble                    <\/li>                                    <li class=\"github_commit\">                        <a href=\"https:\/\/github.com\/rbitr\/ChartS.css\/commit\/5b459e9038e2b7fb47c5c4c79704f85499b66d26\" target=\"_blank\">Minor bugfix and added details to readme<\/a>, Andrew Marble                    <\/li>                                    <li class=\"github_commit\">                        <a href=\"https:\/\/github.com\/rbitr\/ChartS.css\/commit\/8b5ca915852589e16f3ae17f52c41d40dbcfafbb\" target=\"_blank\">Minor bugfix and added details to readme<\/a>, Andrew Marble                    <\/li>                                    <li class=\"github_commit\">                        <a href=\"https:\/\/github.com\/rbitr\/ChartS.css\/commit\/7b64548063c4d5dd9620ed1ac550d335e085fa60\" target=\"_blank\">Minor changes to readme<\/a>, Andrew Marble                    <\/li>                            <\/ul>        <\/details>    <\/p><\/div>\n<\/div><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>The point of C\ud83d\udc9aSS.css is to allow easy creation of simple charts for documentation, data storytelling \/ journalism, etc. It features plots of 1-D lists, and has a custom markdown filter that converts suitably formatted lists directly to charts. It has no dependencies (other than a modern browser), and is minimal compared to javascript based&#8230; <\/p>\n<div class=\"read-more navbutton\"><a href=\"https:\/\/g33kinfo.com\/info\/charts-css\/\">Read More<i class=\"fa fa-angle-double-right\"><\/i><\/a><\/div>\n","protected":false},"author":1,"featured_media":8835,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[9],"tags":[],"class_list":["post-9180","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-info"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.9 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>ChartS.css - Linux Shtuff<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/g33kinfo.com\/info\/charts-css\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"ChartS.css - Linux Shtuff\" \/>\n<meta property=\"og:description\" content=\"The point of C\ud83d\udc9aSS.css is to allow easy creation of simple charts for documentation, data storytelling \/ journalism, etc. It features plots of 1-D lists, and has a custom markdown filter that converts suitably formatted lists directly to charts. It has no dependencies (other than a modern browser), and is minimal compared to javascript based... Read More\" \/>\n<meta property=\"og:url\" content=\"https:\/\/g33kinfo.com\/info\/charts-css\/\" \/>\n<meta property=\"og:site_name\" content=\"Linux Shtuff\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/fb.me\/g33kinf0\" \/>\n<meta property=\"article:author\" content=\"https:\/\/fb.me\/g33kinf0\" \/>\n<meta property=\"article:published_time\" content=\"2020-05-22T21:46:42+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-05-22T21:46:45+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/g33kinfo.com\/info\/wp-content\/uploads\/2020\/03\/Minion_Research.sm_-e1584713481775.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"35\" \/>\n\t<meta property=\"og:image:height\" content=\"44\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"g33kadmin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@https:\/\/twitter.com\/drsinger1111\" \/>\n<meta name=\"twitter:site\" content=\"@drsinger1111\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/charts-css\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/charts-css\\\/\"},\"author\":{\"name\":\"g33kadmin\",\"@id\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/#\\\/schema\\\/person\\\/c022e4c40b13ea1b678e6f020756f547\"},\"headline\":\"ChartS.css\",\"datePublished\":\"2020-05-22T21:46:42+00:00\",\"dateModified\":\"2020-05-22T21:46:45+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/charts-css\\\/\"},\"wordCount\":162,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/#\\\/schema\\\/person\\\/c022e4c40b13ea1b678e6f020756f547\"},\"image\":{\"@id\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/charts-css\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/wp-content\\\/uploads\\\/2020\\\/03\\\/Minion_Research.sm_-e1584713481775.jpg\",\"articleSection\":[\"General Info\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/g33kinfo.com\\\/info\\\/charts-css\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/charts-css\\\/\",\"url\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/charts-css\\\/\",\"name\":\"ChartS.css - Linux Shtuff\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/charts-css\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/charts-css\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/wp-content\\\/uploads\\\/2020\\\/03\\\/Minion_Research.sm_-e1584713481775.jpg\",\"datePublished\":\"2020-05-22T21:46:42+00:00\",\"dateModified\":\"2020-05-22T21:46:45+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/charts-css\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/g33kinfo.com\\\/info\\\/charts-css\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/charts-css\\\/#primaryimage\",\"url\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/wp-content\\\/uploads\\\/2020\\\/03\\\/Minion_Research.sm_-e1584713481775.jpg\",\"contentUrl\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/wp-content\\\/uploads\\\/2020\\\/03\\\/Minion_Research.sm_-e1584713481775.jpg\",\"width\":35,\"height\":44,\"caption\":\"Minion_Research.sm\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/charts-css\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"ChartS.css\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/#website\",\"url\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/\",\"name\":\"Linux Shtuff\",\"description\":\"Because I have CRS Syndrome...\",\"publisher\":{\"@id\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/#\\\/schema\\\/person\\\/c022e4c40b13ea1b678e6f020756f547\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/#\\\/schema\\\/person\\\/c022e4c40b13ea1b678e6f020756f547\",\"name\":\"g33kadmin\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/wp-content\\\/uploads\\\/2022\\\/07\\\/minion-researchA.gif\",\"url\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/wp-content\\\/uploads\\\/2022\\\/07\\\/minion-researchA.gif\",\"contentUrl\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/wp-content\\\/uploads\\\/2022\\\/07\\\/minion-researchA.gif\",\"width\":512,\"height\":512,\"caption\":\"g33kadmin\"},\"logo\":{\"@id\":\"https:\\\/\\\/g33kinfo.com\\\/info\\\/wp-content\\\/uploads\\\/2022\\\/07\\\/minion-researchA.gif\"},\"description\":\"I am a g33k, Linux blogger, developer, student and Tech Writer for Liquidweb.com\\\/kb. My passion for all things tech drives my hunt for all the coolz. I often need a vacation after I get back from vacation....\",\"sameAs\":[\"https:\\\/\\\/thelinuxreport.com\",\"https:\\\/\\\/fb.me\\\/g33kinf0\",\"https:\\\/\\\/x.com\\\/https:\\\/\\\/twitter.com\\\/drsinger1111\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"ChartS.css - Linux Shtuff","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/g33kinfo.com\/info\/charts-css\/","og_locale":"en_US","og_type":"article","og_title":"ChartS.css - Linux Shtuff","og_description":"The point of C\ud83d\udc9aSS.css is to allow easy creation of simple charts for documentation, data storytelling \/ journalism, etc. It features plots of 1-D lists, and has a custom markdown filter that converts suitably formatted lists directly to charts. It has no dependencies (other than a modern browser), and is minimal compared to javascript based... Read More","og_url":"https:\/\/g33kinfo.com\/info\/charts-css\/","og_site_name":"Linux Shtuff","article_publisher":"https:\/\/fb.me\/g33kinf0","article_author":"https:\/\/fb.me\/g33kinf0","article_published_time":"2020-05-22T21:46:42+00:00","article_modified_time":"2020-05-22T21:46:45+00:00","og_image":[{"width":35,"height":44,"url":"https:\/\/g33kinfo.com\/info\/wp-content\/uploads\/2020\/03\/Minion_Research.sm_-e1584713481775.jpg","type":"image\/jpeg"}],"author":"g33kadmin","twitter_card":"summary_large_image","twitter_creator":"@https:\/\/twitter.com\/drsinger1111","twitter_site":"@drsinger1111","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/g33kinfo.com\/info\/charts-css\/#article","isPartOf":{"@id":"https:\/\/g33kinfo.com\/info\/charts-css\/"},"author":{"name":"g33kadmin","@id":"https:\/\/g33kinfo.com\/info\/#\/schema\/person\/c022e4c40b13ea1b678e6f020756f547"},"headline":"ChartS.css","datePublished":"2020-05-22T21:46:42+00:00","dateModified":"2020-05-22T21:46:45+00:00","mainEntityOfPage":{"@id":"https:\/\/g33kinfo.com\/info\/charts-css\/"},"wordCount":162,"commentCount":0,"publisher":{"@id":"https:\/\/g33kinfo.com\/info\/#\/schema\/person\/c022e4c40b13ea1b678e6f020756f547"},"image":{"@id":"https:\/\/g33kinfo.com\/info\/charts-css\/#primaryimage"},"thumbnailUrl":"https:\/\/g33kinfo.com\/info\/wp-content\/uploads\/2020\/03\/Minion_Research.sm_-e1584713481775.jpg","articleSection":["General Info"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/g33kinfo.com\/info\/charts-css\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/g33kinfo.com\/info\/charts-css\/","url":"https:\/\/g33kinfo.com\/info\/charts-css\/","name":"ChartS.css - Linux Shtuff","isPartOf":{"@id":"https:\/\/g33kinfo.com\/info\/#website"},"primaryImageOfPage":{"@id":"https:\/\/g33kinfo.com\/info\/charts-css\/#primaryimage"},"image":{"@id":"https:\/\/g33kinfo.com\/info\/charts-css\/#primaryimage"},"thumbnailUrl":"https:\/\/g33kinfo.com\/info\/wp-content\/uploads\/2020\/03\/Minion_Research.sm_-e1584713481775.jpg","datePublished":"2020-05-22T21:46:42+00:00","dateModified":"2020-05-22T21:46:45+00:00","breadcrumb":{"@id":"https:\/\/g33kinfo.com\/info\/charts-css\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/g33kinfo.com\/info\/charts-css\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/g33kinfo.com\/info\/charts-css\/#primaryimage","url":"https:\/\/g33kinfo.com\/info\/wp-content\/uploads\/2020\/03\/Minion_Research.sm_-e1584713481775.jpg","contentUrl":"https:\/\/g33kinfo.com\/info\/wp-content\/uploads\/2020\/03\/Minion_Research.sm_-e1584713481775.jpg","width":35,"height":44,"caption":"Minion_Research.sm"},{"@type":"BreadcrumbList","@id":"https:\/\/g33kinfo.com\/info\/charts-css\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/g33kinfo.com\/info\/"},{"@type":"ListItem","position":2,"name":"ChartS.css"}]},{"@type":"WebSite","@id":"https:\/\/g33kinfo.com\/info\/#website","url":"https:\/\/g33kinfo.com\/info\/","name":"Linux Shtuff","description":"Because I have CRS Syndrome...","publisher":{"@id":"https:\/\/g33kinfo.com\/info\/#\/schema\/person\/c022e4c40b13ea1b678e6f020756f547"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/g33kinfo.com\/info\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":["Person","Organization"],"@id":"https:\/\/g33kinfo.com\/info\/#\/schema\/person\/c022e4c40b13ea1b678e6f020756f547","name":"g33kadmin","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/g33kinfo.com\/info\/wp-content\/uploads\/2022\/07\/minion-researchA.gif","url":"https:\/\/g33kinfo.com\/info\/wp-content\/uploads\/2022\/07\/minion-researchA.gif","contentUrl":"https:\/\/g33kinfo.com\/info\/wp-content\/uploads\/2022\/07\/minion-researchA.gif","width":512,"height":512,"caption":"g33kadmin"},"logo":{"@id":"https:\/\/g33kinfo.com\/info\/wp-content\/uploads\/2022\/07\/minion-researchA.gif"},"description":"I am a g33k, Linux blogger, developer, student and Tech Writer for Liquidweb.com\/kb. My passion for all things tech drives my hunt for all the coolz. I often need a vacation after I get back from vacation....","sameAs":["https:\/\/thelinuxreport.com","https:\/\/fb.me\/g33kinf0","https:\/\/x.com\/https:\/\/twitter.com\/drsinger1111"]}]}},"_links":{"self":[{"href":"https:\/\/g33kinfo.com\/info\/wp-json\/wp\/v2\/posts\/9180","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/g33kinfo.com\/info\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/g33kinfo.com\/info\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/g33kinfo.com\/info\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/g33kinfo.com\/info\/wp-json\/wp\/v2\/comments?post=9180"}],"version-history":[{"count":1,"href":"https:\/\/g33kinfo.com\/info\/wp-json\/wp\/v2\/posts\/9180\/revisions"}],"predecessor-version":[{"id":9181,"href":"https:\/\/g33kinfo.com\/info\/wp-json\/wp\/v2\/posts\/9180\/revisions\/9181"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/g33kinfo.com\/info\/wp-json\/wp\/v2\/media\/8835"}],"wp:attachment":[{"href":"https:\/\/g33kinfo.com\/info\/wp-json\/wp\/v2\/media?parent=9180"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/g33kinfo.com\/info\/wp-json\/wp\/v2\/categories?post=9180"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/g33kinfo.com\/info\/wp-json\/wp\/v2\/tags?post=9180"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}