<div id="graphContainer">
		<svg id="graph" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 328.34">
			<line id="bar1" x1="126.56" y1="280" x2="126.56" y2="20" style="fill: none;stroke: #fbcd63;stroke-miterlimit: 10;stroke-width: 120px" />
			<line id="bar2" x1="264.25" y1="280" x2="264.25" y2="20" style="fill: none;stroke: #ae572b;stroke-miterlimit: 10;stroke-width: 120px" />
			<line id="bar3" x1="401.83" y1="280" x2="401.83" y2="20" style="fill: none;stroke: #312d2a;stroke-miterlimit: 10;stroke-width: 120px" />
			<line id="bar4" x1="539.25" y1="280" x2="539.25" y2="20" style="fill: none;stroke: #2e5b68;stroke-miterlimit: 10;stroke-width: 120px" />
			<rect width="640" height="328.34" style="fill: none" />
			<polyline id="axis" points="58 20 58 280 608 280" style="fill: none;stroke: #312d2a;stroke-miterlimit: 10;stroke-width: 0.98019134831326px" />
			<g id="yAxis">
				<g>
					<path d="M25.89,279.53v-.93A9.24,9.24,0,0,0,27,279a5,5,0,0,0,1.11.15v-3.18l-.38-.14a3.73,3.73,0,0,1-1.46-.94,2,2,0,0,1-.48-1.38,1.94,1.94,0,0,1,.62-1.48,2.93,2.93,0,0,1,1.7-.68v-1.21H29v1.2a4.72,4.72,0,0,1,1,.18,5.6,5.6,0,0,1,.87.33v.92a7.36,7.36,0,0,0-.91-.35,5,5,0,0,0-1-.17v3l.39.14a4.1,4.1,0,0,1,1.59,1,2,2,0,0,1,.47,1.38,2.06,2.06,0,0,1-.66,1.61A3,3,0,0,1,29,280v1.23h-.82v-1.22a6.62,6.62,0,0,1-1.23-.18A4.59,4.59,0,0,1,25.89,279.53Zm.95-6a1.14,1.14,0,0,0,.33.84,2.54,2.54,0,0,0,1,.57v-2.66a1.69,1.69,0,0,0-.95.39A1.11,1.11,0,0,0,26.84,273.5Zm3.52,4.26a1.26,1.26,0,0,0-.31-.86,3.08,3.08,0,0,0-1.1-.63v2.84a1.81,1.81,0,0,0,1-.42A1.2,1.2,0,0,0,30.36,277.76Z" style="fill: #312d2a" />
					<path d="M35.65,280.14A2.74,2.74,0,0,1,33.27,279a5.68,5.68,0,0,1-.81-3.33q0-4.44,3.19-4.44t3.19,4.44A5.68,5.68,0,0,1,38,279,2.74,2.74,0,0,1,35.65,280.14Zm0-.92c1.39,0,2.09-1.18,2.09-3.53a5.37,5.37,0,0,0-.51-2.65,1.87,1.87,0,0,0-3.15,0,5.25,5.25,0,0,0-.52,2.65C33.56,278,34.26,279.22,35.65,279.22Z" style="fill: #312d2a" />
					<path d="M40,280v-1.26h1.41V280Z" style="fill: #312d2a" />
					<path d="M45.68,280.14A2.74,2.74,0,0,1,43.3,279a5.68,5.68,0,0,1-.81-3.33q0-4.44,3.19-4.44t3.19,4.44a5.68,5.68,0,0,1-.81,3.33A2.74,2.74,0,0,1,45.68,280.14Zm0-.92c1.39,0,2.09-1.18,2.09-3.53a5.37,5.37,0,0,0-.51-2.65,1.87,1.87,0,0,0-3.15,0,5.36,5.36,0,0,0-.52,2.65C43.59,278,44.29,279.22,45.68,279.22Z" style="fill: #312d2a" />
				</g>
				<g>
					<path d="M28.83,242.39v-.94a9.39,9.39,0,0,0,1.13.38,6.46,6.46,0,0,0,1.11.15V238.8l-.38-.14a3.63,3.63,0,0,1-1.46-.95,2,2,0,0,1-.48-1.37,1.92,1.92,0,0,1,.62-1.48,2.86,2.86,0,0,1,1.7-.68V233h.82v1.2a4.73,4.73,0,0,1,1,.17,6.84,6.84,0,0,1,.87.33v.93a6.05,6.05,0,0,0-.91-.35,5,5,0,0,0-1-.17v3l.39.15a4,4,0,0,1,1.59,1,2,2,0,0,1,.47,1.38,2,2,0,0,1-.66,1.6,2.91,2.91,0,0,1-1.79.69v1.24h-.82v-1.22a7.57,7.57,0,0,1-1.23-.18A4.59,4.59,0,0,1,28.83,242.39Zm1-6a1.15,1.15,0,0,0,.33.85,2.54,2.54,0,0,0,1,.57v-2.66a1.63,1.63,0,0,0-.95.39A1.09,1.09,0,0,0,29.78,236.35Zm3.52,4.26a1.25,1.25,0,0,0-.31-.85,3.23,3.23,0,0,0-1.1-.64V242a1.81,1.81,0,0,0,1-.43A1.18,1.18,0,0,0,33.3,240.61Z" style="fill: #312d2a" />
					<path d="M37.15,242.86v-7.21l-2,.91v-.68l2.31-1.63h.79v8.61Z" style="fill: #312d2a" />
					<path d="M40,242.86V241.6h1.41v1.26Z" style="fill: #312d2a" />
					<path d="M45.68,243a2.74,2.74,0,0,1-2.38-1.12,5.68,5.68,0,0,1-.81-3.33q0-4.44,3.19-4.44t3.19,4.44a5.68,5.68,0,0,1-.81,3.33A2.74,2.74,0,0,1,45.68,243Zm0-.92c1.39,0,2.09-1.18,2.09-3.53a5.35,5.35,0,0,0-.51-2.65,1.86,1.86,0,0,0-3.15,0,5.33,5.33,0,0,0-.52,2.65C43.59,240.9,44.29,242.08,45.68,242.08Z" style="fill: #312d2a" />
				</g>
				<g>
					<path d="M26.67,205.25v-.94a9.24,9.24,0,0,0,1.13.37,5.6,5.6,0,0,0,1.11.16v-3.18l-.38-.15a3.62,3.62,0,0,1-1.46-.94,2,2,0,0,1-.48-1.37,1.92,1.92,0,0,1,.62-1.48,2.86,2.86,0,0,1,1.7-.68v-1.21h.82V197a4.73,4.73,0,0,1,1,.17,5.6,5.6,0,0,1,.87.33v.92a6,6,0,0,0-.91-.34,4.36,4.36,0,0,0-1-.17v3l.39.14a4.1,4.1,0,0,1,1.59,1,2,2,0,0,1,.47,1.38,2.05,2.05,0,0,1-.66,1.6,2.91,2.91,0,0,1-1.79.69V207h-.82v-1.23a6.64,6.64,0,0,1-1.23-.17A5.18,5.18,0,0,1,26.67,205.25Zm.95-6a1.16,1.16,0,0,0,.33.85,2.54,2.54,0,0,0,1,.57V198a1.7,1.7,0,0,0-.95.4A1.09,1.09,0,0,0,27.62,199.21Zm3.52,4.26a1.23,1.23,0,0,0-.31-.85,2.94,2.94,0,0,0-1.1-.64v2.85a1.81,1.81,0,0,0,1-.43A1.2,1.2,0,0,0,31.14,203.47Z" style="fill: #312d2a" />
					<path d="M33.21,205.71V205l2.39-2.59c.47-.51.84-.94,1.12-1.3a5,5,0,0,0,.62-.95,1.81,1.81,0,0,0,.19-.77c0-1-.56-1.45-1.68-1.45a4.86,4.86,0,0,0-2.35.69v-.94a4.06,4.06,0,0,1,1.13-.5,4.88,4.88,0,0,1,1.28-.18,2.93,2.93,0,0,1,2,.61,2.18,2.18,0,0,1,.7,1.74,3,3,0,0,1-.51,1.52,16,16,0,0,1-1.66,2l-1.76,1.9h4v.92Z" style="fill: #312d2a" />
					<path d="M40,205.71v-1.26h1.41v1.26Z" style="fill: #312d2a" />
					<path d="M45.68,205.86a2.76,2.76,0,0,1-2.38-1.12,5.68,5.68,0,0,1-.81-3.33q0-4.44,3.19-4.44t3.19,4.44a5.68,5.68,0,0,1-.81,3.33A2.76,2.76,0,0,1,45.68,205.86Zm0-.93c1.39,0,2.09-1.17,2.09-3.52a5.39,5.39,0,0,0-.51-2.66,1.87,1.87,0,0,0-3.15,0,5.38,5.38,0,0,0-.52,2.66C43.59,203.76,44.29,204.93,45.68,204.93Z" style="fill: #312d2a" />
				</g>
				<g>
					<path d="M26.61,168.1v-.93a9.24,9.24,0,0,0,1.13.37,5.6,5.6,0,0,0,1.11.16v-3.19l-.38-.14a3.62,3.62,0,0,1-1.46-.94,2,2,0,0,1-.48-1.38,1.94,1.94,0,0,1,.62-1.48,2.86,2.86,0,0,1,1.7-.67v-1.22h.82v1.2a4.72,4.72,0,0,1,1,.18,5.6,5.6,0,0,1,.87.33v.92a7.36,7.36,0,0,0-.91-.35,5.89,5.89,0,0,0-1-.17v3l.39.14a4.22,4.22,0,0,1,1.59,1,2,2,0,0,1,.47,1.39,2.05,2.05,0,0,1-.66,1.6,3,3,0,0,1-1.79.69v1.23h-.82v-1.22a7.6,7.6,0,0,1-1.23-.17A5.15,5.15,0,0,1,26.61,168.1Zm.95-6a1.14,1.14,0,0,0,.33.84,2.54,2.54,0,0,0,1,.57v-2.66a1.77,1.77,0,0,0-1,.39A1.11,1.11,0,0,0,27.56,162.07Zm3.52,4.26a1.26,1.26,0,0,0-.31-.86,3.08,3.08,0,0,0-1.1-.63v2.84a1.74,1.74,0,0,0,1-.42A1.2,1.2,0,0,0,31.08,166.33Z" style="fill: #312d2a" />
					<path d="M33.29,168.17v-.93a4.92,4.92,0,0,0,2.31.54,2.43,2.43,0,0,0,1.62-.5,1.8,1.8,0,0,0,.58-1.41,1.63,1.63,0,0,0-.47-1.2,1.77,1.77,0,0,0-1.28-.46,4,4,0,0,0-.71.07,4.69,4.69,0,0,0-.69.18l-.38-.64,2.78-2.93H33.37V160h5.1v.68l-2.64,2.78.34,0a2.7,2.7,0,0,1,1.95.67,2.34,2.34,0,0,1,.71,1.79A2.65,2.65,0,0,1,38,168a3.39,3.39,0,0,1-2.34.75A4.61,4.61,0,0,1,33.29,168.17Z" style="fill: #312d2a" />
					<path d="M40,168.57v-1.26h1.41v1.26Z" style="fill: #312d2a" />
					<path d="M45.68,168.71a2.74,2.74,0,0,1-2.38-1.12,5.66,5.66,0,0,1-.81-3.33q0-4.44,3.19-4.44t3.19,4.44a5.66,5.66,0,0,1-.81,3.33A2.74,2.74,0,0,1,45.68,168.71Zm0-.92c1.39,0,2.09-1.17,2.09-3.53a5.37,5.37,0,0,0-.51-2.65,1.87,1.87,0,0,0-3.15,0,5.36,5.36,0,0,0-.52,2.65C43.59,166.62,44.29,167.79,45.68,167.79Z" style="fill: #312d2a" />
				</g>
				<g>
					<path d="M25.79,131V130a9.28,9.28,0,0,0,1.12.38,5.71,5.71,0,0,0,1.11.15v-3.18l-.37-.14a3.7,3.7,0,0,1-1.47-.94,2.05,2.05,0,0,1-.48-1.38,1.9,1.9,0,0,1,.63-1.48,2.83,2.83,0,0,1,1.69-.68v-1.21h.83v1.2a4.63,4.63,0,0,1,1,.17,7.22,7.22,0,0,1,.87.33v.93a5.67,5.67,0,0,0-.91-.35,5,5,0,0,0-1-.17v3l.38.15a4.11,4.11,0,0,1,1.6,1,2.28,2.28,0,0,1-.2,3,2.9,2.9,0,0,1-1.78.69v1.24H28v-1.22a7.91,7.91,0,0,1-1.23-.18A4.49,4.49,0,0,1,25.79,131Zm.94-6a1.15,1.15,0,0,0,.33.85,2.54,2.54,0,0,0,1,.57v-2.66a1.63,1.63,0,0,0-.95.39A1.12,1.12,0,0,0,26.73,124.92Zm3.52,4.26a1.2,1.2,0,0,0-.31-.85,3,3,0,0,0-1.09-.63v2.84a1.81,1.81,0,0,0,1-.43A1.17,1.17,0,0,0,30.25,129.18Z" style="fill: #312d2a" />
					<path d="M32.34,129.42v-.8l4.47-5.8h1v5.68h1.15v.92H37.79v2H36.71v-2Zm1.23-.92h3.16v-4.06Z" style="fill: #312d2a" />
					<path d="M40,131.43v-1.26h1.41v1.26Z" style="fill: #312d2a" />
					<path d="M45.68,131.57a2.74,2.74,0,0,1-2.38-1.12,5.68,5.68,0,0,1-.81-3.33q0-4.44,3.19-4.44t3.19,4.44a5.68,5.68,0,0,1-.81,3.33A2.74,2.74,0,0,1,45.68,131.57Zm0-.92c1.39,0,2.09-1.18,2.09-3.53a5.35,5.35,0,0,0-.51-2.65,1.86,1.86,0,0,0-3.15,0,5.33,5.33,0,0,0-.52,2.65C43.59,129.47,44.29,130.65,45.68,130.65Z" style="fill: #312d2a" />
				</g>
				<g>
					<path d="M26.67,93.82v-.94a9.24,9.24,0,0,0,1.13.37,5.6,5.6,0,0,0,1.11.16V90.23l-.38-.15a3.62,3.62,0,0,1-1.46-.94,2,2,0,0,1-.48-1.37,1.92,1.92,0,0,1,.62-1.48,2.86,2.86,0,0,1,1.7-.68V84.4h.82v1.2a4.73,4.73,0,0,1,1,.17,5.6,5.6,0,0,1,.87.33V87a6,6,0,0,0-.91-.34,4.36,4.36,0,0,0-1-.17v3l.39.14a4.1,4.1,0,0,1,1.59,1A2,2,0,0,1,32.18,92a2.05,2.05,0,0,1-.66,1.6,2.91,2.91,0,0,1-1.79.69v1.24h-.82V94.33a6.64,6.64,0,0,1-1.23-.17A5.18,5.18,0,0,1,26.67,93.82Zm.95-6a1.16,1.16,0,0,0,.33.85,2.54,2.54,0,0,0,1,.57V86.53a1.7,1.7,0,0,0-.95.4A1.09,1.09,0,0,0,27.62,87.78ZM31.14,92a1.23,1.23,0,0,0-.31-.85,2.94,2.94,0,0,0-1.1-.64V93.4a1.81,1.81,0,0,0,1-.43A1.2,1.2,0,0,0,31.14,92Z" style="fill: #312d2a" />
					<path d="M33.17,93.89V93a4.65,4.65,0,0,0,1.11.41,5.23,5.23,0,0,0,1.19.13A2.17,2.17,0,0,0,37,93a1.82,1.82,0,0,0,.55-1.4,1.75,1.75,0,0,0-.49-1.31,1.88,1.88,0,0,0-1.34-.46,4.44,4.44,0,0,0-1,.12,3.68,3.68,0,0,0-.84.33l-.66-.51.51-4.07H38.1v.92H34.5l-.34,2.7A4.23,4.23,0,0,1,35,89a3.55,3.55,0,0,1,.86-.1,3.18,3.18,0,0,1,1.46.32,2.35,2.35,0,0,1,1,.93,2.7,2.7,0,0,1,.35,1.42,2.86,2.86,0,0,1-.38,1.52,2.48,2.48,0,0,1-1.06,1,3.78,3.78,0,0,1-1.64.34,6.4,6.4,0,0,1-1.26-.13A4,4,0,0,1,33.17,93.89Z" style="fill: #312d2a" />
					<path d="M40,94.28V93h1.41v1.26Z" style="fill: #312d2a" />
					<path d="M45.68,94.43a2.76,2.76,0,0,1-2.38-1.12A5.68,5.68,0,0,1,42.49,90q0-4.44,3.19-4.44T48.87,90a5.68,5.68,0,0,1-.81,3.33A2.76,2.76,0,0,1,45.68,94.43Zm0-.93c1.39,0,2.09-1.17,2.09-3.52a5.39,5.39,0,0,0-.51-2.66,1.87,1.87,0,0,0-3.15,0A5.38,5.38,0,0,0,43.59,90C43.59,92.33,44.29,93.5,45.68,93.5Z" style="fill: #312d2a" />
				</g>
				<g>
					<path d="M26.19,56.67v-.93a9.24,9.24,0,0,0,1.13.37,5.6,5.6,0,0,0,1.11.16V53.09l-.38-.15A3.62,3.62,0,0,1,26.59,52a2,2,0,0,1-.48-1.37,2,2,0,0,1,.62-1.49,2.86,2.86,0,0,1,1.7-.67V47.25h.82v1.2a5.43,5.43,0,0,1,1,.18,5.6,5.6,0,0,1,.87.33v.92a7.36,7.36,0,0,0-.91-.35,5,5,0,0,0-1-.16v3l.39.14a4.1,4.1,0,0,1,1.59,1,2,2,0,0,1,.47,1.38,2.05,2.05,0,0,1-.66,1.6,3,3,0,0,1-1.79.69v1.23h-.82V57.19A6.64,6.64,0,0,1,27.2,57,5.15,5.15,0,0,1,26.19,56.67Zm.95-6a1.14,1.14,0,0,0,.33.84,2.54,2.54,0,0,0,1,.57V49.39a1.7,1.7,0,0,0-.95.4A1.07,1.07,0,0,0,27.14,50.64Zm3.52,4.26a1.22,1.22,0,0,0-.31-.85,2.94,2.94,0,0,0-1.1-.64v2.84a1.74,1.74,0,0,0,1-.42A1.2,1.2,0,0,0,30.66,54.9Z" style="fill: #312d2a" />
					<path d="M35.59,57.29a2.81,2.81,0,0,1-2.14-.81,3.1,3.1,0,0,1-.78-2.24A4.27,4.27,0,0,1,33,52.63a9.47,9.47,0,0,1,1.08-1.86l1.6-2.23h1.18L35.1,51l-.36.5-.29.44a2.43,2.43,0,0,1,1.63-.58,2.32,2.32,0,0,1,2.19,1.38,3.57,3.57,0,0,1,.32,1.55,3.16,3.16,0,0,1-.38,1.56,2.53,2.53,0,0,1-1.05,1A3.17,3.17,0,0,1,35.59,57.29Zm-1.92-3a2.21,2.21,0,0,0,.51,1.55,1.8,1.8,0,0,0,1.42.56A1.88,1.88,0,0,0,37,55.81a2.14,2.14,0,0,0,.52-1.5,2.3,2.3,0,0,0-.48-1.53,1.59,1.59,0,0,0-1.27-.57,2.12,2.12,0,0,0-1.23.36,2.48,2.48,0,0,0-.86,1,3.11,3.11,0,0,0,0,.32C33.67,54,33.67,54.13,33.67,54.25Z" style="fill: #312d2a" />
					<path d="M40,57.14V55.88h1.41v1.26Z" style="fill: #312d2a" />
					<path d="M45.68,57.29a2.75,2.75,0,0,1-2.38-1.13,5.64,5.64,0,0,1-.81-3.33q0-4.44,3.19-4.44t3.19,4.44a5.64,5.64,0,0,1-.81,3.33A2.75,2.75,0,0,1,45.68,57.29Zm0-.93c1.39,0,2.09-1.17,2.09-3.53a5.37,5.37,0,0,0-.51-2.65,1.87,1.87,0,0,0-3.15,0,5.36,5.36,0,0,0-.52,2.65C43.59,55.19,44.29,56.36,45.68,56.36Z" style="fill: #312d2a" />
				</g>
				<g>
					<path d="M28,19.53v-.94a8.84,8.84,0,0,0,1.13.38,5.61,5.61,0,0,0,1.1.15V15.94l-.37-.14a3.7,3.7,0,0,1-1.47-.94,2.05,2.05,0,0,1-.48-1.38A1.9,1.9,0,0,1,28.5,12a2.83,2.83,0,0,1,1.69-.68V10.11H31v1.2a4.53,4.53,0,0,1,1,.17,7.22,7.22,0,0,1,.87.33v.93a5.67,5.67,0,0,0-.91-.35,4.91,4.91,0,0,0-1-.17v3l.38.15a4,4,0,0,1,1.6,1,2.27,2.27,0,0,1-.19,3A2.93,2.93,0,0,1,31,20v1.24h-.83V20.05A7.91,7.91,0,0,1,29,19.87,4.49,4.49,0,0,1,28,19.53Zm.95-6a1.14,1.14,0,0,0,.32.85,2.71,2.71,0,0,0,1,.57V12.25a1.66,1.66,0,0,0-1,.39A1.11,1.11,0,0,0,28.91,13.49Zm3.51,4.26a1.2,1.2,0,0,0-.31-.85A3,3,0,0,0,31,16.27v2.84a1.84,1.84,0,0,0,1-.43A1.2,1.2,0,0,0,32.42,17.75Z" style="fill: #312d2a" />
					<path d="M35.75,20,39,12.31H35.33L35,13.66h-.64V11.39H40.1v.71L36.91,20Z" style="fill: #312d2a" />
					<path d="M40,20V18.74h1.41V20Z" style="fill: #312d2a" />
					<path d="M45.68,20.14A2.74,2.74,0,0,1,43.3,19a5.68,5.68,0,0,1-.81-3.33q0-4.44,3.19-4.44t3.19,4.44A5.68,5.68,0,0,1,48.06,19,2.74,2.74,0,0,1,45.68,20.14Zm0-.92c1.39,0,2.09-1.18,2.09-3.53A5.35,5.35,0,0,0,47.26,13a1.86,1.86,0,0,0-3.15,0,5.33,5.33,0,0,0-.52,2.65C43.59,18,44.29,19.22,45.68,19.22Z" style="fill: #312d2a" />
				</g>
			</g>
			<g id="xAxis">
				<g id="_2018" data-name="2018">
					<path d="M526.85,299v-.75l2.39-2.59c.47-.51.84-.94,1.13-1.3a5.43,5.43,0,0,0,.61-.95,1.85,1.85,0,0,0,.19-.77c0-1-.55-1.45-1.67-1.45a5,5,0,0,0-2.36.68V291a4.2,4.2,0,0,1,1.13-.5,4.9,4.9,0,0,1,1.28-.19,2.93,2.93,0,0,1,2,.62,2.18,2.18,0,0,1,.7,1.74,2.89,2.89,0,0,1-.51,1.51,15.33,15.33,0,0,1-1.66,2.06l-1.76,1.9h4V299Z" style="fill: #1d1d1b" />
					<path d="M536.63,299.16a2.78,2.78,0,0,1-2.38-1.12,5.68,5.68,0,0,1-.81-3.33c0-3,1.07-4.45,3.19-4.45s3.2,1.49,3.2,4.45A5.68,5.68,0,0,1,539,298,2.78,2.78,0,0,1,536.63,299.16Zm0-.93c1.4,0,2.09-1.17,2.09-3.52a5.39,5.39,0,0,0-.51-2.66,1.87,1.87,0,0,0-3.15,0,5.39,5.39,0,0,0-.51,2.66C534.55,297.06,535.24,298.23,536.63,298.23Z" style="fill: #1d1d1b" />
					<path d="M542.78,299V291.8l-2,.91V292l2.31-1.63h.79V299Z" style="fill: #1d1d1b" />
					<path d="M551.39,296.65a2.24,2.24,0,0,1-.8,1.84,4.1,4.1,0,0,1-4.49,0,2.27,2.27,0,0,1-.8-1.84,2.2,2.2,0,0,1,.47-1.39,2.72,2.72,0,0,1,1.28-.86,2.59,2.59,0,0,1-1.13-.79,1.83,1.83,0,0,1-.39-1.16,1.93,1.93,0,0,1,.73-1.62,4.1,4.1,0,0,1,4.17,0,1.93,1.93,0,0,1,.74,1.62,1.78,1.78,0,0,1-.4,1.16,2.53,2.53,0,0,1-1.13.79,2.72,2.72,0,0,1,1.28.86A2.15,2.15,0,0,1,551.39,296.65Zm-3-1.86c-1.33.21-2,.81-2,1.8a1.51,1.51,0,0,0,.53,1.23,2.21,2.21,0,0,0,1.47.44,2.24,2.24,0,0,0,1.47-.44,1.5,1.5,0,0,0,.52-1.23C550.34,295.6,549.67,295,548.35,294.79Zm0-.77a3,3,0,0,0,1.31-.57,1.18,1.18,0,0,0,.46-.94c0-.9-.59-1.34-1.77-1.34s-1.78.44-1.78,1.34a1.18,1.18,0,0,0,.46.94A3,3,0,0,0,548.35,294Z" style="fill: #1d1d1b" />
				</g>
				<g id="_2017" data-name="2017">
					<path d="M389.63,299v-.75l2.39-2.59c.46-.51.84-.94,1.12-1.3a5.57,5.57,0,0,0,.62-.95,1.85,1.85,0,0,0,.19-.77c0-1-.56-1.45-1.68-1.45a4.92,4.92,0,0,0-2.35.68V291a4.06,4.06,0,0,1,1.13-.5,4.9,4.9,0,0,1,1.28-.19,2.93,2.93,0,0,1,2,.62,2.18,2.18,0,0,1,.7,1.74,2.82,2.82,0,0,1-.52,1.51,14.37,14.37,0,0,1-1.65,2.06l-1.77,1.9h4V299Z" style="fill: #1d1d1b" />
					<path d="M399.41,299.16A2.76,2.76,0,0,1,397,298a5.68,5.68,0,0,1-.81-3.33c0-3,1.06-4.45,3.19-4.45s3.19,1.49,3.19,4.45a5.68,5.68,0,0,1-.81,3.33A2.76,2.76,0,0,1,399.41,299.16Zm0-.93c1.39,0,2.09-1.17,2.09-3.52a5.39,5.39,0,0,0-.51-2.66,1.87,1.87,0,0,0-3.15,0,5.38,5.38,0,0,0-.52,2.66C397.32,297.06,398,298.23,399.41,298.23Z" style="fill: #1d1d1b" />
					<path d="M405.55,299V291.8l-2,.91V292l2.3-1.63h.79V299Z" style="fill: #1d1d1b" />
					<path d="M409.43,299l3.24-7.69H409l-.35,1.36H408v-2.27h5.76v.71l-3.2,7.89Z" style="fill: #1d1d1b" />
				</g>
				<g id="_2016" data-name="2016">
					<path d="M251.85,299v-.75l2.39-2.59c.46-.51.84-.94,1.12-1.3a5.57,5.57,0,0,0,.62-.95,2,2,0,0,0,.19-.77c0-1-.56-1.45-1.68-1.45a4.92,4.92,0,0,0-2.35.68V291a4.06,4.06,0,0,1,1.13-.5,4.84,4.84,0,0,1,1.28-.19,2.93,2.93,0,0,1,2,.62,2.22,2.22,0,0,1,.7,1.74,2.91,2.91,0,0,1-.52,1.51,14.37,14.37,0,0,1-1.65,2.06l-1.77,1.9h4V299Z" style="fill: #1d1d1b" />
					<path d="M261.63,299.16a2.76,2.76,0,0,1-2.38-1.12,5.68,5.68,0,0,1-.81-3.33c0-3,1.06-4.45,3.19-4.45s3.19,1.49,3.19,4.45A5.68,5.68,0,0,1,264,298,2.76,2.76,0,0,1,261.63,299.16Zm0-.93c1.39,0,2.09-1.17,2.09-3.52a5.39,5.39,0,0,0-.51-2.66,1.87,1.87,0,0,0-3.15,0,5.27,5.27,0,0,0-.52,2.66C259.54,297.06,260.24,298.23,261.63,298.23Z" style="fill: #1d1d1b" />
					<path d="M267.77,299V291.8l-2,.91V292l2.3-1.63h.79V299Z" style="fill: #1d1d1b" />
					<path d="M273.26,299.16a2.81,2.81,0,0,1-2.14-.81,3.1,3.1,0,0,1-.78-2.24,4.09,4.09,0,0,1,.34-1.61,9.47,9.47,0,0,1,1.08-1.86l1.59-2.23h1.19l-1.77,2.47-.36.5-.29.44a2.41,2.41,0,0,1,1.63-.58,2.38,2.38,0,0,1,1.31.36,2.45,2.45,0,0,1,.88,1,3.57,3.57,0,0,1,.32,1.55,3.16,3.16,0,0,1-.38,1.56,2.61,2.61,0,0,1-1.05,1.06A3.28,3.28,0,0,1,273.26,299.16Zm-1.92-3a2.19,2.19,0,0,0,.51,1.55,1.8,1.8,0,0,0,1.42.56,1.86,1.86,0,0,0,1.43-.55,2.1,2.1,0,0,0,.53-1.5,2.35,2.35,0,0,0-.48-1.53,1.59,1.59,0,0,0-1.28-.57,2.17,2.17,0,0,0-1.23.36,2.54,2.54,0,0,0-.85,1,3.11,3.11,0,0,0,0,.32C271.34,295.89,271.34,296,271.34,296.12Z" style="fill: #1d1d1b" />
				</g>
				<g id="_2015" data-name="2015">
					<path d="M114.59,299v-.75l2.39-2.59c.46-.51.83-.94,1.12-1.3a5.57,5.57,0,0,0,.62-.95,2,2,0,0,0,.19-.77c0-1-.56-1.45-1.68-1.45a4.89,4.89,0,0,0-2.35.68V291a4,4,0,0,1,1.12-.5,4.91,4.91,0,0,1,1.29-.19,2.88,2.88,0,0,1,2,.62,2.19,2.19,0,0,1,.71,1.74,2.91,2.91,0,0,1-.52,1.51,15.12,15.12,0,0,1-1.65,2.06l-1.77,1.9h4V299Z" style="fill: #1d1d1b" />
					<path d="M124.37,299.16A2.76,2.76,0,0,1,122,298a5.68,5.68,0,0,1-.81-3.33c0-3,1.06-4.45,3.19-4.45s3.19,1.49,3.19,4.45a5.68,5.68,0,0,1-.81,3.33A2.76,2.76,0,0,1,124.37,299.16Zm0-.93c1.39,0,2.09-1.17,2.09-3.52a5.39,5.39,0,0,0-.51-2.66,1.87,1.87,0,0,0-3.15,0,5.27,5.27,0,0,0-.52,2.66C122.28,297.06,123,298.23,124.37,298.23Z" style="fill: #1d1d1b" />
					<path d="M130.51,299V291.8l-2,.91V292l2.3-1.63h.79V299Z" style="fill: #1d1d1b" />
					<path d="M133.09,298.62v-.94a4.57,4.57,0,0,0,1.12.41,5.17,5.17,0,0,0,1.19.13,2.18,2.18,0,0,0,1.54-.51,1.85,1.85,0,0,0,.54-1.4A1.71,1.71,0,0,0,137,295a1.84,1.84,0,0,0-1.33-.46,4.44,4.44,0,0,0-1,.12,3.5,3.5,0,0,0-.84.33l-.66-.51.51-4.07H138v.92h-3.6l-.33,2.7a4,4,0,0,1,.8-.29,3.55,3.55,0,0,1,.86-.1,3.23,3.23,0,0,1,1.46.32,2.39,2.39,0,0,1,1,.92,2.86,2.86,0,0,1,.35,1.43,3,3,0,0,1-.38,1.52,2.42,2.42,0,0,1-1.07,1,3.61,3.61,0,0,1-1.64.35,5.57,5.57,0,0,1-1.25-.14A3.78,3.78,0,0,1,133.09,298.62Z" style="fill: #1d1d1b" />
				</g>
			</g>
			<g id="graphMarkers">
				<line x1="58" y1="242.86" x2="608" y2="242.86" style="fill: none;stroke: #fff;stroke-miterlimit: 10;stroke-width: 0.5px;opacity: 0.5" />
				<line x1="58" y1="205.71" x2="608" y2="205.71" style="fill: none;stroke: #fff;stroke-miterlimit: 10;stroke-width: 0.5px;opacity: 0.5" />
				<line x1="58" y1="168.57" x2="608" y2="168.57" style="fill: none;stroke: #fff;stroke-miterlimit: 10;stroke-width: 0.5px;opacity: 0.5" />
				<line x1="58" y1="131.43" x2="608" y2="131.43" style="fill: none;stroke: #fff;stroke-miterlimit: 10;stroke-width: 0.5px;opacity: 0.5" />
				<line x1="58" y1="94.29" x2="608" y2="94.29" style="fill: none;stroke: #fff;stroke-miterlimit: 10;stroke-width: 0.5px;opacity: 0.5" />
				<line x1="58" y1="57.14" x2="608" y2="57.14" style="fill: none;stroke: #fff;stroke-miterlimit: 10;stroke-width: 0.5px;opacity: 0.5" />
				<line x1="58" y1="20" x2="608" y2="20" style="fill: none;stroke: #fff;stroke-miterlimit: 10;stroke-width: 0.5px;opacity: 0.5" />
			</g>
		
		
			
			
		</svg>



	</div>
	<button id="graphButton1">State 1</button>
	<button id="graphButton2">State 2</button>
	<button id="graphButton3">State 3</button>
	<button id="graphButton4">State 4</button>

