Skip to content
This repository was archived by the owner on Sep 27, 2024. It is now read-only.

Commit 864a92c

Browse files
shuklak13ml-fairness-infra-github
authored andcommitted
expand Datasets and Quantitative Analysis sections
Changes: * separate Dataset and Quantitative Analysis sections into separate cards, stacked vertically * display dataset.link for every Dataset * center-align Performance Metrics table PiperOrigin-RevId: 379389276
1 parent 9e1b140 commit 864a92c

File tree

4 files changed

+134
-55
lines changed

4 files changed

+134
-55
lines changed

model_card_toolkit/template/html/default_template.html.jinja

Lines changed: 39 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -22,26 +22,22 @@
2222
</ul>
2323
{%- endif %}
2424
{% endmacro %}
25-
{% macro render_all_graphics(model_parameters, quantitative_analysis) %}
26-
<h2>Graphics</h2>
27-
{% for dataset in model_parameters.data %}{% if dataset.graphics and dataset.graphics.collection %}
25+
{% macro render_all_datasets(datasets) %}
26+
<div class="col card">
27+
<h2>Datasets</h2>
28+
{% for dataset in datasets %}
2829
<div class="row">
2930
<div class="col card">
3031
<h3>{{ dataset.name }}</h3>
31-
{{ dataset.description }}
32-
{{ render_graphics(dataset.graphics.collection) }}
33-
</div>
34-
</div>{% endif %}
35-
{% endfor %}
36-
{% if quantitative_analysis.graphics.collection %}
37-
<div class="row">
38-
<div class="col card">
39-
<h3>Quantitative Analysis</h3>
40-
{{ quantitative_analysis.graphics.description }}
41-
{{ render_graphics(quantitative_analysis.graphics.collection) }}
32+
<p>{{ dataset.description }}</p>
33+
<a href="{{ dataset.link }}">{{ dataset.link }}</a>
34+
{% if dataset.graphics and dataset.graphics.collection %}
35+
{{ render_graphics(dataset.graphics.collection) }}
36+
{% endif %}
4237
</div>
4338
</div>
44-
{% endif %}
39+
{% endfor %}
40+
</div>
4541
{% endmacro %}
4642
{% macro render_graphics(graphics) %}
4743
<div class="img-container">
@@ -62,15 +58,34 @@
6258
{% macro metric_value(metric) %}
6359
{{ metric.value }}{% if metric.confidence_interval %} ({{ metric.confidence_interval.lower_bound }}, {{ metric.confidence_interval.upper_bound }}){% endif %}
6460
{% endmacro %}
61+
{% macro render_quantitative_analysis(quantitative_analysis) %}
62+
<div class="col card">
63+
<h2>Quantitative Analysis</h2>
64+
{% if quantitative_analysis.performance_metrics %}
65+
{{ render_metrics_table(quantitative_analysis.performance_metrics )}}
66+
{% endif %}
67+
{% if quantitative_analysis.graphics.collection %}
68+
{{ render_metrics_graphics(quantitative_analysis.graphics) }}
69+
{% endif %}
70+
</div>
71+
{% endmacro %}
6572
{% macro render_metrics_table(metrics) %}
66-
<table>
73+
<table class="center">
6774
<caption>Performance Metrics</caption>
6875
<tr><th>Name</th><th>Value</th></tr>
6976
{% for metric in metrics %}
7077
<tr><td>{{ metric_name(metric) }}</td><td>{{ metric_value(metric) }}</td></tr>
7178
{% endfor %}
7279
</table>
7380
{% endmacro %}
81+
{% macro render_metrics_graphics(graphics) %}
82+
<div class="row">
83+
<div class="col">
84+
{{ graphics.description }}
85+
{{ render_graphics(graphics.collection) }}
86+
</div>
87+
</div>
88+
{% endmacro %}
7489
<html lang="en">
7590
<head>
7691
<style>
@@ -95,6 +110,10 @@
95110
.img-item {
96111
flex: 1;
97112
}
113+
.center {
114+
margin-left: auto;
115+
margin-right: auto;
116+
}
98117
table, th, td { border: 1px solid black; }
99118
th, td { border: 1px solid #CCC; height: 30px; }
100119
caption { font-weight: bold; }
@@ -160,7 +179,6 @@
160179
<h3>Output Format</h3>
161180
<div style="white-space:pre-wrap;">{{ model_parameters.output_format }}</div>{% endif %}
162181
{% endif %}
163-
</div>
164182
{% if considerations and (considerations.users or considerations.use_cases or considerations.limitations or considerations.tradeoffs or considerations.ethical_considerations) %}
165183
<div class="col card">
166184
<h2>Considerations</h2>
@@ -190,11 +208,11 @@
190208
</div>
191209
{% endif %}
192210
</div>
193-
{% if model_parameters.data or quantitative_analysis.graphics.collection %}
194-
{{ render_all_graphics(model_parameters, quantitative_analysis) }}
211+
{% if model_parameters.data %}
212+
{{ render_all_datasets(model_parameters.data) }}
195213
{% endif %}
196-
{% if quantitative_analysis.performance_metrics %}
197-
{{ render_metrics_table(quantitative_analysis.performance_metrics )}}
214+
{% if quantitative_analysis.performance_metrics or quantitative_analysis.graphics.collection %}
215+
{{ render_quantitative_analysis(quantitative_analysis) }}
198216
{% endif %}
199217
</body>
200218
</html>

0 commit comments

Comments
 (0)