You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
134 lines
4.1 KiB
134 lines
4.1 KiB
<% unless measures_with_insufficient_data(presenters: presenters).empty? %>
|
|
<p>Note: The following measures are not displayed due to limited availability of school admin data and/or low survey response rates: <%= measures_with_insufficient_data(presenters: presenters).map(&:measure_name).join('; ') %>.</p>
|
|
<% end %>
|
|
|
|
<% displayed_presenters = measures_with_sufficient_data(presenters: presenters) %>
|
|
<svg width="100%" height=<%= graph_height(displayed_presenters.size) %> xmlns="http://www.w3.org/2000/svg">
|
|
|
|
<filter id="inset-shadow" x="-50%" y="-50%" width="200%" height="200%">
|
|
<feComponentTransfer in=SourceAlpha>
|
|
<feFuncA type="table" tableValues="1 0"/>
|
|
</feComponentTransfer>
|
|
<feGaussianBlur stdDeviation="4"/>
|
|
<feOffset dx="0" dy="0" result="offsetblur"/>
|
|
<feFlood flood-color="rgb(62, 58, 56, 0.25)" result="color"/>
|
|
<feComposite in2="offsetblur" operator="in"/>
|
|
<feComposite in2="SourceAlpha" operator="in"/>
|
|
<feMerge>
|
|
<feMergeNode in="SourceGraphic"/>
|
|
<feMergeNode/>
|
|
</feMerge>
|
|
</filter>
|
|
|
|
<svg
|
|
id="graph-background"
|
|
x="<%= label_width_percentage %>%"
|
|
y="0"
|
|
width="<%= graph_width_percentage %>%"
|
|
height=<%= graph_background_height(number_of_rows: displayed_presenters.size) %>
|
|
filter="url(#inset-shadow)"
|
|
>
|
|
<g id="zone-headings">
|
|
<%= zones.each_with_index do |zone, index| %>
|
|
<text
|
|
class="zone-header"
|
|
x="<%= index * zone_width_percentage + zone_width_percentage / 2.0 %>%"
|
|
y="<%= heading_gutter / 2 %>"
|
|
text-anchor="middle"
|
|
dominant-baseline="middle"
|
|
>
|
|
<%= zone.capitalize %>
|
|
</text>
|
|
<% end %>
|
|
</g>
|
|
|
|
<g id="zone-background" transform="translate(0, <%= heading_gutter %>)">
|
|
<%= zones.each_with_index do |zone, index| %>
|
|
<rect
|
|
id="<%= zone %>-zone"
|
|
class="zone-background bg-fill-<%= zone %>"
|
|
x="<%= index * zone_width_percentage %>%"
|
|
y="0"
|
|
width="<%= zone_width_percentage %>%"
|
|
height="100%"
|
|
stroke="#CECECE"
|
|
stroke-width="1"
|
|
/>
|
|
<% end %>
|
|
</g>
|
|
</svg>
|
|
|
|
<g id="measure-rows">
|
|
<svg id="measure-row-labels" x="0" y=<%= heading_gutter %>>
|
|
<%= displayed_presenters.each_with_index do |presenter, index| %>
|
|
<text
|
|
class="font-cabin"
|
|
x="<%= label_width_percentage %>%"
|
|
dx="<%= -1 * label_padding_right %>"
|
|
y="<%= index * measure_row_height + measure_row_height / 2 %>"
|
|
text-anchor="end"
|
|
dominant-baseline="middle"
|
|
data-variance-row-label
|
|
>
|
|
<%= presenter.measure_name %>
|
|
</text>
|
|
<% end %>
|
|
</svg>
|
|
|
|
<svg
|
|
id="measure-row-bars"
|
|
x="<%= label_width_percentage %>%"
|
|
y="<%= heading_gutter %>"
|
|
width="<%= graph_width_percentage %>%"
|
|
>
|
|
<%= displayed_presenters.each_with_index do |presenter, index| %>
|
|
<rect
|
|
class="measure-row-bar <%= presenter.bar_color %>"
|
|
x="<%= presenter.x_offset %>"
|
|
y="<%= index * measure_row_height + (measure_row_height - measure_row_bar_height) / 2 %>"
|
|
width="<%= presenter.bar_width %>"
|
|
height=<%= measure_row_bar_height %>
|
|
data-for-measure-id="<%= presenter.measure_id %>"
|
|
stroke="none"
|
|
/>
|
|
<% end %>
|
|
</svg>
|
|
</g>
|
|
|
|
<svg
|
|
id="key-benchmark"
|
|
x="<%= label_width_percentage %>%"
|
|
y="0"
|
|
width="<%= graph_width_percentage %>%"
|
|
height="<%= graph_background_height(number_of_rows: displayed_presenters.size) %>"
|
|
>
|
|
<g transform="translate(0, <%= heading_gutter %>)">
|
|
<rect
|
|
id="key-benchmark"
|
|
x="60%"
|
|
transform="translate(-1, 0)"
|
|
y="0"
|
|
width="4"
|
|
height="100%"
|
|
fill="black"
|
|
/>
|
|
</g>
|
|
</svg>
|
|
|
|
<svg
|
|
id="legend"
|
|
x="<%= label_width_percentage %>%"
|
|
y="0"
|
|
width="<%= graph_width_percentage %>%"
|
|
>
|
|
<text
|
|
class="graph-footer"
|
|
x="60%"
|
|
y="<%= graph_background_height(number_of_rows: displayed_presenters.size) + (footer_gutter / 2) %>"
|
|
text-anchor="middle"
|
|
>
|
|
Benchmark
|
|
</text>
|
|
</svg>
|
|
</svg>
|