ACFの範囲で、Charts.cssを利用して棒グラフを作成

<table class="charttable charts-css bar multiple stacked show-heading show-labels data-spacing-10  ">
	<caption><b>AGE DISTRIBUTION CHART</b></caption>
	<?php if (get_field('add_age00')): ?>
		<tr>
			<th>10代未満</th>
			<td style="--size: calc(<?php the_field('add_age00'); ?> / <?php the_field('add_max'); ?>); --color: #bbb;"><?php the_field('add_age00'); ?>%  </td>
		</tr>
	<?php endif ?>
	<?php if (get_field('add_age10')): ?>
		<tr>
			<th>10代</th>
			<td style="--size: calc(<?php the_field('add_age10'); ?> / <?php the_field('add_max'); ?>); --color: #bbb;"><?php the_field('add_age10'); ?>%  </td>
		</tr>
	<?php endif ?>
	<?php if (get_field('add_age20')): ?>
		<tr>
			<th>20代</th>
			<td style="--size: calc(<?php the_field('add_age20'); ?> / <?php the_field('add_max'); ?>); --color: #bbb;"><?php the_field('add_age20'); ?>%  </td>
		</tr>
	<?php endif ?>
	<?php if (get_field('add_age30')): ?>
		<tr>
			<th>30代</th>
			<td style="--size: calc(<?php the_field('add_age30'); ?> / <?php the_field('add_max'); ?>); --color: #bbb;"><?php the_field('add_age30'); ?>%  </td>
		</tr>
	<?php endif ?>
	<?php if (get_field('add_age40')): ?>
		<tr>
			<th>40代</th>
			<td style="--size: calc(<?php the_field('add_age40'); ?> / <?php the_field('add_max'); ?>); --color: #bbb;"><?php the_field('add_age40'); ?>%  </td>
		</tr>
	<?php endif ?>
	<?php if (get_field('add_age50')): ?>
		<tr>
			<th>50代</th>
			<td style="--size: calc(<?php the_field('add_age50'); ?> / <?php the_field('add_max'); ?>); --color: #bbb;"><?php the_field('add_age50'); ?>%  </td>
		</tr>
	<?php endif ?>
	<?php if (get_field('add_age60')): ?>
		<tr>
			<th>60代</th>
			<td style="--size: calc(<?php the_field('add_age60'); ?> / <?php the_field('add_max'); ?>); --color: #bbb;"><?php the_field('add_age60'); ?>%  </td>
		</tr>
	<?php endif ?>
	<?php if (get_field('add_age70')): ?>
		<tr>
			<th>70代</th>
			<td style="--size: calc(<?php the_field('add_age70'); ?> / <?php the_field('add_max'); ?>); --color: #bbb;"><?php the_field('add_age70'); ?>%  </td>
		</tr>
	<?php endif ?>
	<?php if (get_field('add_age80')): ?>
		<tr>
			<th>80代以上</th>
			<td style="--size: calc(<?php the_field('add_age80'); ?> / <?php the_field('add_max'); ?>); --color: #bbb;"><?php the_field('add_age80'); ?>%  </td>
		</tr>
	<?php endif ?>
</table>

.charttable {
	width: 90%;
	margin: auto;
	max-width: 1200px;
	padding: 10em 0;
	font-size: 0.9em;
}

.charttable th {
	font-weight: 500;
}

.charttable caption {
	font-size: 2em;
	height: 3em;
}