Spaces:
Running
on
Zero
Running
on
Zero
File size: 4,378 Bytes
ed2055f 0d60659 99e0c33 0d60659 ed2055f 0d60659 ed2055f 20c7059 ed2055f |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Experiment Interface Guide</title>
<!-- Link to Font Awesome for icons -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" rel="stylesheet">
<style>
body {
font-family: Arial, sans-serif;
line-height: 1.6;
margin: 20px;
}
h2 {
color: #2c3e50;
}
.section {
margin-bottom: 20px;
}
ul {
list-style-type: disc;
margin-left: 20px;
}
.icon {
margin-left: 5px;
color: #3498db;
}
@media (prefers-color-scheme: dark) {
.highlight {
display: inline-block;
background-color: #333; /* Background color of the box */
color: #ffffff !important; /* Text color */
padding: 2px 5px; /* Padding inside the box */
border-radius: 5px; /* Rounded corners */
border: 1px solid rgba(0, 0, 0, 0.2); /* Border (optional for added effect) */
}
.button {
display: inline-block;
background-color: #f97316; /* Background color of the box */
color: #ffffff !important; /* Text color */
padding: 2px 5px; /* Padding inside the box */
border-radius: 5px; /* Rounded corners */
border: 1px solid rgba(0, 0, 0, 0.2); /* Border (optional for added effect) */
}
}
@media (prefers-color-scheme: light) {
.highlight {
display: inline-block;
background-color: #ffe8ef; /* Background color of the box */
color: #C01343 !important; /* Text color */
padding: 2px 5px; /* Padding inside the box */
border-radius: 5px; /* Rounded corners */
border: 1px solid rgba(0, 0, 0, 0.2); /* Border (optional for added effect) */
}
.button {
display: inline-block;
background-color: #fdba74; /* Background color of the box */
color: #ea580c !important; /* Text color */
padding: 2px 5px; /* Padding inside the box */
border-radius: 5px; /* Rounded corners */
border: 1px solid rgba(0, 0, 0, 0.2); /* Border (optional for added effect) */
}
}
</style>
</head>
<body>
<div class="section">
<h1>Detection</h1>
<p>This tab displays the structure of the model inputted into the generated <span class="highlight"> Experiment </span>. It shows a directed graph where each layer is represented as a node and each connection as an edge.</p>
</div>
<div class="section">
<h1>Local Explanation</h1>
<p>This tab allows users to select a local instance for the generated <span class="highlight"> Experiment </span>, automatically generate explanations, and perform evaluation and validation. It automatically classifies the available XAI (Explainable AI) methods for the input model and provides a UI for users to select the necessary methods.</p>
<p>The usage steps are as follows:</p>
<ul>
<li>Select an input from the <span class="highlight"> Input Data Gallery </span>. </li>
<li>In the <span class="highlight">Explainers</span> section, open the dropdown to select a <span class="highlight"> Default parameter </span> or click the <span class="button"> Optimize </span> button to perform hyperparameter optimization, and then select the <span class="highlight"> Optimized parameter </span> to use the corresponding XAI method.</li>
<li>In the <span class="highlight">Evaluators</span> section, choose a metric to evaluate the XAI.</li>
<li>Click the <span class="button">Explain</span> button. </li>
</ul>
<p>The explanation results for the selected XAI methods will be displayed and sorted in order of the selected metric's results.</p>
<p><em>*Demo server is fixed to use 'AbPC' metric as an object of the optimization and ranking.</em></p>
</div>
</body>
</html>
|