In svg graph convert all numeric attributes to integers to reduce size, 13.9KB - 12.6KB

This commit is contained in:
Peter Stockings
2023-12-09 21:25:48 +11:00
parent 81d674d650
commit 06844fa5b0

View File

@@ -1,12 +1,11 @@
{% set stroke_width = 4 %}
{% set margin = 2 %}
{% set precision = 1 %}
{% macro path(data_points, vb_height) %}
{% for value, position, message in data_points %}
{% set x = (position * vb_width)+margin %}
{% set y = (vb_height - value)+margin %}
{% if loop.first %}M{{ x | round(precision) }} {{ y | round(precision) }}{% else %} L{{ x | round(precision) }} {{ y | round(precision) }}{% endif %}
{% if loop.first %}M{{ x | int }} {{ y | int }}{% else %} L{{ x | int }} {{ y | int }}{% endif %}
{% endfor %}
{% endmacro %}
@@ -14,7 +13,7 @@
{% for value, position in best_fit_points %}
{% set x = (position * vb_width)+margin %}
{% set y = (vb_height - value)+margin %}
{% if loop.first %}M{{ x | round(precision) }} {{ y | round(precision) }}{% else %} L{{ x | round(precision) }} {{ y | round(precision) }}{% endif %}
{% if loop.first %}M{{ x | int }} {{ y | int }}{% else %} L{{ x | int }} {{ y | int }}{% endif %}
{% endfor %}
{% endmacro %}
@@ -22,7 +21,7 @@
{% for value, position, message in data_points %}
{% set x = (position * vb_width)+margin %}
{% set y = (vb_height - value)+margin %}
<circle cx="{{ x | round(precision) }}" cy="{{ y | round(precision) }}" r="1"></circle>
<circle cx="{{ x | int }}" cy="{{ y | int }}" r="1"></circle>
{% endfor %}
{% endmacro %}
@@ -48,7 +47,7 @@
<!-- Popover content will be dynamically inserted here -->
</div>
<h4 class="text-l font-semibold text-blue-400 mb-2 text-center">{{ exercise_name }}</h4>
<svg viewBox="0 0 {{ vb_width + 4 }} {{ vb_height + 4 }}" preserveAspectRatio="none">
<svg viewBox="0 0 {{ (vb_width + 2*margin) | int }} {{ (vb_height + 2*margin) | int }}" preserveAspectRatio="none">
<path d="{{ path_best_fit(best_fit_points, vb_height) }}" stroke="gray" stroke-dasharray="2,1" fill="none" stroke-opacity="40%"/>
{% for plot in plots %}
<g class="{{ plot.label }}" style="fill: {{ plot.color }}; stroke: {{ plot.color }};">
@@ -62,10 +61,10 @@
{% set width = stroke_width %}
{% set height = vb_height + margin %}
<rect
x="{{ x | round(precision) }}"
y="{{ y | round(precision) }}"
width="{{ width | round(precision) }}"
height="{{ height | round(precision) }}"
x="{{ x | int }}"
y="{{ y | int }}"
width="{{ width | int }}"
height="{{ height | int }}"
class="plot_point"
data-message="{{ message }}"
fill-opacity="0%"></rect>