Spaces:
Sleeping
Sleeping
init
Browse files- README.md +2 -1
- app.py +545 -0
- global.js +446 -0
- graph.html +49 -0
- packages.txt +10 -0
- requirements.txt +2 -0
- vis-network.min.js +0 -0
README.md
CHANGED
@@ -1,5 +1,5 @@
|
|
1 |
---
|
2 |
-
title: DA
|
3 |
emoji: 😻
|
4 |
colorFrom: red
|
5 |
colorTo: gray
|
@@ -7,6 +7,7 @@ sdk: gradio
|
|
7 |
sdk_version: 3.28.3
|
8 |
app_file: app.py
|
9 |
pinned: false
|
|
|
10 |
---
|
11 |
|
12 |
Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
|
|
|
1 |
---
|
2 |
+
title: DA-Transformer
|
3 |
emoji: 😻
|
4 |
colorFrom: red
|
5 |
colorTo: gray
|
|
|
7 |
sdk_version: 3.28.3
|
8 |
app_file: app.py
|
9 |
pinned: false
|
10 |
+
license: apache-2.0
|
11 |
---
|
12 |
|
13 |
Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
|
app.py
ADDED
@@ -0,0 +1,545 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
import argparse
|
2 |
+
from collections import defaultdict
|
3 |
+
import datetime
|
4 |
+
import json
|
5 |
+
import os, sys
|
6 |
+
import time
|
7 |
+
import concurrent
|
8 |
+
|
9 |
+
import math
|
10 |
+
import gradio as gr
|
11 |
+
import requests
|
12 |
+
import logging
|
13 |
+
import numpy as np
|
14 |
+
import matplotlib.pyplot as plt
|
15 |
+
import fairseq
|
16 |
+
|
17 |
+
|
18 |
+
fairseq_path = os.path.dirname(os.path.dirname(fairseq.__file__))
|
19 |
+
|
20 |
+
sys.path.insert(1, f"{fairseq_path}")
|
21 |
+
from fs_plugins.models.glat_decomposed_with_link import GlatDecomposedLink
|
22 |
+
|
23 |
+
sys.path.insert(1, f"{fairseq_path}/examples")
|
24 |
+
from mass.s2s_model import TransformerMASSModel
|
25 |
+
from transformer.hub_interface import TransformerHubInterface
|
26 |
+
|
27 |
+
logger = logging.getLogger(__name__)
|
28 |
+
|
29 |
+
notice_markdown = ("""
|
30 |
+
# Directed Acyclic Transformer: A Non-Autoregressive Sequence-to-Sequence Model designed for Parallel Text Generation.
|
31 |
+
- **Fast Generation**: DA-Transformer offers faster inference compared to autoregressive Transformers (with fairseq implementation), with a reduction in latency by 7~14x and an increase in throughput by ~20x.
|
32 |
+
- **High Quality**: DA-Transformer performs competitively with autoregressive Transformers, even with pre-trained models like BART, in a variety of text generation tasks.
|
33 |
+
- **Easy Training**: DA-Transformer can be trained end-to-end without requiring knowledge distillation, making it simple and straightforward to train.
|
34 |
+
|
35 |
+
## Resources
|
36 |
+
|
37 |
+
- [[Github]](https://github.com/thu-coai/DA-Transformer)
|
38 |
+
- Papers: [[Machine Translation]](https://proceedings.mlr.press/v162/huang22m/huang22m.pdf) [[Pre-training]](https://arxiv.org/pdf/2304.11791.pdf)
|
39 |
+
|
40 |
+
## Terms of use
|
41 |
+
By using this service, users are required to agree to the following terms: The service is a research preview intended for non-commercial use only. It does not gaurantee the correctness of the output text. The service may collect user data for future research.
|
42 |
+
|
43 |
+
## This demo contains models
|
44 |
+
- [En-De Translation]()
|
45 |
+
- [Zh-En Translation]()
|
46 |
+
- [Question Generation]()
|
47 |
+
""")
|
48 |
+
|
49 |
+
learn_more_markdown = ("""
|
50 |
+
""")
|
51 |
+
|
52 |
+
|
53 |
+
css = """
|
54 |
+
pre {
|
55 |
+
white-space: pre-wrap; /* Since CSS 2.1 */
|
56 |
+
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
|
57 |
+
white-space: -pre-wrap; /* Opera 4-6 */
|
58 |
+
white-space: -o-pre-wrap; /* Opera 7 */
|
59 |
+
word-wrap: break-word; /* Internet Explorer 5.5+ */
|
60 |
+
}
|
61 |
+
"""
|
62 |
+
|
63 |
+
available_models = {
|
64 |
+
"dat_base_translation_ende": {
|
65 |
+
"class": GlatDecomposedLink,
|
66 |
+
"args":{
|
67 |
+
"model_name_or_path": "hfhub://thu-coai/dat_base_translation_ende",
|
68 |
+
"decode_strategy": "beamsearch",
|
69 |
+
"decode_max_workers": 1,
|
70 |
+
"decode_threads_per_worker": 4,
|
71 |
+
"decode_dedup": True,
|
72 |
+
"decode_alpha": 1.1,
|
73 |
+
"decode_gamma": 0,
|
74 |
+
"decode_beam_size": 200,
|
75 |
+
"decode_batch_size": 1,
|
76 |
+
"decode_top_cand": 5,
|
77 |
+
"decode_max_beam_per_length": 10,
|
78 |
+
"max_decoder_batch_tokens": 2048
|
79 |
+
},
|
80 |
+
"examples": ["I am a fast translation model."],
|
81 |
+
"expected_load_time": 17
|
82 |
+
},
|
83 |
+
"dat_base_translation_zhen": {
|
84 |
+
"class": GlatDecomposedLink,
|
85 |
+
"args":{
|
86 |
+
"model_name_or_path": "hfhub://thu-coai/dat_base_translation_zhen",
|
87 |
+
"decode_strategy": "beamsearch",
|
88 |
+
"decode_max_workers": 1,
|
89 |
+
"decode_threads_per_worker": 4,
|
90 |
+
"decode_dedup": True,
|
91 |
+
"decode_alpha": 1.1,
|
92 |
+
"decode_gamma": 0,
|
93 |
+
"decode_beam_size": 200,
|
94 |
+
"decode_batch_size": 1,
|
95 |
+
"decode_top_cand": 5,
|
96 |
+
"decode_max_beam_per_length": 10,
|
97 |
+
"max_decoder_batch_tokens": 2048
|
98 |
+
},
|
99 |
+
"examples": ["我是一个高速的机器翻译模型。"],
|
100 |
+
"expected_load_time": 17
|
101 |
+
},
|
102 |
+
"dat_uncased_squad": {
|
103 |
+
"class": GlatDecomposedLink,
|
104 |
+
"args":{
|
105 |
+
"model_name_or_path": "hfhub://thu-coai/dat_uncased_squad",
|
106 |
+
"decode_strategy": "beamsearch",
|
107 |
+
"decode_max_workers": 1,
|
108 |
+
"decode_threads_per_worker": 4,
|
109 |
+
"decode_gamma": 0,
|
110 |
+
"decode_beam_size": 200,
|
111 |
+
"decode_batch_size": 1,
|
112 |
+
"decode_top_cand": 5,
|
113 |
+
"decode_no_consecutive_repeated_tokens": 3,
|
114 |
+
"decode_no_repeated_tokens": 2,
|
115 |
+
"decode_max_beam_per_length": 10,
|
116 |
+
"max_decoder_batch_tokens": 2048
|
117 |
+
},
|
118 |
+
"examples": ["Two [SEP] Two additional teams of 40 attendants each will accompany the flame on its mainland China route."],
|
119 |
+
"expected_load_time": 20
|
120 |
+
},
|
121 |
+
"mass_uncased_squad": {
|
122 |
+
"class": TransformerMASSModel,
|
123 |
+
"args":{
|
124 |
+
"model_name_or_path": "hfhub://thu-coai/mass_uncased_squad"
|
125 |
+
},
|
126 |
+
"examples": ["Two [SEP] Two additional teams of 40 attendants each will accompany the flame on its mainland China route."],
|
127 |
+
"expected_load_time": 10
|
128 |
+
},
|
129 |
+
"transformer_base_translation_ende": {
|
130 |
+
"class": TransformerHubInterface,
|
131 |
+
"args":{
|
132 |
+
"model_name_or_path": "hfhub://thu-coai/transformer_base_translation_ende"
|
133 |
+
},
|
134 |
+
"examples": ["I am a fast translation model."],
|
135 |
+
"expected_load_time": 10
|
136 |
+
},
|
137 |
+
"transformer_base_translation_zhen": {
|
138 |
+
"class": TransformerHubInterface,
|
139 |
+
"args":{
|
140 |
+
"model_name_or_path": "hfhub://thu-coai/transformer_base_translation_zhen"
|
141 |
+
},
|
142 |
+
"examples": ["我是一个高速的机器翻译模型。"],
|
143 |
+
"expected_load_time": 10
|
144 |
+
}
|
145 |
+
}
|
146 |
+
|
147 |
+
compare_available_types = {
|
148 |
+
"Translation Zh-En: DA-Transformer v.s. Autoregressive Transformer": {
|
149 |
+
"models": ['dat_base_translation_zhen', 'transformer_base_translation_zhen'],
|
150 |
+
"examples": ["我是一个高速的机器翻译模型。", "非自回归模型可以用来加速自然语言生成。",
|
151 |
+
"使用本服务前,用户必须同意以下条款:该服务是仅供非商业用途的研究预览。它不保证输出文本的正确性。本服务可能会收集用户数据以供将来研究。"],
|
152 |
+
"placeholder": "请输入一个中文句子。 (The model will translate the input into English.)"
|
153 |
+
},
|
154 |
+
"Question Generation: DA-Transformer v.s. MASS": {
|
155 |
+
"models": ['dat_uncased_squad', "mass_uncased_squad"],
|
156 |
+
"examples": ["Two [SEP] Two additional teams of 40 attendants each will accompany the flame on its mainland China route.", "DA-Transformer [SEP] Directed Acyclic Transformer (DA-Transformer) is a non-autoregressive sequence-to-sequence model designed for parallel text generation."],
|
157 |
+
"placeholder": "Answer [SEP] Your Passage Here (the answer should be appearred in the passage)."
|
158 |
+
},
|
159 |
+
"Translation En-De: DA-Transformer v.s. Autoregressive Transformer": {
|
160 |
+
"models": ['dat_base_translation_ende', 'transformer_base_translation_ende'],
|
161 |
+
"examples": ["I am a fast translation model.", "Non-autoregressive models are designed for fast natural language generation.",
|
162 |
+
"By using this service, users are required to agree to the following terms: The service is a research preview intended for non-commercial use only."],
|
163 |
+
"placeholder": "Any English sentence here. (The model will translate the input into German.)"
|
164 |
+
},
|
165 |
+
}
|
166 |
+
|
167 |
+
detail_available_types = {
|
168 |
+
"Translation Zh-En": {
|
169 |
+
"model": 'dat_base_translation_zhen',
|
170 |
+
"examples": compare_available_types['Translation Zh-En: DA-Transformer v.s. Autoregressive Transformer']["examples"],
|
171 |
+
"placeholder": compare_available_types['Translation Zh-En: DA-Transformer v.s. Autoregressive Transformer']["placeholder"]
|
172 |
+
},
|
173 |
+
"Question Generation": {
|
174 |
+
"model": 'dat_uncased_squad',
|
175 |
+
"examples": compare_available_types['Question Generation: DA-Transformer v.s. MASS']["examples"],
|
176 |
+
"placeholder": compare_available_types['Question Generation: DA-Transformer v.s. MASS']["placeholder"]
|
177 |
+
},
|
178 |
+
"Translation En-De": {
|
179 |
+
"model": 'dat_base_translation_ende',
|
180 |
+
"examples": compare_available_types['Translation En-De: DA-Transformer v.s. Autoregressive Transformer']["examples"],
|
181 |
+
"placeholder": compare_available_types['Translation En-De: DA-Transformer v.s. Autoregressive Transformer']["placeholder"],
|
182 |
+
},
|
183 |
+
}
|
184 |
+
|
185 |
+
models = {}
|
186 |
+
workers = None
|
187 |
+
|
188 |
+
def softplus(x, beta=1):
|
189 |
+
return math.log1p(math.exp(-abs(x * beta))) / beta + max(x, 0)
|
190 |
+
|
191 |
+
def get_fake_progress(min_progress, max_progress, used_time, expected_time):
|
192 |
+
percentage = max(1 - softplus(expected_time - used_time) / expected_time, 0)
|
193 |
+
return min_progress + (max_progress - min_progress) * percentage
|
194 |
+
|
195 |
+
def generate(model, model_input):
|
196 |
+
return {"output": model.translate(model_input)}
|
197 |
+
|
198 |
+
def generate_detail(model, model_input):
|
199 |
+
output, graph_info = model.generate_graph(model_input)
|
200 |
+
return {"output": output, "graph_info": graph_info}
|
201 |
+
|
202 |
+
def load_model(model_name):
|
203 |
+
assert model_name in available_models
|
204 |
+
model = available_models[model_name]['class'].from_pretrained(**available_models[model_name]['args'])
|
205 |
+
return model
|
206 |
+
|
207 |
+
def warmup_model(model, model_name):
|
208 |
+
model.translate(available_models[model_name]['examples'][0])
|
209 |
+
|
210 |
+
def submit(model_name, model_input, generate_fn, request: gr.Request, progress=gr.Progress()):
|
211 |
+
assert workers is not None, "No workers"
|
212 |
+
current_progress = 0
|
213 |
+
|
214 |
+
progress(0, desc="Downloading Checkpoints and Loading Models")
|
215 |
+
if model_name not in models:
|
216 |
+
load_start = time.time()
|
217 |
+
future = workers.submit(load_model, model_name)
|
218 |
+
while True:
|
219 |
+
try:
|
220 |
+
model = future.result(timeout=1)
|
221 |
+
break
|
222 |
+
except concurrent.futures._base.TimeoutError as _:
|
223 |
+
progress(get_fake_progress(min_progress=current_progress, max_progress=0.8, used_time=time.time() - load_start, expected_time=available_models[model_name]['expected_load_time']),
|
224 |
+
desc="Downloading Checkpoints and Loading Models")
|
225 |
+
logger.info(f"Model Loaded: {model_name} Load Time: {time.time() - load_start}")
|
226 |
+
current_progress = 0.8
|
227 |
+
models[model_name] = model
|
228 |
+
else:
|
229 |
+
model = models[model_name]
|
230 |
+
|
231 |
+
# warmup for better inference time
|
232 |
+
progress(current_progress, desc="Downloading Checkpoints and Loading Models")
|
233 |
+
if current_progress == 0.8:
|
234 |
+
target_progress = 0.9
|
235 |
+
else:
|
236 |
+
target_progress = 0.5
|
237 |
+
warmup_start = time.time()
|
238 |
+
future = workers.submit(warmup_model, model, model_name)
|
239 |
+
while True:
|
240 |
+
try:
|
241 |
+
result = future.result(timeout=1)
|
242 |
+
break
|
243 |
+
except concurrent.futures._base.TimeoutError as _:
|
244 |
+
progress(get_fake_progress(min_progress=current_progress, max_progress=target_progress, used_time=time.time() - warmup_start, expected_time=1),
|
245 |
+
desc="Downloading Checkpoints and Loading Models")
|
246 |
+
current_progress = target_progress
|
247 |
+
|
248 |
+
# running
|
249 |
+
progress(current_progress, desc="Running")
|
250 |
+
try:
|
251 |
+
generate_start = time.time()
|
252 |
+
future = workers.submit(generate_fn, model, model_input)
|
253 |
+
while True:
|
254 |
+
try:
|
255 |
+
result = future.result(timeout=1)
|
256 |
+
break
|
257 |
+
except concurrent.futures._base.TimeoutError as _:
|
258 |
+
progress(get_fake_progress(min_progress=current_progress, max_progress=1, used_time=time.time() - generate_start, expected_time=1),
|
259 |
+
desc="Running")
|
260 |
+
inference_time = time.time() - generate_start
|
261 |
+
|
262 |
+
result_abbrev = {}
|
263 |
+
for key, value in result.items():
|
264 |
+
log_str = str(value)
|
265 |
+
if len(log_str) > 1024:
|
266 |
+
log_str = log_str[:1024] + "..."
|
267 |
+
result_abbrev[key] = log_str
|
268 |
+
logger.info(f"Input: [{model_input}] Output: [{result_abbrev}] Inference Time: {inference_time}")
|
269 |
+
return result, inference_time
|
270 |
+
except RuntimeError as err:
|
271 |
+
return f"Runtime Error: {str(err)}", 0
|
272 |
+
|
273 |
+
|
274 |
+
def compare_init_state(model_selector):
|
275 |
+
model1 = compare_available_types[model_selector]['models'][0]
|
276 |
+
model2 = compare_available_types[model_selector]['models'][1]
|
277 |
+
state = [{"model_name": model1}, {"model_name": model2}]
|
278 |
+
return state
|
279 |
+
|
280 |
+
def compare_refresh(model_selector, samples):
|
281 |
+
model1 = compare_available_types[model_selector]['models'][0]
|
282 |
+
model2 = compare_available_types[model_selector]['models'][1]
|
283 |
+
model_output1 = gr.Textbox.update(visible=True, label=model1)
|
284 |
+
model_output2 = gr.Textbox.update(visible=True, label=model2)
|
285 |
+
model_input = gr.Textbox.update(value="", placeholder=compare_available_types[model_selector]['placeholder'])
|
286 |
+
samples.clear()
|
287 |
+
samples += [[x]for x in compare_available_types[model_selector]['examples']]
|
288 |
+
examples = gr.Dataset.update(samples=samples)
|
289 |
+
model_speed = gr.Plot.update(visible=False)
|
290 |
+
return model_input, model_output1, model_output2, examples, samples, model_speed
|
291 |
+
|
292 |
+
def compare_submit(model_input, idx, state, request: gr.Request, progress=gr.Progress()):
|
293 |
+
model_name = state[idx]['model_name']
|
294 |
+
model_output, inference_time = submit(model_name, model_input, generate, request, progress)
|
295 |
+
state[idx]['inference_time'] = inference_time
|
296 |
+
return model_output['output'], state
|
297 |
+
|
298 |
+
def compare_dataset_click(examples, samples):
|
299 |
+
return samples[examples][0]
|
300 |
+
|
301 |
+
def compare_show_plot(state):
|
302 |
+
x = [state[0]['model_name'], state[1]['model_name']]
|
303 |
+
y = [state[0]['inference_time'], state[1]['inference_time']]
|
304 |
+
|
305 |
+
fig = plt.figure(figsize=(12, 2.5))
|
306 |
+
ax = plt.subplot(111)
|
307 |
+
bars = ax.barh(x, y, 0.75)
|
308 |
+
ax.bar_label(bars, fmt="%.2f")
|
309 |
+
ax.set_yticks(np.arange(len(x)), labels=x)
|
310 |
+
ax.set_xlabel('Inference Time on CPU (s)')
|
311 |
+
plt.tight_layout()
|
312 |
+
# plt.subplots_adjust(left=0.1, bottom=0.1, right=0.9, top=0.9, wspace=0, hspace=0)
|
313 |
+
|
314 |
+
return gr.Row.update(visible=True), gr.Plot.update(value=fig, visible=True)
|
315 |
+
|
316 |
+
def compare_clear():
|
317 |
+
return "", "", "", gr.Row.update(visible=False)
|
318 |
+
|
319 |
+
example_list = []
|
320 |
+
|
321 |
+
def build_tab_compare():
|
322 |
+
state = gr.State()
|
323 |
+
samples = gr.State(example_list)
|
324 |
+
|
325 |
+
available_type_names = list(compare_available_types.keys())
|
326 |
+
with gr.Row(elem_id="compare_model_selector_row"):
|
327 |
+
model_selector = gr.Dropdown(
|
328 |
+
choices=available_type_names,
|
329 |
+
value=available_type_names[0] if len(available_type_names) > 0 else "",
|
330 |
+
interactive=True,
|
331 |
+
show_label=False).style(container=False)
|
332 |
+
|
333 |
+
with gr.Row(elem_id="compare_model_input"):
|
334 |
+
model_input = gr.Textbox(lines=5, label="input")
|
335 |
+
# examples = gr.Dataset(examples=[], inputs=[model_input], elem_id="compare_examples")
|
336 |
+
examples = gr.Dataset(components=[model_input],
|
337 |
+
label="Examples",
|
338 |
+
type='index',
|
339 |
+
samples=example_list,
|
340 |
+
visible=True
|
341 |
+
)
|
342 |
+
|
343 |
+
# with gr.Row(elem_id="compare_examples"):
|
344 |
+
|
345 |
+
with gr.Row():
|
346 |
+
clear_btn = gr.Button(value="Clear")
|
347 |
+
submit_btn = gr.Button(value="Submit", variant="primary")
|
348 |
+
|
349 |
+
# with gr.Accordion("Parameters", open=False, visible=False) as parameter_row:
|
350 |
+
# temperature = gr.Slider(minimum=0.0, maximum=1.0, value=0.7, step=0.1, interactive=True, label="Temperature",)
|
351 |
+
# max_output_tokens = gr.Slider(minimum=0, maximum=1024, value=512, step=64, interactive=True, label="Max output tokens",)
|
352 |
+
|
353 |
+
with gr.Row(elem_id="compare_model_output"):
|
354 |
+
model_output1 = gr.Textbox(lines=5, label="output", visible=False)
|
355 |
+
model_output2 = gr.Textbox(lines=5, label="output", visible=False)
|
356 |
+
|
357 |
+
with gr.Row(elem_id="compare_model_speed", visible=False) as row:
|
358 |
+
with gr.Column():
|
359 |
+
model_speed = gr.Plot(value=None, label="Speed")
|
360 |
+
compare_hints = gr.Markdown("**Note the above time is measured on a free cloud server, which does not use GPU and is thus different from the setting in the papers.**")
|
361 |
+
|
362 |
+
model_selector.change(compare_refresh, [model_selector, samples], [model_input, model_output1, model_output2, examples, samples, model_speed])
|
363 |
+
|
364 |
+
clear_btn.click(compare_clear, None, [model_input, model_output1, model_output2, row])
|
365 |
+
|
366 |
+
submit_btn.click(compare_init_state, [model_selector], [state]).\
|
367 |
+
then(compare_submit, [model_input, gr.Number(value=0, visible=False, precision=0), state], [model_output1, state]).\
|
368 |
+
then(compare_submit, [model_input, gr.Number(value=1, visible=False, precision=0), state], [model_output2, state]).\
|
369 |
+
then(compare_show_plot, [state], [row, model_speed])
|
370 |
+
# submit_btn.click(compare_show_plot, [state], [model_speed])
|
371 |
+
|
372 |
+
examples.click(compare_dataset_click, [examples, samples], [model_input])
|
373 |
+
|
374 |
+
def load(fn):
|
375 |
+
fn(compare_refresh, [model_selector, samples], [model_input, model_output1, model_output2, examples, samples])
|
376 |
+
|
377 |
+
return load
|
378 |
+
|
379 |
+
def detail_init_state(model_selector):
|
380 |
+
model = detail_available_types[model_selector]['model']
|
381 |
+
state = {"model_name": model, "cnt": 0}
|
382 |
+
return state
|
383 |
+
|
384 |
+
def detail_refresh(model_selector, samples):
|
385 |
+
model = detail_available_types[model_selector]['model']
|
386 |
+
model_output = gr.Textbox.update(visible=True, label=model)
|
387 |
+
model_input = gr.Textbox.update(value="", placeholder=detail_available_types[model_selector]['placeholder'])
|
388 |
+
samples.clear()
|
389 |
+
samples += [[x]for x in detail_available_types[model_selector]['examples']]
|
390 |
+
examples = gr.Dataset.update(samples=samples)
|
391 |
+
model_speed = gr.Plot.update(visible=False)
|
392 |
+
return model_input, model_output, examples, samples, model_speed
|
393 |
+
|
394 |
+
def detail_submit(model_input, state, request: gr.Request, progress=gr.Progress()):
|
395 |
+
model_name = state['model_name']
|
396 |
+
model_output, inference_time = submit(model_name, model_input, generate_detail, request, progress)
|
397 |
+
state['inference_time'] = inference_time
|
398 |
+
state["graph_info"] = model_output['graph_info']
|
399 |
+
# html_code = open("graph.html").read()
|
400 |
+
|
401 |
+
# state["cnt"] += 1
|
402 |
+
# if state["cnt"] > 2:
|
403 |
+
# html_code += r"""<script type="text/javascript">addNode();</script>\n"""
|
404 |
+
# print(html_code)
|
405 |
+
|
406 |
+
return model_output['output'], state, gr.Row.update(visible=True), json.dumps(state)
|
407 |
+
|
408 |
+
def detail_dataset_click(examples, samples):
|
409 |
+
return samples[examples][0]
|
410 |
+
|
411 |
+
def detail_clear():
|
412 |
+
return "", "", gr.Row.update(visible=False)
|
413 |
+
|
414 |
+
def build_tab_detail():
|
415 |
+
|
416 |
+
state = gr.State()
|
417 |
+
samples = gr.State(example_list)
|
418 |
+
|
419 |
+
available_type_names = list(detail_available_types.keys())
|
420 |
+
with gr.Row(elem_id="detail_model_selector_row"):
|
421 |
+
model_selector = gr.Dropdown(
|
422 |
+
choices=available_type_names,
|
423 |
+
value=available_type_names[0] if len(available_type_names) > 0 else "",
|
424 |
+
interactive=True,
|
425 |
+
show_label=False).style(container=False)
|
426 |
+
|
427 |
+
with gr.Row(elem_id="detail_model_input"):
|
428 |
+
model_input = gr.Textbox(lines=5, label="input")
|
429 |
+
# examples = gr.Dataset(examples=[], inputs=[model_input], elem_id="compare_examples")
|
430 |
+
examples = gr.Dataset(components=[model_input],
|
431 |
+
label="Examples",
|
432 |
+
type='index',
|
433 |
+
samples=example_list,
|
434 |
+
visible=True
|
435 |
+
)
|
436 |
+
|
437 |
+
# with gr.Row(elem_id="compare_examples"):
|
438 |
+
|
439 |
+
with gr.Row():
|
440 |
+
clear_btn = gr.Button(value="Clear")
|
441 |
+
submit_btn = gr.Button(value="Submit", variant="primary")
|
442 |
+
|
443 |
+
# with gr.Accordion("Parameters", open=False, visible=False) as parameter_row:
|
444 |
+
# temperature = gr.Slider(minimum=0.0, maximum=1.0, value=0.7, step=0.1, interactive=True, label="Temperature",)
|
445 |
+
# max_output_tokens = gr.Slider(minimum=0, maximum=1024, value=512, step=64, interactive=True, label="Max output tokens",)
|
446 |
+
|
447 |
+
with gr.Row(elem_id="detail_model_output"):
|
448 |
+
model_output = gr.Textbox(lines=5, label="output", visible=False)
|
449 |
+
|
450 |
+
with gr.Row(visible=False) as dag_graph:
|
451 |
+
with gr.Column(scale=1.8):
|
452 |
+
html = gr.HTML(open("graph.html").read())
|
453 |
+
with gr.Column(scale=1):
|
454 |
+
minimum_node_pass_prob = gr.Slider(0, 1, value=0.2, label="Show nodes with passing probability greater than", info="Nodes that predict the output sequence are always visible")
|
455 |
+
minimum_edge_prob = gr.Slider(0, 1, value=0.1, label="Show edges with transition probability greater than")
|
456 |
+
max_out_edge_num = gr.Slider(1, 10, value=5, step=1, label="Show top-k outgoing edges with k")
|
457 |
+
max_out_edge_prob = gr.Slider(0, 1, value=0.9, label="Show top-p outgoing edges with p")
|
458 |
+
force_in_edge = gr.Checkbox(True, label="Show at least one incoming edge for each node")
|
459 |
+
show_node_detail = gr.Checkbox(False, label="Show verbose node information")
|
460 |
+
show_edge_label = gr.Checkbox(False, label="Show transition probability")
|
461 |
+
network_refresh = gr.Button(value="Reinitialize DAG Visualization")
|
462 |
+
graph_parameters = [minimum_node_pass_prob, minimum_edge_prob, max_out_edge_num, max_out_edge_prob, force_in_edge, show_node_detail, show_edge_label]
|
463 |
+
|
464 |
+
js_state = gr.Textbox(visible=False)
|
465 |
+
|
466 |
+
model_selector.change(detail_refresh, [model_selector, samples], [model_input, model_output, examples, samples])
|
467 |
+
|
468 |
+
clear_btn.click(detail_clear, None, [model_input, model_output, dag_graph])
|
469 |
+
|
470 |
+
graph_create_js = """(state_str, minimum_node_pass_prob, minimum_edge_prob, max_out_edge_num, max_out_edge_prob, force_in_edge, show_node_detail, show_edge_label) => {
|
471 |
+
var state = JSON.parse(state_str);
|
472 |
+
var options = {
|
473 |
+
minimum_node_pass_prob: minimum_node_pass_prob,
|
474 |
+
minimum_edge_prob: minimum_edge_prob,
|
475 |
+
max_out_edge_num: max_out_edge_num,
|
476 |
+
max_out_edge_prob: max_out_edge_prob,
|
477 |
+
force_in_edge: force_in_edge,
|
478 |
+
show_node_detail: show_node_detail,
|
479 |
+
show_edge_label: show_edge_label,
|
480 |
+
}
|
481 |
+
startNetwork(state.graph_info, options);
|
482 |
+
}"""
|
483 |
+
graph_update_js = """(minimum_node_pass_prob, minimum_edge_prob, max_out_edge_num, max_out_edge_prob, force_in_edge, show_node_detail, show_edge_label) => {
|
484 |
+
var options = {
|
485 |
+
minimum_node_pass_prob: minimum_node_pass_prob,
|
486 |
+
minimum_edge_prob: minimum_edge_prob,
|
487 |
+
max_out_edge_num: max_out_edge_num,
|
488 |
+
max_out_edge_prob: max_out_edge_prob,
|
489 |
+
force_in_edge: force_in_edge,
|
490 |
+
show_node_detail: show_node_detail,
|
491 |
+
show_edge_label: show_edge_label,
|
492 |
+
}
|
493 |
+
updateNetwork(options);
|
494 |
+
}"""
|
495 |
+
submit_btn.click(detail_init_state, [model_selector], [state]).\
|
496 |
+
then(detail_submit, [model_input, state], [model_output, state, dag_graph, js_state]).\
|
497 |
+
then(None, [js_state] + graph_parameters, None, _js=graph_create_js)
|
498 |
+
network_refresh.click(None, [js_state] + graph_parameters, None, _js=graph_create_js)
|
499 |
+
minimum_node_pass_prob.change(None, graph_parameters, None, _js=graph_update_js)
|
500 |
+
minimum_edge_prob.change(None, graph_parameters, None, _js=graph_update_js)
|
501 |
+
max_out_edge_num.change(None, graph_parameters, None, _js=graph_update_js)
|
502 |
+
max_out_edge_prob.change(None, graph_parameters, None, _js=graph_update_js)
|
503 |
+
force_in_edge.select(None, graph_parameters, None, _js=graph_update_js)
|
504 |
+
show_node_detail.select(None, graph_parameters, None, _js=graph_update_js)
|
505 |
+
show_edge_label.select(None, graph_parameters, None, _js=graph_update_js)
|
506 |
+
|
507 |
+
examples.click(detail_dataset_click, [examples, samples], [model_input])
|
508 |
+
|
509 |
+
def load(fn):
|
510 |
+
fn(detail_refresh, [model_selector, samples], [model_input, model_output, examples, samples])
|
511 |
+
|
512 |
+
return load
|
513 |
+
|
514 |
+
def build_demo():
|
515 |
+
with gr.Blocks(title="DA-Transformer Demo", theme=gr.themes.Base(), css=css) as demo:
|
516 |
+
gr.Markdown(notice_markdown)
|
517 |
+
|
518 |
+
with gr.Tab("Speed Comparison") as compare_tab:
|
519 |
+
compare_load = build_tab_compare()
|
520 |
+
compare_load(compare_tab.select)
|
521 |
+
with gr.Tab("DA-Transformer Inspection") as detail_tab:
|
522 |
+
detail_load = build_tab_detail()
|
523 |
+
detail_load(detail_tab.select)
|
524 |
+
|
525 |
+
gr.Markdown(learn_more_markdown)
|
526 |
+
|
527 |
+
compare_load(demo.load)
|
528 |
+
|
529 |
+
demo.load(None,None,None,_js=open("global.js").read())
|
530 |
+
return demo
|
531 |
+
|
532 |
+
if __name__ == "__main__":
|
533 |
+
parser = argparse.ArgumentParser()
|
534 |
+
parser.add_argument("--host", type=str, default="0.0.0.0")
|
535 |
+
parser.add_argument("--port", type=int)
|
536 |
+
parser.add_argument("--concurrency-count", type=int, default=1)
|
537 |
+
parser.add_argument("--share", action="store_true")
|
538 |
+
args = parser.parse_args()
|
539 |
+
logger.info(f"args: {args}")
|
540 |
+
|
541 |
+
workers = concurrent.futures.ThreadPoolExecutor(max_workers=1)
|
542 |
+
demo = build_demo()
|
543 |
+
demo.queue(concurrency_count=args.concurrency_count, status_update_rate=10,
|
544 |
+
api_open=False).launch(server_name=args.host, server_port=args.port,
|
545 |
+
share=args.share, max_threads=5)
|
global.js
ADDED
@@ -0,0 +1,446 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
() => {
|
2 |
+
var script = document.createElement("script");
|
3 |
+
script.src = "https://visjs.github.io/vis-network/standalone/umd/vis-network.min.js";
|
4 |
+
document.head.appendChild(script);
|
5 |
+
|
6 |
+
// var current_options;
|
7 |
+
// var node_pass_prob, prelen, max_path, node_tokens, node_probs, links, tarlen;
|
8 |
+
// var visible_nodes, map_max_path;
|
9 |
+
// var visible_edges, sorted_links_out, sorted_links_in;
|
10 |
+
// var nodes, edges, network;
|
11 |
+
// var disable_edge_select;
|
12 |
+
showing_node = undefined;
|
13 |
+
showing_edge = undefined;
|
14 |
+
|
15 |
+
function obtain_node_object(node_id) {
|
16 |
+
var title = "Node " + node_id.toString() + " (Pass Prob = " + node_pass_prob[node_id].toFixed(2) + ")\n";
|
17 |
+
title += "==========\n"
|
18 |
+
for(var j=0;j<5;j++){
|
19 |
+
if(node_probs[node_id][j]> 0.01){
|
20 |
+
title += node_tokens[node_id][j] + "\t" + node_probs[node_id][j].toFixed(2) + "\n";
|
21 |
+
}
|
22 |
+
}
|
23 |
+
|
24 |
+
var currentNode = {"id": node_id, "label": node_tokens[node_id][0], "value":node_pass_prob[node_id], "title": title};
|
25 |
+
if (current_options.show_node_detail){
|
26 |
+
currentNode.label = title;
|
27 |
+
}
|
28 |
+
if(map_max_path[node_id] !== undefined){
|
29 |
+
currentNode.x = map_max_path[node_id].x;
|
30 |
+
currentNode.y = map_max_path[node_id].y;
|
31 |
+
currentNode.fixed = true;
|
32 |
+
currentNode.mass = 5;
|
33 |
+
currentNode.color = {border: "red", background: "orange", highlight: {border: "red", background: "#ffcc66"}};
|
34 |
+
}
|
35 |
+
return currentNode;
|
36 |
+
}
|
37 |
+
|
38 |
+
function set_node_visibility(node_id, flag){
|
39 |
+
if(visible_nodes[node_id] == flag) return;
|
40 |
+
visible_nodes[node_id] = flag;
|
41 |
+
if(flag){
|
42 |
+
nodes.add(obtain_node_object(node_id));
|
43 |
+
}else{
|
44 |
+
nodes.remove(node_id);
|
45 |
+
}
|
46 |
+
}
|
47 |
+
|
48 |
+
function update_visible_nodes(clear_state=false){
|
49 |
+
if(typeof visible_nodes === "undefined" || clear_state){
|
50 |
+
visible_nodes = [...Array(prelen)].map((_, __) => false); // size: [prelen]
|
51 |
+
map_max_path = {}; // {node_id -> position on max_path}
|
52 |
+
var accumulated_x = 0;
|
53 |
+
for (var i=0;i<tarlen;i++){
|
54 |
+
accumulated_x += node_tokens[max_path[i]][0].length * 5
|
55 |
+
var y = Math.floor(Math.random() * 3) * 100 - 100;
|
56 |
+
map_max_path[max_path[i]] = {position: i, x: accumulated_x, y:y};
|
57 |
+
accumulated_x += node_tokens[max_path[i]][0].length * 5 + 100;
|
58 |
+
}
|
59 |
+
nodes = new vis.DataSet();
|
60 |
+
}
|
61 |
+
|
62 |
+
for (var i=0;i<prelen;i++){
|
63 |
+
if(node_pass_prob[i] >= current_options.minimum_node_pass_prob || map_max_path[i] !== undefined){
|
64 |
+
set_node_visibility(i, true);
|
65 |
+
}else{
|
66 |
+
set_node_visibility(i, false);
|
67 |
+
}
|
68 |
+
}
|
69 |
+
}
|
70 |
+
|
71 |
+
|
72 |
+
function update_node_details(){
|
73 |
+
for(var i=0;i<prelen;i++) if (visible_nodes[i]){
|
74 |
+
currentNode = obtain_node_object(i);
|
75 |
+
nodes.updateOnly(currentNode);
|
76 |
+
}
|
77 |
+
}
|
78 |
+
|
79 |
+
function obtain_edge_object(i, j){
|
80 |
+
var edge_id = i.toString() + "-" + j.toString();
|
81 |
+
var label = links[i][j].toFixed(2);
|
82 |
+
var pass_label = (node_pass_prob[i] * links[i][j]).toFixed(2);
|
83 |
+
var title = "From Node " + i.toString() + " to Node " + j.toString() + "\n" + "Transition Probability:" + label + "\nPassing Probability:" + pass_label;
|
84 |
+
var currentEdge = {id: edge_id,
|
85 |
+
from: i, to: j, value: links[i][j] * node_pass_prob[i], title: title};
|
86 |
+
if (map_max_path[i] !== undefined && map_max_path[j] !== undefined && map_max_path[i].position + 1 == map_max_path[j].position){
|
87 |
+
currentEdge.color = "red";
|
88 |
+
}
|
89 |
+
if(current_options.show_edge_label){
|
90 |
+
currentEdge.label = label;
|
91 |
+
}else{
|
92 |
+
currentEdge.label = " ";
|
93 |
+
}
|
94 |
+
|
95 |
+
return currentEdge;
|
96 |
+
}
|
97 |
+
|
98 |
+
function set_edge_visibility(i, j, flag){
|
99 |
+
if(visible_edges[i][j] == flag) return;
|
100 |
+
visible_edges[i][j] = flag;
|
101 |
+
if(flag){
|
102 |
+
edges.add(obtain_edge_object(i, j));
|
103 |
+
}else{
|
104 |
+
var edge_id = i.toString() + "-" + j.toString();
|
105 |
+
edges.remove(edge_id);
|
106 |
+
}
|
107 |
+
}
|
108 |
+
|
109 |
+
function update_visible_edges(clear_state=false){
|
110 |
+
if(typeof visible_edges === "undefined" || clear_state){
|
111 |
+
visible_edges = [...Array(prelen)].map((_, __) => {return [...Array(prelen)].map((_, __) => false);}); // size: [prelen, prelen]
|
112 |
+
|
113 |
+
sorted_links_out = []; // size: [prelen, prelen]
|
114 |
+
for (var i=0;i<prelen;i++){
|
115 |
+
// sort the out edge according to their prob
|
116 |
+
sorted_links_out.push(links[i].map((val, idx) => {return {'idx': idx, 'val': val};}).
|
117 |
+
sort((v1, v2) => v2.val - v1.val)
|
118 |
+
);
|
119 |
+
}
|
120 |
+
|
121 |
+
sorted_links_in = []; // size: [prelen, prelen], element {idx, val}, from big to small
|
122 |
+
for (var i=0;i<prelen;i++){
|
123 |
+
links_in = []
|
124 |
+
for(var j=0;j<prelen;j++) links_in.push({idx: j, val: links[j][i] * node_pass_prob[j]})
|
125 |
+
sorted_links_in.push(links_in.sort((v1, v2) => v2.val - v1.val));
|
126 |
+
}
|
127 |
+
edges = new vis.DataSet();
|
128 |
+
}
|
129 |
+
|
130 |
+
var next_visible_edges = [...Array(prelen)].map((_, __) => {return [...Array(prelen)].map((_, __) => false);}); // size: [prelen, prelen]
|
131 |
+
var links_in_num = [...Array(prelen)].map((_, __) => 0);
|
132 |
+
|
133 |
+
for (var i=0;i<prelen - 1;i++){
|
134 |
+
if(!visible_nodes[i]) continue;
|
135 |
+
|
136 |
+
// select visible out edge of node i
|
137 |
+
var left_visible_edge_num = current_options.max_out_edge_num;
|
138 |
+
var left_visible_edge_prob = current_options.max_out_edge_prob;
|
139 |
+
for(var j=0; j<prelen;j++){
|
140 |
+
var idx = sorted_links_out[i][j]['idx'];
|
141 |
+
if (sorted_links_out[i][j]['val'] < current_options.minimum_edge_prob) break;
|
142 |
+
if (visible_nodes[idx]){
|
143 |
+
links_in_num[idx]++;
|
144 |
+
next_visible_edges[i][idx] = true;
|
145 |
+
left_visible_edge_num--;
|
146 |
+
left_visible_edge_prob -= sorted_links_out[i][j]['val'];
|
147 |
+
if (left_visible_edge_num==0 || left_visible_edge_prob < 0){
|
148 |
+
break;
|
149 |
+
}
|
150 |
+
}
|
151 |
+
}
|
152 |
+
}
|
153 |
+
|
154 |
+
if(current_options.force_in_edge){
|
155 |
+
// add at least one in edge per node
|
156 |
+
for (var i=0;i<prelen;i++){
|
157 |
+
if(i == 0 || !visible_nodes[i] || links_in_num[i] > 0) continue;
|
158 |
+
for(var j=0; j<prelen;j++){
|
159 |
+
var idx = sorted_links_in[i][j]['idx'];
|
160 |
+
if (visible_nodes[idx]){
|
161 |
+
next_visible_edges[idx][i] = true;
|
162 |
+
break;
|
163 |
+
}
|
164 |
+
}
|
165 |
+
}
|
166 |
+
}
|
167 |
+
|
168 |
+
for(var i=0;i<prelen;i++){
|
169 |
+
for(var j=i+1;j<prelen;j++){
|
170 |
+
set_edge_visibility(i, j, next_visible_edges[i][j]);
|
171 |
+
}
|
172 |
+
}
|
173 |
+
}
|
174 |
+
|
175 |
+
function update_edge_label(){
|
176 |
+
for(var i=0;i<prelen;i++){
|
177 |
+
for(var j=i+1;j<prelen;j++) if (visible_edges[i][j]){
|
178 |
+
currentEdge = obtain_edge_object(i, j);
|
179 |
+
edges.updateOnly(currentEdge);
|
180 |
+
}
|
181 |
+
}
|
182 |
+
}
|
183 |
+
|
184 |
+
function customScalingFunction(min,max,total,value) {
|
185 |
+
min = 0;
|
186 |
+
var scale = 1 / (max - min);
|
187 |
+
return Math.max(0,(value - min)*scale);
|
188 |
+
}
|
189 |
+
|
190 |
+
function escapeHtml(unsafe)
|
191 |
+
{
|
192 |
+
return unsafe
|
193 |
+
.replace(/&/g, "&")
|
194 |
+
.replace(/</g, "<")
|
195 |
+
.replace(/>/g, ">")
|
196 |
+
.replace(/"/g, """)
|
197 |
+
.replace(/'/g, "'");
|
198 |
+
}
|
199 |
+
function get_jumpable_node(idx){
|
200 |
+
if(visible_nodes[idx]){
|
201 |
+
return "<a href=\"javascript:network.selectNodes(["+ idx.toString() +"]);show_hint_node(" + idx.toString() + ");\">" + idx.toString() + "</a>";
|
202 |
+
}else{
|
203 |
+
return "<a class=\"invisible\" href=\"javascript:show_hint_node(["+ idx.toString() +"]);network.unselectAll();\">" + idx.toString() + "</a>";
|
204 |
+
}
|
205 |
+
}
|
206 |
+
function get_jumpable_edge(i, j, label){
|
207 |
+
var edge_id = i.toString() + "-" + j.toString();
|
208 |
+
if(visible_edges[i][j]){
|
209 |
+
return "<a href=\"javascript:network.selectEdges(['"+ edge_id +"']);show_hint_edge('" + edge_id + "');\">" + label + "</a>";
|
210 |
+
}else{
|
211 |
+
return "<a class=\"invisible\" href=\"javascript:show_hint_edge('" + edge_id + "');network.unselectAll();\">" + label + "</a>";
|
212 |
+
}
|
213 |
+
}
|
214 |
+
|
215 |
+
show_hint_node = function(node_id){
|
216 |
+
showing_node = node_id;
|
217 |
+
showing_edge = undefined;
|
218 |
+
var title = "<p>You selected <b>Node " + node_id.toString() + "</b> ";
|
219 |
+
if (visible_nodes[node_id]){
|
220 |
+
title += "(<a href=\"javascript:network.fit({nodes:[" + node_id.toString() + "],animation:true});\">Find Me!</a>). "
|
221 |
+
}else{
|
222 |
+
title += "(Not shown). "
|
223 |
+
}
|
224 |
+
title += "Passing Probability: <b>" + node_pass_prob[node_id].toFixed(2) + "</b>. You can click the links below to jump to other edges or nodes.</p>";
|
225 |
+
document.getElementById("hintsupper").innerHTML = title;
|
226 |
+
|
227 |
+
title = "<table><thead><tr><th>Rank</th><th>Candidate</th><th>Probability</th></tr></thead><tbody>";
|
228 |
+
for (var j=0;j<5;j++){
|
229 |
+
title += "<tr><td>#" + (j+1).toString() + "</td><td>" + escapeHtml(node_tokens[node_id][j]) + "</td><td>" + node_probs[node_id][j].toFixed(2) + "</td></tr>";
|
230 |
+
}
|
231 |
+
title += "</tbody>"
|
232 |
+
title += "<p>Top-5 Token Candidates: </p>";
|
233 |
+
document.getElementById("hintsleft").innerHTML = title;
|
234 |
+
|
235 |
+
title = "<table><thead><tr><th>Rank</th><th>To</th><th>Transition Prob.</th><th>Passing Prob.</th></tr></thead><tbody>";
|
236 |
+
for (var j=0;j<prelen;j++){
|
237 |
+
var idx = sorted_links_out[node_id][j].idx;
|
238 |
+
if(j < 5 || visible_edges[node_id][idx]){
|
239 |
+
title += "<tr><td>" + get_jumpable_edge(node_id, idx, "#" + (j+1).toString()) + "</td><td>" + get_jumpable_node(idx) + "</td><td>" + links[node_id][idx].toFixed(2) + "</td><td>" +
|
240 |
+
(node_pass_prob[node_id] * links[node_id][idx]).toFixed(2) + "</td></tr>";
|
241 |
+
}
|
242 |
+
}
|
243 |
+
title += "</tbody>"
|
244 |
+
title += "<p>Top Outgoing Edges: </p>"
|
245 |
+
document.getElementById("hintscenter").innerHTML = title;
|
246 |
+
|
247 |
+
title = "<table><thead><tr><th>Rank</th><th>From</th><th>Transition Prob.</th><th>Passing Prob.</th></tr></thead><tbody>";
|
248 |
+
for (var j=0;j<prelen;j++){
|
249 |
+
var idx = sorted_links_in[node_id][j].idx;
|
250 |
+
if(j < 5 || visible_edges[idx][node_id]){
|
251 |
+
title += "<tr><td>" + get_jumpable_edge(idx, node_id, "#" + (j+1).toString()) + "</td><td>" + get_jumpable_node(idx) + "</td><td>" + links[idx][node_id].toFixed(2) + "</td><td>" +
|
252 |
+
(node_pass_prob[idx] * links[idx][node_id]).toFixed(2) + "</td></tr>";
|
253 |
+
}
|
254 |
+
}
|
255 |
+
title += "</tbody>"
|
256 |
+
title += "<p>Top Incoming Edges: </p>"
|
257 |
+
document.getElementById("hintsright").innerHTML = title;
|
258 |
+
|
259 |
+
document.getElementById("hintsbottom").innerHTML =
|
260 |
+
"<br>"+
|
261 |
+
"Passing probability of a node V represents how likely the node will be choosen in a random path, i.e., P(V \\in A). <br>" +
|
262 |
+
"Passing probability of an edge from U to V represents how likely the node V follows the node U in a random path, i.e., P(a_i = U && a_{i+1} = V). <br>" +
|
263 |
+
"Token probability represents how likely a token is predicted on the given node, i.e., P(y_i| v_{a_{i}}). <br>" +
|
264 |
+
"Transition probability represents how likely a specific node is following the given node, i.e. P(a_{i+1} | a_{i}).<br>"
|
265 |
+
}
|
266 |
+
|
267 |
+
show_hint_edge = function(edge_id){
|
268 |
+
showing_edge = edge_id;
|
269 |
+
showing_node = undefined;
|
270 |
+
var i = parseInt(edge_id.split("-")[0]);
|
271 |
+
var j = parseInt(edge_id.split("-")[1]);
|
272 |
+
var label = links[i][j].toFixed(2);
|
273 |
+
var passing_label = (links[i][j] * node_pass_prob[i]).toFixed(2);
|
274 |
+
var title = "You selected an edge from <b>Node " + get_jumpable_node(i) + " to Node " + get_jumpable_node(j) + "</b>."
|
275 |
+
if (visible_edges[i][j]){
|
276 |
+
title += "(<a href=\"javascript:network.fit({nodes:[" + i.toString() + "," + j.toString() + "],animation:true});\">Find Me!</a>). "
|
277 |
+
}else{
|
278 |
+
title += "(Not shown). "
|
279 |
+
}
|
280 |
+
title += "<br> You can click the links above to jump to the nodes. <br><br>"
|
281 |
+
title += "Transition Probability:<b>" + label + "</b><br>";
|
282 |
+
title += "Passing Probability:<b>" + passing_label + "</b><br>";
|
283 |
+
title += "<br>" +
|
284 |
+
"Transition probability represents how likely a specific node is following the given node, i.e. P(a_{i+1} | a_{i}).<br>" +
|
285 |
+
"Passing probability of an edge from U to V represents how likely the node V follows the node U in a random path, i.e., P(a_i = U && a_{i+1} = V). <br>"
|
286 |
+
document.getElementById("hintsupper").innerHTML = title;
|
287 |
+
document.getElementById("hintsleft").innerHTML = "";
|
288 |
+
document.getElementById("hintsright").innerHTML = "";
|
289 |
+
document.getElementById("hintscenter").innerHTML = "";
|
290 |
+
document.getElementById("hintsbottom").innerHTML = "";
|
291 |
+
}
|
292 |
+
|
293 |
+
function clear_hint(){
|
294 |
+
showing_node = undefined;
|
295 |
+
showing_edge = undefined;
|
296 |
+
document.getElementById("hintsupper").innerHTML = "Use scroll to zoom in or out. Select or Hover over nodes and edges for more information ... (Try dragging nodes to replace them.)";
|
297 |
+
document.getElementById("hintsleft").innerHTML = "";
|
298 |
+
document.getElementById("hintsright").innerHTML = "";
|
299 |
+
document.getElementById("hintscenter").innerHTML = "";
|
300 |
+
document.getElementById("hintsbottom").innerHTML = "";
|
301 |
+
}
|
302 |
+
|
303 |
+
startNetwork = function(graph_info, options) {
|
304 |
+
current_options = options;
|
305 |
+
|
306 |
+
global_graph_info = graph_info;
|
307 |
+
node_pass_prob = graph_info['node_pass_prob'][0] // size: [prelen]
|
308 |
+
prelen = node_pass_prob.length
|
309 |
+
max_path = graph_info['max_paths'][0] // size: [tarlen]
|
310 |
+
tarlen = max_path.length
|
311 |
+
node_tokens = graph_info['node_tokens'][0] // size: [prelen, 5]
|
312 |
+
node_probs = graph_info['node_probs'][0] // size: [prelen, 5]
|
313 |
+
links = graph_info['links'][0] // size: [prelen, prelen]
|
314 |
+
|
315 |
+
update_visible_nodes(true);
|
316 |
+
update_visible_edges(true);
|
317 |
+
|
318 |
+
// create a network
|
319 |
+
var container = document.getElementById("daggraph");
|
320 |
+
var data = {
|
321 |
+
nodes: nodes,
|
322 |
+
edges: edges,
|
323 |
+
};
|
324 |
+
network_options = {
|
325 |
+
nodes: {
|
326 |
+
shape: "ellipse",
|
327 |
+
scaling: {
|
328 |
+
label: {
|
329 |
+
min: 8,
|
330 |
+
max: 20,
|
331 |
+
},
|
332 |
+
customScalingFunction: customScalingFunction,
|
333 |
+
},
|
334 |
+
},
|
335 |
+
edges: {
|
336 |
+
arrowStrikethrough: false,
|
337 |
+
arrows: "to",
|
338 |
+
smooth: {
|
339 |
+
type: "continuous"
|
340 |
+
},
|
341 |
+
color: "#2B7CE9",
|
342 |
+
font: { align: "bottom" },
|
343 |
+
length: 120,
|
344 |
+
scaling: {
|
345 |
+
min: 0.5,
|
346 |
+
max: 3,
|
347 |
+
label: {
|
348 |
+
min: 8,
|
349 |
+
max: 15,
|
350 |
+
},
|
351 |
+
customScalingFunction: customScalingFunction,
|
352 |
+
}
|
353 |
+
}
|
354 |
+
};
|
355 |
+
network = new vis.Network(container, data, network_options);
|
356 |
+
|
357 |
+
network.off("dragStart");
|
358 |
+
network.on("dragStart", function (params) {
|
359 |
+
var idx = this.getNodeAt(params.pointer.DOM);
|
360 |
+
if (idx !== undefined) {
|
361 |
+
// console.log("dragstart " + idx.toString());
|
362 |
+
if (map_max_path[idx] !== undefined){
|
363 |
+
data.nodes.update({id: idx, fixed: false});
|
364 |
+
}
|
365 |
+
}
|
366 |
+
});
|
367 |
+
network.off("dragEnd");
|
368 |
+
network.on("dragEnd", function (params) {
|
369 |
+
var idx = this.getNodeAt(params.pointer.DOM);
|
370 |
+
if (idx !== undefined){
|
371 |
+
// console.log("dragend " + idx.toString());
|
372 |
+
if (map_max_path[idx] !== undefined){
|
373 |
+
data.nodes.update({id: idx, fixed: true});
|
374 |
+
map_max_path[idx].x = params.pointer.canvas.x;
|
375 |
+
map_max_path[idx].y = params.pointer.canvas.y;
|
376 |
+
}
|
377 |
+
}
|
378 |
+
});
|
379 |
+
|
380 |
+
disable_edge_select = false;
|
381 |
+
network.off("selectNode");
|
382 |
+
network.on("selectNode", function (params) {
|
383 |
+
var node_id = params.nodes[0];
|
384 |
+
show_hint_node(node_id);
|
385 |
+
disable_edge_select = true;
|
386 |
+
setTimeout(() => {disable_edge_select=false;}, 200);
|
387 |
+
});
|
388 |
+
|
389 |
+
network.off("selectEdge");
|
390 |
+
network.on("selectEdge", function (params) {
|
391 |
+
if(disable_edge_select) return;
|
392 |
+
var edge_id = params.edges[0];
|
393 |
+
show_hint_edge(edge_id);
|
394 |
+
});
|
395 |
+
|
396 |
+
network.off("deselectNode");
|
397 |
+
network.on("deselectNode", function (params) {
|
398 |
+
clear_hint();
|
399 |
+
showing_node = undefined;
|
400 |
+
showing_edge = undefined;
|
401 |
+
});
|
402 |
+
network.off("deselectEdge");
|
403 |
+
network.on("deselectEdge", function (params) {
|
404 |
+
clear_hint();
|
405 |
+
});
|
406 |
+
}
|
407 |
+
|
408 |
+
updateNetwork = function(options) {
|
409 |
+
if(typeof node_pass_prob === "undefined") return;
|
410 |
+
old_options = current_options;
|
411 |
+
current_options = options;
|
412 |
+
if(options.minimum_node_pass_prob != old_options.minimum_node_pass_prob){
|
413 |
+
update_visible_nodes();
|
414 |
+
}
|
415 |
+
if(options.minimum_node_pass_prob != old_options.minimum_node_pass_prob ||
|
416 |
+
options.minimum_edge_prob != old_options.minimum_edge_prob ||
|
417 |
+
options.max_out_edge_num != old_options.max_out_edge_num ||
|
418 |
+
options.max_out_edge_prob != old_options.max_out_edge_prob ||
|
419 |
+
options.force_in_edge != old_options.force_in_edge){
|
420 |
+
update_visible_edges();
|
421 |
+
}
|
422 |
+
if(options.show_node_detail != old_options.show_node_detail){
|
423 |
+
if(options.show_node_detail) {
|
424 |
+
network_options.nodes.shape = "dot";
|
425 |
+
network_options.nodes.scaling.label.min=10;
|
426 |
+
network_options.nodes.scaling.label.max=10;
|
427 |
+
}else{
|
428 |
+
network_options.nodes.shape = "ellipse";
|
429 |
+
network_options.nodes.scaling.label.min=8;
|
430 |
+
network_options.nodes.scaling.label.max=20;
|
431 |
+
}
|
432 |
+
network.setOptions(network_options);
|
433 |
+
update_node_details();
|
434 |
+
}
|
435 |
+
if(options.show_edge_label != old_options.show_edge_label){
|
436 |
+
update_edge_label();
|
437 |
+
}
|
438 |
+
|
439 |
+
if(showing_node != undefined){
|
440 |
+
show_hint_node(showing_node);
|
441 |
+
}
|
442 |
+
if(showing_edge != undefined){
|
443 |
+
show_hint_edge(showing_edge);
|
444 |
+
}
|
445 |
+
}
|
446 |
+
}
|
graph.html
ADDED
@@ -0,0 +1,49 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
<style type="text/css">
|
2 |
+
#contents {
|
3 |
+
height: 400px;
|
4 |
+
margin: 0;
|
5 |
+
padding: 0;
|
6 |
+
box-sizing: border-box;
|
7 |
+
position: relative;
|
8 |
+
}
|
9 |
+
#hints {
|
10 |
+
height: 400px;
|
11 |
+
margin: 0;
|
12 |
+
padding: 0;
|
13 |
+
box-sizing: border-box;
|
14 |
+
position: relative;
|
15 |
+
}
|
16 |
+
|
17 |
+
#daggraph {
|
18 |
+
width: 100%;
|
19 |
+
height: 100%;
|
20 |
+
border: 1px solid #d3d3d3;
|
21 |
+
box-sizing: border-box;
|
22 |
+
}
|
23 |
+
|
24 |
+
#hints .invisible:link, #hints .invisible:visited {
|
25 |
+
color: gray;
|
26 |
+
}
|
27 |
+
|
28 |
+
.container {right: 0; text-align: center;}
|
29 |
+
.container .left, .container .center, .container .right { display: inline-block; padding: 5px 10px; text-align: left;}
|
30 |
+
.container .left { float: left; }
|
31 |
+
.container .center { margin: 0 auto; }
|
32 |
+
.container .right { float: right; }
|
33 |
+
.clear { clear: both; }
|
34 |
+
#hintsleft td, #hintsleft th, #hintscenter td, #hintscenter th, #hintsright td, #hintsright th {padding: 3px 8px; }
|
35 |
+
</style>
|
36 |
+
|
37 |
+
<div id="contents">
|
38 |
+
<div id="daggraph"></div>
|
39 |
+
</div>
|
40 |
+
<div id="hints">
|
41 |
+
<div id="hintsupper">Use scroll to zoom in or out. Select or Hover over nodes and edges for more information ... (Try dragging nodes to replace them.)</div>
|
42 |
+
<div class="container">
|
43 |
+
<div class="left" id="hintsleft"></div>
|
44 |
+
<div class="center" id="hintscenter"></div>
|
45 |
+
<div class="right" id="hintsright"></div>
|
46 |
+
<div class="clear"></div>
|
47 |
+
</div>
|
48 |
+
<div id="hintsbottom"></div>
|
49 |
+
</div>
|
packages.txt
ADDED
@@ -0,0 +1,10 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
build-essential
|
2 |
+
cmake
|
3 |
+
libboost-system-dev
|
4 |
+
libboost-thread-dev
|
5 |
+
libboost-program-options-dev
|
6 |
+
libboost-test-dev
|
7 |
+
libeigen3-dev
|
8 |
+
zlib1g-dev
|
9 |
+
libbz2-dev
|
10 |
+
liblzma-dev
|
requirements.txt
ADDED
@@ -0,0 +1,2 @@
|
|
|
|
|
|
|
1 |
+
git+https://github.com/thu-coai/DA-Transformer.git[demo]
|
2 |
+
git+https://github.com/thu-coai/DAG-Search.git
|
vis-network.min.js
ADDED
The diff for this file is too large to render.
See raw diff
|
|