Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Citation graph blogpost #115

Open
wants to merge 18 commits into
base: master
Choose a base branch
from
Open

Citation graph blogpost #115

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
18 commits
Select commit Hold shift + click to select a range
fb48d01
WIP citation graph blog post; table only
curt-mitch-census Jun 5, 2024
6f5afbe
citation graph prototype, still need highlight principles on click
Jun 6, 2024
763f15c
POC for column highlighting
curt-mitch-census Jun 6, 2024
df63f88
Update npm installations; include d3 packages
curt-mitch-census Jun 7, 2024
145c8dd
Create gulpfile for bundling d3 code; include bundles
curt-mitch-census Jun 7, 2024
13c3ebf
Update script references for single bundle file
curt-mitch-census Jun 7, 2024
56a43ee
Merge branch 'master' into citation-graph-blogpost
curt-mitch-census Jun 7, 2024
b3e230a
Merge branch 'master' into citation-graph-blogpost
curt-mitch-census Jun 11, 2024
17340b2
Add remaining policy class names
curt-mitch-census Jun 11, 2024
4db90e1
Reset table highlight state on click
curt-mitch-census Jun 11, 2024
492cd4b
Allow unselection of nodes
curt-mitch-census Jun 11, 2024
17c92ef
Update state colors for nodes and table
curt-mitch-census Jun 11, 2024
ff2bfe7
Darker node colors
curt-mitch-census Jun 11, 2024
d17ec61
Darker default node color
curt-mitch-census Jun 11, 2024
39d8ce3
Specify image height to unblock mouse events
curt-mitch-census Jun 12, 2024
2c599f5
Fix merge conflicts
curt-mitch-census Aug 14, 2024
91b6d1f
Fix image ref in blog post
curt-mitch-census Aug 14, 2024
f729ece
Update publish date
curt-mitch-census Aug 14, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions assets/css/_layouts/_blog.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -85,6 +85,7 @@
}

.news-image-container {
height: 100%;
margin-bottom: 2rem;
}

Expand Down
1 change: 1 addition & 0 deletions assets/css/_layouts/_news.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -80,6 +80,7 @@ body.news {
}

.news-image-container {
height: 100%;
margin-bottom: 2rem;
}

Expand Down
Binary file added assets/img/news/mapping-the-ai-policy-landscape-trustworthy-ai-principles.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
317 changes: 317 additions & 0 deletions collections/_news/citation-graph.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,317 @@
---
title: "Mapping the AI Policy Landscape: Trustworthy AI Principles"
publish_date: 2024-08-15
permalink: /blog/citation-graph/
img_alt_text: Example Model Card
image: /assets/img/news/mapping-the-ai-policy-landscape-trustworthy-ai-principles.jpg
image_accessibility: Example Model Card
layout: blog
post_author: Anna Vasylytsya, Mike Walton
---

<head>

<!-- <link rel="stylesheet" href="styles.css"> -->
<link
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6"
crossorigin="anonymous"
/>
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-JEW9xMcG8R+pH31jmWH6WWP0WintQrMb4s7ZOdauHnUtxwoG2vI5DkLtS3qm9Ekf"
crossorigin="anonymous"
></script>

</head>

<div class="page-bios">
<div class="grid-container">
<div class="grid-row">
<div class="tablet:grid-col-7 margin-1 margin-left-neg-1 tablet:margin-0">
<section>
<div id="citation-graph">
<svg width="960" height="600"></svg>
</div>
</section>
</div>
</div>
</div>

<style>

#citation-graph {
.links line {
stroke: #CCCCCC;
}

.nodes circle {
fill: rgb(133, 119, 186);
stroke: $color-white;
&.highlight {
fill: rgb(82, 74, 107);
}
}
}

table {
border-collapse: collapse;
border: 2px solid rgb(140 140 140);
font-family: sans-serif;
font-size: 0.9rem;
letter-spacing: 1px;
text-align: center;
}

caption {
caption-side: top;
padding: 10px;
font-weight: bold;
}

thead,
tfoot {
background-color: rgb(203, 195, 227);
}

th,
td {
border: 1px solid rgb(160 160 160);
padding: 8px 10px;
}

th.highlight, td.highlight {
background-color: rgb(150, 141, 176);
}

tbody > tr:nth-of-type(even) {
background-color: rgb(237 238 242);
}


</style>

