Spaces:
Running
Running
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
|
|
|