Back to All Graphs

Graph Details

Supplemental Poverty Measure vs Official Poverty Measure

Charts comparing supplemental poverty vs official poverty

Embed Details

Add this style information to the head of your file. <link rel="stylesheet" href="//d1o40k53wiknb7.cloudfront.net/css/poverty-supplemental-vs-official.css" type="text/css"> Add this html where you need the graph to appear <section id="poverty-supplemental-vs-official" class="w-10/12 mx-auto my-20" > <h3 class="mb-5 text-center text-blue-400">Supplemental Poverty Measure vs Official Poverty Measure</h3> <div class="w-full mx-auto lg:w-3/4 flex flex-col lg:flex-row justify-evenly"> <div class="shrink-0"> <h4 class="text-center font-bold text-xl">Supplemental Poverty Measure</h4> <div class="relative"> <div class="w-full" id="chart-supplemental"></div> <div class="absolute inset-x-0.5 inset-y-[33%]"> <svg id="fi_9424572" class=" fill-blue-400 block mx-auto mb-1 w-8 h-8" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><g id="Icon"><g id="BoyReaching"><path d="m457 56.8c-16.6-10.8-38.5-7.4-51.2 7.7-24.3 28.9-70.1 70.7-134.6 76.5h-30.4c-64.5-5.8-110.3-47.6-134.6-76.5-12.7-15.2-34.6-18.5-51.1-7.8-19.9 13-23.7 40.6-8 58.4 24.4 27.8 65.3 65 122.4 85.4v.3 275.4c0 19.7 16 35.7 35.7 35.7 19.7 0 35.7-16 35.7-35.7v-111.6h30.6v111.7c0 19.7 16 35.7 35.7 35.7 19.7 0 35.7-16 35.7-35.7v-275.4c0-.1 0-.2 0-.3 57.1-20.4 98-57.6 122.4-85.4 15.4-17.9 11.6-45.5-8.3-58.4z"></path><circle cx="256" cy="63" r="63"></circle></g></g></svg> <p id="chart-supplemental-number" class="text-center text-2xl font-bold text-red"> <span>0</span>% <span class="block text-center font-normal text-base text-gray-800">children in poverty</span> </p> </div> </div> </div> <div class="shrink-0"> <h4 class="text-center text-xl font-bold">Official Poverty Measure</h4> <div class="relative"> <div class="w-full" id="chart-official"></div> <div class="absolute inset-x-0.5 inset-y-[33%]"> <p id="chart-official-number" class="text-center text-2xl font-bold text-red"> <svg id="fi_9424572" class=" fill-blue-400 block mx-auto mb-1 w-8 h-8" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><g id="Icon"><g id="BoyReaching"><path d="m457 56.8c-16.6-10.8-38.5-7.4-51.2 7.7-24.3 28.9-70.1 70.7-134.6 76.5h-30.4c-64.5-5.8-110.3-47.6-134.6-76.5-12.7-15.2-34.6-18.5-51.1-7.8-19.9 13-23.7 40.6-8 58.4 24.4 27.8 65.3 65 122.4 85.4v.3 275.4c0 19.7 16 35.7 35.7 35.7 19.7 0 35.7-16 35.7-35.7v-111.6h30.6v111.7c0 19.7 16 35.7 35.7 35.7 19.7 0 35.7-16 35.7-35.7v-275.4c0-.1 0-.2 0-.3 57.1-20.4 98-57.6 122.4-85.4 15.4-17.9 11.6-45.5-8.3-58.4z"></path><circle cx="256" cy="63" r="63"></circle></g></g></svg> <span>0</span>% <span class="block text-center font-normal text-base text-gray-800">children in poverty</span> </p> </div> </div> </div> </div> </section> Add this before the closing body tag <script src="//d1o40k53wiknb7.cloudfront.net/js/poverty-supplemental-vs-official.js"></script>