<div>
<table id="document-table">
<caption>
Trustworthy AI Policy Documents, Frameworks, and Principles
</caption>
<thead>
<tr>
<th scope="col">Principle</th>
<th scope="col" class="eo_13859">EO 13859</th>
<th scope="col" class="eo_13960">EO 13960</th>
<th scope="col" class="hr_2575">HR 2575</th>
<th scope="col" class="hr_6216">HR 6216</th>
<th scope="col" class="baibor">Blueprint for an AI Bill of Rights</th>
<th scope="col" class="s_1353">S 1353</th>
<th scope="col" class="nist_rmf">NIST AI RMF</th>
<th scope="col" class="gao_21_519sp">GAO Accountability Framework</th>
<th scope="col" class="eo_14110">EO 14110</th>
<th scope="col" class="m_24_10">OMB M-24-10</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">Transparency</th>
<td class="eo_13859"></td>
<td class="eo_13960">&#10004;</td>
<td class="hr_2575">&#10004;</td>
<td class="hr_6216"></td>
<td class="baibor"></td>
<td class="s_1353"></td>
<td class="nist_rmf">&#10004;</td>
<td class="gao_21_519sp">&#10004;</td>
<td class="eo_14110"></td>
<td class="m_24_10">&#10004;</td>
</tr>
<tr>
<th scope="row">Accountability</th>
<td class="eo_13859"></td>
<td class="eo_13960">&#10004;</td>
<td class="hr_2575"></td>
<td class="hr_6216">&#10004;</td>
<td class="baibor">&#10004;</td>
<td class="s_1353"></td>
<td class="nist_rmf">&#10004;</td>
<td class="gao_21_519sp">&#10004;</td>
<td class="eo_14110">&#10004;</td>
<td class="m_24_10"></td>
</tr>
<tr>
<th scope="row">Privacy and confidentiality</th>
<td class="eo_13859">&#10004;</td>
<td class="eo_13960">&#10004;</td>
<td class="hr_2575"></td>
<td class="hr_6216">&#10004;</td>
<td class="baibor">&#10004;</td>
<td class="s_1353">&#10004;</td>
<td class="nist_rmf">&#10004;</td>
<td class="gao_21_519sp">&#10004;</td>
<td class="eo_14110">&#10004;</td>
<td class="m_24_10"></td>
</tr>
<tr>
<th scope="row">Safety and security</th>
<td class="eo_13859">&#10004;</td>
<td class="eo_13960">&#10004;</td>
<td class="hr_2575"></td>
<td class="hr_6216">&#10004;</td>
<td class="baibor">&#10004;</td>
<td class="s_1353"></td>
<td class="nist_rmf">&#10004;</td>
<td class="gao_21_519sp">&#10004;</td>
<td class="eo_14110">&#10004;</td>
<td class="m_24_10">&#10004;</td>
</tr>
<tr>
<th scope="row">Resiliency</th>
<td class="eo_13859"></td>
<td class="eo_13960">&#10004;</td>
<td class="hr_2575"></td>
<td class="hr_6216"></td>
<td class="baibor"></td>
<td class="s_1353"></td>
<td class="nist_rmf">&#10004;</td>
<td class="gao_21_519sp"></td>
<td class="eo_14110">&#10004;</td>
<td class="m_24_10"></td>
</tr>
<tr>
<th scope="row">Reliability</th>
<td class="eo_13859">&#10004;</td>
<td class="eo_13960">&#10004;</td>
<td class="hr_2575"></td>
<td class="hr_6216"></td>
<td class="baibor">&#10004;</td>
<td class="s_1353"></td>
<td class="nist_rmf">&#10004;</td>
<td class="gao_21_519sp">&#10004;</td>
<td class="eo_14110">&#10004;</td>
<td class="m_24_10"></td>
</tr>
<tr>
<th scope="row">Accuracy</th>
<td class="eo_13859"></td>
<td class="eo_13960">&#10004;</td>
<td class="hr_2575"></td>
<td class="hr_6216"></td>
<td class="baibor">&#10004;</td>
<td class="s_1353"></td>
<td class="nist_rmf">&#10004;</td>
<td class="gao_21_519sp">&#10004;</td>
<td class="eo_14110"></td>
<td class="m_24_10"></td>
</tr>
<tr>
<th scope="row">Responsibility</th>
<td class="eo_13859"></td>
<td class="eo_13960">&#10004;</td>
<td class="hr_2575"></td>
<td class="hr_6216"></td>
<td class="baibor"></td>
<td class="s_1353"></td>
<td class="nist_rmf"></td>
<td class="gao_21_519sp"></td>
<td class="eo_14110">&#10004;</td>
<td class="m_24_10">&#10004;</td>
</tr>
<tr>
<th scope="row">Interpretability/understandability/traceability </th>
<td class="eo_13859">&#10004;</td>
<td class="eo_13960">&#10004;</td>
<td class="hr_2575"></td>
<td class="hr_6216"></td>
<td class="baibor">&#10004;</td>
<td class="s_1353"></td>
<td class="nist_rmf">&#10004;</td>
<td class="gao_21_519sp">&#10004;</td>
<td class="eo_14110"></td>
<td class="m_24_10">&#10004;</td>
</tr>
<tr>
<th scope="row">Reproducibility/repeatability </th>
<td class="eo_13859"></td>
<td class="eo_13960"></td>
<td class="hr_2575"></td>
<td class="hr_6216"></td>
<td class="baibor"></td>
<td class="s_1353"></td>
<td class="nist_rmf"></td>
<td class="gao_21_519sp"></td>
<td class="eo_14110">&#10004;</td>
<td class="m_24_10"></td>
</tr>
<tr>
<th scope="row">Testing/evaluation/audit </th>
<td class="eo_13859">&#10004;</td>
<td class="eo_13960">&#10004;</td>
<td class="hr_2575"></td>
<td class="hr_6216"></td>
<td class="baibor">&#10004;</td>
<td class="s_1353"></td>
<td class="nist_rmf">&#10004;</td>
<td class="gao_21_519sp">&#10004;</td>
<td class="eo_14110">&#10004;</td>
<td class="m_24_10">&#10004;</td>
</tr>
<tr>
<th scope="row">Mitigating risks </th>
<td class="eo_13859">&#10004;</td>
<td class="eo_13960">&#10004;</td>
<td class="hr_2575"></td>
<td class="hr_6216"></td>
<td class="baibor">&#10004;</td>
<td class="s_1353"></td>
<td class="nist_rmf">&#10004;</td>
<td class="gao_21_519sp">&#10004;</td>
<td class="eo_14110">&#10004;</td>
<td class="m_24_10">&#10004;</td>
</tr>
<tr>
<th scope="row">Algorithmic Bias </th>
<td class="eo_13859"></td>
<td class="eo_13960"></td>
<td class="hr_2575">&#10004;</td>
<td class="hr_6216"></td>
<td class="baibor">&#10004;</td>
<td class="s_1353"></td>
<td class="nist_rmf">&#10004;</td>
<td class="gao_21_519sp">&#10004;</td>
<td class="eo_14110">&#10004;</td>
<td class="m_24_10">&#10004;</td>
</tr>
<tr>
<th scope="row">Disclosure of AI use</th>
<td class="eo_13859"></td>
<td class="eo_13960">&#10004;</td>
<td class="hr_2575"></td>
<td class="hr_6216"></td>
<td class="baibor">&#10004;</td>
<td class="s_1353"></td>
<td class="nist_rmf"></td>
<td class="gao_21_519sp">&#10004;</td>
<td class="eo_14110">&#10004;</td>
<td class="m_24_10">&#10004;</td>
</tr>
<tr>
<th scope="row">Contestability of AI use</th>
<td class="eo_13859"></td>
<td class="eo_13960"></td>
<td class="hr_2575"></td>
<td class="hr_6216"></td>
<td class="baibor">&#10004;</td>
<td class="s_1353"></td>
<td class="nist_rmf"></td>
<td class="gao_21_519sp"></td>
<td class="eo_14110">&#10004;</td>
<td class="m_24_10">&#10004;</td>
</tr>
</tbody>
</table>
</div>