body {
	background-color: white;
}

#graphContainer {
	width: 640px;
	height: 329px;
}
var bar1 = document.getElementById("bar1");
var bar2 = document.getElementById("bar2");
var bar3 = document.getElementById("bar3");
var bar4 = document.getElementById("bar4");

function drawBars(vals) {
  const offset = "-=0.6";
  const graphLa = gsap.timeline({
    defaults: {
      ease: "power2.inOut",
      duration: 0.7,
      overwrite: "auto"
    }
  })
  .to(bar1, { drawSVG: vals[0] })
  .to(bar2, { drawSVG: vals[1] }, offset)
  .to(bar3, { drawSVG: vals[2] }, offset)
  .to(bar4, { drawSVG: vals[3] }, offset)
}


//	State 1 Animation
document.querySelector("#graphButton1").addEventListener("click", () => drawBars(["0px 111px", "0px 126px", "0px 141px", "0px 148px"]) );
drawBars(["0px 111px", "0px 126px", "0px 141px", "0px 148px"]); // set the intial state

//	State 2 Animation
document.querySelector("#graphButton2").addEventListener("click", () => drawBars(["0px 100px", "0px 14px", "0px 185px", "0px 219px"]) );

//	State 3 Animation
document.querySelector("#graphButton3").addEventListener("click", () => drawBars(["0px 55px", "0px 74px", "0px 85px", "0px 96px"]) );

//	State 4 Animation
document.querySelector("#graphButton4").addEventListener("click", () => drawBars(["0px 11px", "0px 11px", "0px 19px", "0px 19px"]) );

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js
  2. https://cdnjs.cloudflare.com/ajax/libs/gsap/3.3.1/gsap.min.js
  3. https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/DrawSVGPlugin3.min.js