<script src="{{ site.baseurl }}/src/js/citation-graph.bundle.js"></script>
<script src="{{ site.baseurl }}/helpers/citationGraph.js"></script>
34 changes: 34 additions & 0 deletions gulpfile.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
const gulp = require('gulp');
const concat = require('gulp-concat');
const uglify = require('gulp-uglify');


// bundle d3 code for team page US map
gulp.task('bundle-team-map-modules', function() {
return gulp.src(
[
'node_modules/d3-array/dist/d3-array.min.js',
'node_modules/d3-geo/dist/d3-geo.min.js',
'node_modules/d3-selection/dist/d3-selection.min.js',
'node_modules/topojson/dist/topojson.min.js'
],
{base:'node_modules/'}
)
.pipe(uglify())
.pipe(concat('team-map.bundle.js'))
.pipe(gulp.dest("src/js/"))
});

// bundle d3 code for citation graph blog post
gulp.task('bundle-citation-graph', function() {
return gulp.src(
[
'node_modules/d3/build/d3.min.js',
'node_modules/d3-selection/dist/d3-selection.min.js',
],
{base:'node_modules/'}
)
.pipe(uglify())
.pipe(concat('citation-graph.bundle.js'))
.pipe(gulp.dest("src/js/"))
});
Loading
Loading