├── LICENSE ├── .gitignore ├── README.md ├── graph_show.py ├── textrank.py ├── graph_show.html ├── news_graph.py ├── VIS └── dist │ ├── vis.min.css │ └── vis.css └── main.py /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2020 BrambleXu 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | *.npy 2 | runs/ 3 | 4 | # Created by https://www.gitignore.io/api/python,ipythonnotebook 5 | 6 | ### Python ### 7 | # Byte-compiled / optimized / DLL files 8 | __pycache__/ 9 | *.py[cod] 10 | *$py.class 11 | 12 | # C extensions 13 | *.so 14 | 15 | # Distribution / packaging 16 | .Python 17 | env/ 18 | build/ 19 | develop-eggs/ 20 | downloads/ 21 | eggs/ 22 | .eggs/ 23 | lib/ 24 | lib64/ 25 | parts/ 26 | sdist/ 27 | var/ 28 | *.egg-info/ 29 | .installed.cfg 30 | *.egg 31 | 32 | # PyInstaller 33 | # Usually these files are written by a python script from a template 34 | # before PyInstaller builds the exe, so as to inject date/other infos into it. 35 | *.manifest 36 | *.spec 37 | 38 | # Installer logs 39 | pip-log.txt 40 | pip-delete-this-directory.txt 41 | 42 | # Unit test / coverage reports 43 | htmlcov/ 44 | .tox/ 45 | .coverage 46 | .coverage.* 47 | .cache 48 | nosetests.xml 49 | coverage.xml 50 | *,cover 51 | 52 | # Translations 53 | *.mo 54 | *.pot 55 | 56 | # Django stuff: 57 | *.log 58 | 59 | # Sphinx documentation 60 | docs/_build/ 61 | 62 | # PyBuilder 63 | target/ 64 | 65 | 66 | ### IPythonNotebook ### 67 | # Temporary data 68 | .ipynb_checkpoints/ 69 | 70 | .idea/ 71 | .DS_Store 72 | .vscode/ 73 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # News Graph 2 | 3 | Key information extration from text and graph visilization. Inspired by [TextGrapher](https://github.com/liuhuanyong/TextGrapher). 4 | 5 | # Project Introduction 6 | 7 | How to represent a text in a simple way is a chanllenge topic. This peoject try to extraction key information from the text by NLP methods, which contain NER extraction, relation detection, keywords extraction, frequencies words extraction. And finally show the key information in a graph way. 8 | 9 | # How to use 10 | 11 | ```python 12 | from news_graph import NewsMining 13 | content = 'Input you text here' 14 | Miner = NewsMining() 15 | Miner.main(content) 16 | ``` 17 | 18 | This will generate the `graph.html`. 19 | 20 | # Example Demo 21 | 22 | 1) [Blockbuster *The Wandering Earth*](https://www.theverge.com/2019/2/9/18218479/the-wandering-earth-review-film-china-first-science-fiction-blockbuster-cixin-liu-gravity-the-core) 23 | ![image1](https://ws4.sinaimg.cn/large/006tNc79gy1g02ikc4mqjj30n60ot42a.jpg) 24 | 25 | 2) [Tokyo Marathon 2019 Elite Field](https://www.marathon.tokyo/en/news/detail/news_001178.html) 26 | ![image](https://user-images.githubusercontent.com/10768193/83982855-d4c93000-a964-11ea-86d8-1dd19f7d5334.png) 27 | ) 28 | 29 | 3) [EVEN ANONYMOUS CODERS LEAVE FINGERPRINTS](https://www.wired.com/story/machine-learning-identify-anonymous-code/?utm_campaign=Deep%20Learning%20Weekly&utm_medium=email&utm_source=Revue%20newsletter) 30 | ![image3](https://ws3.sinaimg.cn/large/006tNc79gy1g02hulrjx8j30i00pvjuv.jpg) 31 | -------------------------------------------------------------------------------- /graph_show.py: -------------------------------------------------------------------------------- 1 | class GraphShow(): 2 | """"Create demo page""" 3 | def __init__(self): 4 | self.base = ''' 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 | 53 | 54 | 55 | ''' 56 | 57 | 58 | def create_page(self, events): 59 | """Read data""" 60 | nodes = [] 61 | for event in events: 62 | nodes.append(event[0]) 63 | nodes.append(event[1]) 64 | node_dict = {node: index for index, node in enumerate(nodes)} 65 | 66 | data_nodes = [] 67 | data_edges = [] 68 | for node, id in node_dict.items(): 69 | data = {} 70 | data["group"] = 'Event' 71 | data["id"] = id 72 | data["label"] = node 73 | data_nodes.append(data) 74 | 75 | for edge in events: 76 | data = {} 77 | data['from'] = node_dict.get(edge[0]) 78 | data['label'] = '' 79 | data['to'] = node_dict.get(edge[1]) 80 | data_edges.append(data) 81 | 82 | self.create_html(data_nodes, data_edges) 83 | return 84 | 85 | def create_html(self, data_nodes, data_edges): 86 | """Generate html file""" 87 | f = open('graph_show.html', 'w+') 88 | html = self.base.replace('data_nodes', str(data_nodes)).replace('data_edges', str(data_edges)) 89 | f.write(html) 90 | f.close() 91 | -------------------------------------------------------------------------------- /textrank.py: -------------------------------------------------------------------------------- 1 | import sys 2 | from collections import defaultdict 3 | 4 | 5 | class TextrankGraph: 6 | '''textrank graph''' 7 | def __init__(self): 8 | self.graph = defaultdict(list) 9 | self.d = 0.85 # damping coefficient, usually is .85 10 | self.min_diff = 1e-5 # convergence threshold 11 | self.steps = 1000 # iteration steps 12 | 13 | def addEdge(self, start, end, weight): 14 | """Add edge between node""" 15 | self.graph[start].append((start, end, weight)) 16 | self.graph[end].append((end, start, weight)) 17 | 18 | def rank(self): 19 | """Rank all nodes""" 20 | weight_deafault = 1.0 / (len(self.graph) or 1.0) # initialize weight 21 | nodeweight_dict = defaultdict(float) # store weight of node 22 | outsum_node_dict = defaultdict(float) # store wegiht of out nodes 23 | for node, out_edge in self.graph.items(): # initilize nodes weight by edges 24 | # node: was 25 | # out_edge: [('was', 'prison', 1), ('was', 'wrong', 1), ('was', 'bad', 1)] 26 | nodeweight_dict[node] = weight_deafault 27 | outsum_node_dict[node] = sum((edge[2] for edge in out_edge), 0.0) # if no out edge, set weight 0 28 | 29 | sorted_keys = sorted(self.graph.keys()) # save node name as a list for iteration 30 | step_dict = [0] 31 | for step in range(1, self.steps): 32 | for node in sorted_keys: 33 | s = 0 34 | # Node's weight calculation: 35 | # (edge_weight/ node's number of out link)*node_weight[edge_node] 36 | for e in self.graph[node]: 37 | s += e[2] / outsum_node_dict[e[1]] * nodeweight_dict[e[1]] 38 | # Update calculation: (1-d) + d*s 39 | nodeweight_dict[node] = (1 - self.d) + self.d * s 40 | step_dict.append(sum(nodeweight_dict.values())) 41 | 42 | if abs(step_dict[step] - step_dict[step - 1]) <= self.min_diff: 43 | break 44 | 45 | # min-max scale to make result in range to [0 - 1] 46 | min_rank, max_rank = 0, 0 # initilize max and min wegiht value 47 | for w in nodeweight_dict.values(): 48 | if w < min_rank: 49 | min_rank = w 50 | if w > max_rank: 51 | max_rank = w 52 | 53 | for n, w in nodeweight_dict.items(): 54 | nodeweight_dict[n] = (w - min_rank/10.0) / (max_rank - min_rank/10.0) 55 | 56 | return nodeweight_dict 57 | 58 | 59 | class TextRank: 60 | """Extract keywords based on textrank graph algorithm""" 61 | def __init__(self): 62 | self.candi_pos = ['NOUN', 'PROPN', 'VERB'] # 名词，专有名词，动词 63 | self.stop_pos = ['NUM', 'ADV'] # 数字（没有时间名词，就用数字代表了），副词 64 | self.span = 5 65 | 66 | def extract_keywords(self, word_list, num_keywords): 67 | g = TextrankGraph() 68 | cm = defaultdict(int) 69 | for i, word in enumerate(word_list): # word_list = [['previous', 'ADJ'], ['rumor', 'NOUN']] 70 | if word[1] in self.candi_pos and len(word[0]) > 1: # word = ['previous', 'ADJ'] 71 | for j in range(i + 1, i + self.span): 72 | if j >= len(word_list): 73 | break 74 | if word_list[j][1] not in self.candi_pos or word_list[j][1] in self.stop_pos or len(word_list[j][0]) < 2: 75 | continue 76 | pair = tuple((word[0], word_list[j][0])) 77 | cm[(pair)] += 1 78 | 79 | # cm = {('was', 'prison'): 1, ('become', 'prison'): 1} 80 | for terms, w in cm.items(): 81 | g.addEdge(terms[0], terms[1], w) 82 | nodes_rank = g.rank() 83 | nodes_rank = sorted(nodes_rank.items(), key=lambda asd:asd[1], reverse=True) 84 | 85 | return nodes_rank[:num_keywords] 86 | 87 | -------------------------------------------------------------------------------- /graph_show.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 |
11 | 12 | 50 | 51 | 52 | -------------------------------------------------------------------------------- /news_graph.py: -------------------------------------------------------------------------------- 1 | import re 2 | from collections import Counter 3 | import spacy 4 | from graph_show import GraphShow 5 | from textrank import TextRank 6 | 7 | 8 | nlp = spacy.load('en_core_web_lg') 9 | 10 | class NewsMining(): 11 | """News Mining""" 12 | def __init__(self): 13 | self.textranker = TextRank() 14 | self.ners = ['PERSON', 'ORG', 'GPE'] 15 | self.ner_dict = { 16 | 'PERSON': 'Person', # People, including fictional 17 | 'ORG': 'Organization', # Companies, agencies, institutions, etc. 18 | 'GPE': 'Location', # Countries, cities, states. 19 | } 20 | # dependency markers for subjects 21 | self.SUBJECTS = {"nsubj", "nsubjpass", 22 | "csubj", "csubjpass", "agent", "expl"} 23 | # dependency markers for objects 24 | self.OBJECTS = {"dobj", "dative", "attr", "oprd"} 25 | 26 | self.graph_shower = GraphShow() 27 | 28 | def clean_spaces(self, s): 29 | s = s.replace('\r', '') 30 | s = s.replace('\t', ' ') 31 | s = s.replace('\n', ' ') 32 | return s 33 | 34 | def remove_noisy(self, content): 35 | """Remove brackets""" 36 | p1 = re.compile(r'（[^）]*）') 37 | p2 = re.compile(r'\([^\)]*\)') 38 | return p2.sub('', p1.sub('', content)) 39 | 40 | def collect_ners(self, ents): 41 | """Collect token only with PERSON, ORG, GPE""" 42 | collected_ners = [] 43 | for token in ents: 44 | if token.label_ in self.ners: 45 | collected_ners.append(token.text + '/' + token.label_) 46 | return collected_ners 47 | 48 | def conll_syntax(self, sent): 49 | """Convert one sentence to conll format.""" 50 | 51 | tuples = list() 52 | for word in sent: 53 | if word.head is word: 54 | head_idx = 0 55 | else: 56 | head_idx = word.head.i + 1 57 | tuples.append([word.i + 1, # Current word index, begin with 1 58 | word.text, # Word 59 | word.lemma_, # Lemma 60 | word.pos_, # Coarse-grained tag 61 | word.tag_, # Fine-grained tag 62 | '_', 63 | head_idx, # Head of current Index 64 | word.dep_, # Relation 65 | '_', '_']) 66 | return tuples 67 | 68 | def syntax_parse(self, sent): 69 | """Convert one sentence to conll format.""" 70 | tuples = list() 71 | for word in sent: 72 | if word.head is word: 73 | head_idx = 0 74 | else: 75 | head_idx = word.head.i + 1 76 | tuples.append([word.i + 1, # Current word index, begin with 1 77 | word.text, # Word 78 | word.pos_, # Coarse-grained tag 79 | word.head, 80 | head_idx, # Head of current Index 81 | word.dep_, # Relation 82 | ]) 83 | return tuples 84 | 85 | def build_parse_chile_dict(self, sent, tuples): 86 | child_dict_list = list() 87 | for word in sent: 88 | child_dict = dict() 89 | for arc in tuples: 90 | if arc[3] == word: 91 | if arc[-1] in child_dict: 92 | child_dict[arc[-1]].append(arc) 93 | else: 94 | child_dict[arc[-1]] = [] 95 | child_dict[arc[-1]].append(arc) 96 | child_dict_list.append([word, word.pos_, word.i, child_dict]) 97 | return child_dict_list 98 | 99 | def complete_VOB(self, verb, child_dict_list): 100 | '''Find VOB by SBV''' 101 | for child in child_dict_list: 102 | word = child[0] 103 | # child_dict: {'dobj': [[7, 'startup', 'NOUN', buying, 5, 'dobj']], 'prep': [[8, 'for', 'ADP', buying, 5, 'prep']]} 104 | child_dict = child[3] 105 | if word == verb: 106 | for object_type in self.OBJECTS: # object_type: 'dobj' 107 | if object_type not in child_dict: 108 | continue 109 | # [7, 'startup', 'NOUN', buying, 5, 'dobj'] 110 | vob = child_dict[object_type][0] 111 | obj = vob[1] # 'startup' 112 | return obj 113 | return '' 114 | 115 | def extract_triples(self, sent): 116 | svo = [] 117 | tuples = self.syntax_parse(sent) 118 | child_dict_list = self.build_parse_chile_dict(sent, tuples) 119 | for tuple in tuples: 120 | rel = tuple[-1] 121 | if rel in self.SUBJECTS: 122 | sub_wd = tuple[1] 123 | verb_wd = tuple[3] 124 | obj = self.complete_VOB(verb_wd, child_dict_list) 125 | subj = sub_wd 126 | verb = verb_wd.text 127 | if not obj: 128 | svo.append([subj, verb]) 129 | else: 130 | svo.append([subj, verb+' '+obj]) 131 | return svo 132 | 133 | def extract_keywords(self, words_postags): 134 | return self.textranker.extract_keywords(words_postags, 10) 135 | 136 | def collect_coexist(self, ner_sents, ners): 137 | """Construct NER co-occurrence matrices""" 138 | co_list = [] 139 | for words in ner_sents: 140 | co_ners = set(ners).intersection(set(words)) 141 | co_info = self.combination(list(co_ners)) 142 | co_list += co_info 143 | if not co_list: 144 | return [] 145 | return {i[0]: i[1] for i in Counter(co_list).most_common()} 146 | 147 | def combination(self, a): 148 | '''list all combination''' 149 | combines = [] 150 | if len(a) == 0: 151 | return [] 152 | for i in a: 153 | for j in a: 154 | if i == j: 155 | continue 156 | combines.append('@'.join([i, j])) 157 | return combines 158 | 159 | def main(self, content): 160 | '''Main function''' 161 | if not content: 162 | return [] 163 | 164 | words_postags = [] # token and its POS tag 165 | ner_sents = [] # store sentences which contain NER entity 166 | ners = [] # store all NER entity from whole article 167 | triples = [] # store subject verb object 168 | events = [] # store events 169 | 170 | # 01 remove linebreaks and brackets 171 | content = self.remove_noisy(content) 172 | content = self.clean_spaces(content) 173 | 174 | # 02 split to sentences 175 | doc = nlp(content) 176 | 177 | for i, sent in enumerate(doc.sents): 178 | words_postags = [[token.text, token.pos_] for token in sent] 179 | words = [token.text for token in sent] 180 | postags = [token.pos_ for token in sent] 181 | ents = nlp(sent.text).ents # NER detection 182 | collected_ners = self.collect_ners(ents) 183 | 184 | if collected_ners: # only extract triples when the sentence contains 'PERSON', 'ORG', 'GPE' 185 | triple = self.extract_triples(sent) 186 | if not triple: 187 | continue 188 | triples += triple 189 | ners += collected_ners 190 | ner_sents.append( 191 | [token.text + '/' + token.label_ for token in sent.ents]) 192 | 193 | # 03 get keywords 194 | keywords = [i[0] for i in self.extract_keywords(words_postags)] 195 | for keyword in keywords: 196 | name = keyword 197 | cate = 'keyword' 198 | events.append([name, cate]) 199 | 200 | # 04 add triples to event only the word in keyword 201 | for t in triples: 202 | if (t[0] in keywords or t[1] in keywords) and len(t[0]) > 1 and len(t[1]) > 1: 203 | events.append([t[0], t[1]]) 204 | 205 | # 05 get word frequency and add to events 206 | word_dict = [i for i in Counter([i[0] for i in words_postags if i[1] in [ 207 | 'NOUN', 'PROPN', 'VERB'] and len(i[0]) > 1]).most_common()][:10] 208 | for wd in word_dict: 209 | name = wd[0] 210 | cate = 'frequency' 211 | events.append([name, cate]) 212 | 213 | # 06 get NER from whole article 214 | ner_dict = {i[0]: i[1] for i in Counter(ners).most_common(20)} 215 | for ner in ner_dict: 216 | name = ner.split('/')[0] # Jessica Miller 217 | cate = self.ner_dict[ner.split('/')[1]] # PERSON 218 | events.append([name, cate]) 219 | 220 | # 07 get all NER entity co-occurrence information 221 | # here ner_dict is from above 06 222 | co_dict = self.collect_coexist(ner_sents, list(ner_dict.keys())) 223 | co_events = [[i.split('@')[0].split( 224 | '/')[0], i.split('@')[1].split('/')[0]] for i in co_dict] 225 | events += co_events 226 | 227 | # 08 show event graph 228 | self.graph_shower.create_page(events) 229 | -------------------------------------------------------------------------------- /VIS/dist/vis.min.css: -------------------------------------------------------------------------------- 1 | .vis-background,.vis-labelset,.vis-timeline{overflow:hidden}.vis .overlay{position:absolute;top:0;left:0;width:100%;height:100%;z-index:10}.vis-active{box-shadow:0 0 10px #86d5f8}.vis [class*=span]{min-height:0;width:auto}div.vis-configuration{position:relative;display:block;float:left;font-size:9pt}div.vis-configuration-wrapper{display:block;width:700px}div.vis-configuration.vis-config-option-container{display:block;width:495px;background-color:#fff;border:2px solid #f7f8fa;border-radius:4px;margin-top:20px;left:10px;padding-left:5px}div.vis-configuration.vis-config-button{display:block;width:495px;height:25px;vertical-align:middle;line-height:25px;background-color:#f7f8fa;border:2px solid #ceced0;border-radius:4px;margin-top:20px;left:10px;padding-left:5px;cursor:pointer;margin-bottom:30px}div.vis-configuration.vis-config-button.hover{background-color:#4588e6;border:2px solid #214373;color:#fff}div.vis-configuration.vis-config-item{display:block;float:left;width:495px;height:25px;vertical-align:middle;line-height:25px}div.vis-configuration.vis-config-item.vis-config-s2{left:10px;background-color:#f7f8fa;padding-left:5px;border-radius:3px}div.vis-configuration.vis-config-item.vis-config-s3{left:20px;background-color:#e4e9f0;padding-left:5px;border-radius:3px}div.vis-configuration.vis-config-item.vis-config-s4{left:30px;background-color:#cfd8e6;padding-left:5px;border-radius:3px}div.vis-configuration.vis-config-header{font-size:18px;font-weight:700}div.vis-configuration.vis-config-label{width:90pt;height:25px;line-height:25px}div.vis-configuration.vis-config-label.vis-config-s3{width:110px}div.vis-configuration.vis-config-label.vis-config-s4{width:75pt}div.vis-configuration.vis-config-colorBlock{top:1px;width:30px;height:19px;border:1px solid #444;border-radius:2px;padding:0;margin:0;cursor:pointer}input.vis-configuration.vis-config-checkbox{left:-5px}input.vis-configuration.vis-config-rangeinput{position:relative;top:-5px;width:60px;height:13px;padding:1px;margin:0;pointer-events:none}.vis-panel,.vis-timeline{padding:0;box-sizing:border-box}input.vis-configuration.vis-config-range{-webkit-appearance:none;border:0 solid #fff;background-color:transparent;width:300px;height:20px}input.vis-configuration.vis-config-range::-webkit-slider-runnable-track{width:300px;height:5px;background:#dedede;background:-moz-linear-gradient(top,#dedede 0,#c8c8c8 99%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0,#dedede),color-stop(99%,#c8c8c8));background:-webkit-linear-gradient(top,#dedede 0,#c8c8c8 99%);background:-o-linear-gradient(top,#dedede 0,#c8c8c8 99%);background:-ms-linear-gradient(top,#dedede 0,#c8c8c8 99%);background:linear-gradient(to bottom,#dedede 0,#c8c8c8 99%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#dedede', endColorstr='#c8c8c8', GradientType=0 );border:1px solid #999;box-shadow:#aaa 0 0 3px 0;border-radius:3px}input.vis-configuration.vis-config-range::-webkit-slider-thumb{-webkit-appearance:none;border:1px solid #14334b;height:17px;width:17px;border-radius:50%;background:#3876c2;background:-moz-linear-gradient(top,#3876c2 0,#385380 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0,#3876c2),color-stop(100%,#385380));background:-webkit-linear-gradient(top,#3876c2 0,#385380 100%);background:-o-linear-gradient(top,#3876c2 0,#385380 100%);background:-ms-linear-gradient(top,#3876c2 0,#385380 100%);background:linear-gradient(to bottom,#3876c2 0,#385380 100%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#3876c2', endColorstr='#385380', GradientType=0 );box-shadow:#111927 0 0 1px 0;margin-top:-7px}input.vis-configuration.vis-config-range:focus{outline:0}input.vis-configuration.vis-config-range:focus::-webkit-slider-runnable-track{background:#9d9d9d;background:-moz-linear-gradient(top,#9d9d9d 0,#c8c8c8 99%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0,#9d9d9d),color-stop(99%,#c8c8c8));background:-webkit-linear-gradient(top,#9d9d9d 0,#c8c8c8 99%);background:-o-linear-gradient(top,#9d9d9d 0,#c8c8c8 99%);background:-ms-linear-gradient(top,#9d9d9d 0,#c8c8c8 99%);background:linear-gradient(to bottom,#9d9d9d 0,#c8c8c8 99%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#9d9d9d', endColorstr='#c8c8c8', GradientType=0 )}input.vis-configuration.vis-config-range::-moz-range-track{width:300px;height:10px;background:#dedede;background:-moz-linear-gradient(top,#dedede 0,#c8c8c8 99%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0,#dedede),color-stop(99%,#c8c8c8));background:-webkit-linear-gradient(top,#dedede 0,#c8c8c8 99%);background:-o-linear-gradient(top,#dedede 0,#c8c8c8 99%);background:-ms-linear-gradient(top,#dedede 0,#c8c8c8 99%);background:linear-gradient(to bottom,#dedede 0,#c8c8c8 99%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#dedede', endColorstr='#c8c8c8', GradientType=0 );border:1px solid #999;box-shadow:#aaa 0 0 3px 0;border-radius:3px}input.vis-configuration.vis-config-range::-moz-range-thumb{border:none;height:1pc;width:1pc;border-radius:50%;background:#385380}input.vis-configuration.vis-config-range:-moz-focusring{outline:#fff solid 1px;outline-offset:-1px}input.vis-configuration.vis-config-range::-ms-track{width:300px;height:5px;background:0 0;border-color:transparent;border-width:6px 0;color:transparent}input.vis-configuration.vis-config-range::-ms-fill-lower{background:#777;border-radius:10px}input.vis-configuration.vis-config-range::-ms-fill-upper{background:#ddd;border-radius:10px}input.vis-configuration.vis-config-range::-ms-thumb{border:none;height:1pc;width:1pc;border-radius:50%;background:#385380}input.vis-configuration.vis-config-range:focus::-ms-fill-lower{background:#888}input.vis-configuration.vis-config-range:focus::-ms-fill-upper{background:#ccc}.vis-configuration-popup{position:absolute;background:rgba(57,76,89,.85);border:2px solid #f2faff;line-height:30px;height:30px;width:150px;text-align:center;color:#fff;font-size:14px;border-radius:4px;-webkit-transition:opacity .3s ease-in-out;-moz-transition:opacity .3s ease-in-out;transition:opacity .3s ease-in-out}.vis-configuration-popup:after,.vis-configuration-popup:before{left:100%;top:50%;border:solid transparent;content:" ";height:0;width:0;position:absolute;pointer-events:none}.vis-configuration-popup:after{border-color:rgba(136,183,213,0);border-left-color:rgba(57,76,89,.85);border-width:8px;margin-top:-8px}.vis-configuration-popup:before{border-color:rgba(194,225,245,0);border-left-color:#f2faff;border-width:9pt;margin-top:-9pt}.vis-timeline{position:relative;border:1px solid #bfbfbf;margin:0}.vis-panel{position:absolute;margin:0}.vis-panel.vis-bottom,.vis-panel.vis-center,.vis-panel.vis-left,.vis-panel.vis-right,.vis-panel.vis-top{border:1px #bfbfbf}.vis-panel.vis-center,.vis-panel.vis-left,.vis-panel.vis-right{border-top-style:solid;border-bottom-style:solid;overflow:hidden}.vis-panel.vis-bottom,.vis-panel.vis-center,.vis-panel.vis-top{border-left-style:solid;border-right-style:solid}.vis-panel>.vis-content{position:relative}.vis-panel .vis-shadow{position:absolute;width:100%;height:1px;box-shadow:0 0 10px rgba(0,0,0,.8)}.vis-itemset,.vis-labelset,.vis-labelset .vis-label{position:relative;box-sizing:border-box}.vis-panel .vis-shadow.vis-top{top:-1px;left:0}.vis-panel .vis-shadow.vis-bottom{bottom:-1px;left:0}.vis-labelset .vis-label{left:0;top:0;width:100%;color:#4d4d4d;border-bottom:1px solid #bfbfbf}.vis-labelset .vis-label.draggable{cursor:pointer}.vis-labelset .vis-label:last-child{border-bottom:none}.vis-labelset .vis-label .vis-inner{display:inline-block;padding:5px}.vis-labelset .vis-label .vis-inner.vis-hidden{padding:0}.vis-itemset{padding:0;margin:0}.vis-itemset .vis-background,.vis-itemset .vis-foreground{position:absolute;width:100%;height:100%;overflow:visible}.vis-axis{position:absolute;width:100%;height:0;left:0;z-index:1}.vis-foreground .vis-group{position:relative;box-sizing:border-box;border-bottom:1px solid #bfbfbf}.vis-foreground .vis-group:last-child{border-bottom:none}.vis-overlay{position:absolute;top:0;left:0;width:100%;height:100%;z-index:10}.vis-item{position:absolute;color:#1A1A1A;border-color:#97B0F8;border-width:1px;background-color:#D5DDF6;display:inline-block}.vis-item.vis-point.vis-selected,.vis-item.vis-selected{background-color:#FFF785}.vis-item.vis-selected{border-color:#FFC200;z-index:2}.vis-editable.vis-selected{cursor:move}.vis-item.vis-box{text-align:center;border-style:solid;border-radius:2px}.vis-item.vis-point{background:0 0}.vis-item.vis-dot{position:absolute;padding:0;border-width:4px;border-style:solid;border-radius:4px}.vis-item.vis-range{border-style:solid;border-radius:2px;box-sizing:border-box}.vis-item.vis-background{border:none;background-color:rgba(213,221,246,.4);box-sizing:border-box;padding:0;margin:0}.vis-item .vis-item-overflow{position:relative;width:100%;height:100%;padding:0;margin:0;overflow:hidden}.vis-item.vis-range .vis-item-content{position:relative;display:inline-block}.vis-item.vis-background .vis-item-content{position:absolute;display:inline-block}.vis-item.vis-line{padding:0;position:absolute;width:0;border-left-width:1px;border-left-style:solid}.vis-item .vis-item-content{white-space:nowrap;box-sizing:border-box;padding:5px}.vis-item .vis-delete{background:url(img/timeline/delete.png) center no-repeat;position:absolute;width:24px;height:24px;top:-4px;right:-24px;cursor:pointer}.vis-item.vis-range .vis-drag-left{position:absolute;width:24px;max-width:20%;min-width:2px;height:100%;top:0;left:-4px;cursor:w-resize}.vis-item.vis-range .vis-drag-right{position:absolute;width:24px;max-width:20%;min-width:2px;height:100%;top:0;right:-4px;cursor:e-resize}.vis-time-axis{position:relative;overflow:hidden}.vis-time-axis.vis-foreground{top:0;left:0;width:100%}.vis-time-axis.vis-background{position:absolute;top:0;left:0;width:100%;height:100%}.vis-time-axis .vis-text{position:absolute;color:#4d4d4d;padding:3px;overflow:hidden;box-sizing:border-box;white-space:nowrap}.vis-time-axis .vis-text.vis-measure{position:absolute;padding-left:0;padding-right:0;margin-left:0;margin-right:0;visibility:hidden}.vis-time-axis .vis-grid.vis-vertical{position:absolute;border-left:1px solid}.vis-time-axis .vis-grid.vis-minor{border-color:#e5e5e5}.vis-time-axis .vis-grid.vis-major{border-color:#bfbfbf}.vis-current-time{background-color:#FF7F6E;width:2px;z-index:1}.vis-custom-time{background-color:#6E94FF;width:2px;cursor:move;z-index:1}.vis-panel.vis-background.vis-horizontal .vis-grid.vis-horizontal{position:absolute;width:100%;height:0;border-bottom:1px solid}.vis-panel.vis-background.vis-horizontal .vis-grid.vis-minor{border-color:#e5e5e5}.vis-panel.vis-background.vis-horizontal .vis-grid.vis-major{border-color:#bfbfbf}.vis-data-axis .vis-y-axis.vis-major{width:100%;position:absolute;color:#4d4d4d;white-space:nowrap}.vis-data-axis .vis-y-axis.vis-major.vis-measure{padding:0;margin:0;border:0;visibility:hidden;width:auto}.vis-data-axis .vis-y-axis.vis-minor{position:absolute;width:100%;color:#bebebe;white-space:nowrap}.vis-data-axis .vis-y-axis.vis-minor.vis-measure{padding:0;margin:0;border:0;visibility:hidden;width:auto}.vis-data-axis .vis-y-axis.vis-title{position:absolute;color:#4d4d4d;white-space:nowrap;bottom:20px;text-align:center}.vis-data-axis .vis-y-axis.vis-title.vis-measure{padding:0;margin:0;visibility:hidden;width:auto}.vis-data-axis .vis-y-axis.vis-title.vis-left{bottom:0;-webkit-transform-origin:left top;-moz-transform-origin:left top;-ms-transform-origin:left top;-o-transform-origin:left top;transform-origin:left bottom;-webkit-transform:rotate(-90deg);-moz-transform:rotate(-90deg);-ms-transform:rotate(-90deg);-o-transform:rotate(-90deg);transform:rotate(-90deg)}.vis-data-axis .vis-y-axis.vis-title.vis-right{bottom:0;-webkit-transform-origin:right bottom;-moz-transform-origin:right bottom;-ms-transform-origin:right bottom;-o-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);-o-transform:rotate(90deg);transform:rotate(90deg)}.vis-legend{background-color:rgba(247,252,255,.65);padding:5px;border:1px solid #b3b3b3;box-shadow:2px 2px 10px rgba(154,154,154,.55)}.vis-legend-text{white-space:nowrap;display:inline-block}.vis-graph-group0{fill:#4f81bd;fill-opacity:0;stroke-width:2px;stroke:#4f81bd}.vis-graph-group1{fill:#f79646;fill-opacity:0;stroke-width:2px;stroke:#f79646}.vis-graph-group2{fill:#8c51cf;fill-opacity:0;stroke-width:2px;stroke:#8c51cf}.vis-graph-group3{fill:#75c841;fill-opacity:0;stroke-width:2px;stroke:#75c841}.vis-graph-group4{fill:#ff0100;fill-opacity:0;stroke-width:2px;stroke:#ff0100}.vis-graph-group5{fill:#37d8e6;fill-opacity:0;stroke-width:2px;stroke:#37d8e6}.vis-graph-group6{fill:#042662;fill-opacity:0;stroke-width:2px;stroke:#042662}.vis-graph-group7{fill:#00ff26;fill-opacity:0;stroke-width:2px;stroke:#00ff26}.vis-graph-group8{fill:#f0f;fill-opacity:0;stroke-width:2px;stroke:#f0f}.vis-graph-group9{fill:#8f3938;fill-opacity:0;stroke-width:2px;stroke:#8f3938}.vis-timeline .vis-fill{fill-opacity:.1;stroke:none}.vis-timeline .vis-bar{fill-opacity:.5;stroke-width:1px}.vis-timeline .vis-point{stroke-width:2px;fill-opacity:1}.vis-timeline .vis-legend-background{stroke-width:1px;fill-opacity:.9;fill:#fff;stroke:#c2c2c2}.vis-timeline .vis-outline{stroke-width:1px;fill-opacity:1;fill:#fff;stroke:#e5e5e5}.vis-timeline .vis-icon-fill{fill-opacity:.3;stroke:none}div.vis-network div.vis-manipulation{border-width:0;border-bottom:1px;border-style:solid;border-color:#d6d9d8;background:#fff;background:-moz-linear-gradient(top,#fff 0,#fcfcfc 48%,#fafafa 50%,#fcfcfc 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0,#fff),color-stop(48%,#fcfcfc),color-stop(50%,#fafafa),color-stop(100%,#fcfcfc));background:-webkit-linear-gradient(top,#fff 0,#fcfcfc 48%,#fafafa 50%,#fcfcfc 100%);background:-o-linear-gradient(top,#fff 0,#fcfcfc 48%,#fafafa 50%,#fcfcfc 100%);background:-ms-linear-gradient(top,#fff 0,#fcfcfc 48%,#fafafa 50%,#fcfcfc 100%);background:linear-gradient(to bottom,#fff 0,#fcfcfc 48%,#fafafa 50%,#fcfcfc 100%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#fcfcfc', GradientType=0 );position:absolute;left:0;top:0;width:100%;height:30px}div.vis-network div.vis-edit-mode{position:absolute;left:0;top:15px;height:30px}div.vis-network div.vis-close{position:absolute;right:0;top:0;width:30px;height:30px;background-position:20px 3px;background-repeat:no-repeat;background-image:url(img/network/cross.png);cursor:pointer;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}div.vis-network div.vis-close:hover{opacity:.6}div.vis-network div.vis-edit-mode div.vis-button,div.vis-network div.vis-manipulation div.vis-button{position:relative;top:-7px;font-family:verdana;font-size:9pt;-moz-border-radius:15px;border-radius:15px;display:inline-block;background-position:0 0;background-repeat:no-repeat;height:24px;margin:0 0 0 10px;vertical-align:middle;cursor:pointer;padding:0 8px;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}div.vis-network div.vis-manipulation div.vis-button:hover{box-shadow:1px 1px 8px rgba(0,0,0,.2)}div.vis-network div.vis-manipulation div.vis-button:active{box-shadow:1px 1px 8px rgba(0,0,0,.5)}div.vis-network div.vis-manipulation div.vis-button.vis-back{background-image:url(img/network/backIcon.png)}div.vis-network div.vis-manipulation div.vis-button.vis-none:hover{box-shadow:1px 1px 8px transparent;cursor:default}div.vis-network div.vis-manipulation div.vis-button.vis-none:active{box-shadow:1px 1px 8px transparent}div.vis-network div.vis-manipulation div.vis-button.vis-none{padding:0}div.vis-network div.vis-manipulation div.notification{margin:2px;font-weight:700}div.vis-network div.vis-manipulation div.vis-button.vis-add{background-image:url(img/network/addNodeIcon.png)}div.vis-network div.vis-edit-mode div.vis-button.vis-edit,div.vis-network div.vis-manipulation div.vis-button.vis-edit{background-image:url(img/network/editIcon.png)}div.vis-network div.vis-edit-mode div.vis-button.vis-edit.vis-edit-mode{background-color:#fcfcfc;border:1px solid #ccc}div.vis-network div.vis-manipulation div.vis-button.vis-connect{background-image:url(img/network/connectIcon.png)}div.vis-network div.vis-manipulation div.vis-button.vis-delete{background-image:url(img/network/deleteIcon.png)}div.vis-network div.vis-edit-mode div.vis-label,div.vis-network div.vis-manipulation div.vis-label{margin:0 0 0 23px;line-height:25px}div.vis-network div.vis-manipulation div.vis-separator-line{display:inline-block;width:1px;height:20px;background-color:#bdbdbd;margin:5px 7px 0 15px}div.vis-network-tooltip{position:absolute;visibility:hidden;padding:5px;white-space:nowrap;font-family:verdana;font-size:14px;font-color:#000;background-color:#f5f4ed;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;border:1px solid #808074;box-shadow:3px 3px 10px rgba(0,0,0,.2);pointer-events:none}div.vis-network div.vis-navigation div.vis-button{width:34px;height:34px;-moz-border-radius:17px;border-radius:17px;position:absolute;display:inline-block;background-position:2px 2px;background-repeat:no-repeat;cursor:pointer;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}div.vis-network div.vis-navigation div.vis-button:hover{box-shadow:0 0 3px 3px rgba(56,207,21,.3)}div.vis-network div.vis-navigation div.vis-button:active{box-shadow:0 0 1px 3px rgba(56,207,21,.95)}div.vis-network div.vis-navigation div.vis-button.vis-up{background-image:url(img/network/upArrow.png);bottom:50px;left:55px}div.vis-network div.vis-navigation div.vis-button.vis-down{background-image:url(img/network/downArrow.png);bottom:10px;left:55px}div.vis-network div.vis-navigation div.vis-button.vis-left{background-image:url(img/network/leftArrow.png);bottom:10px;left:15px}div.vis-network div.vis-navigation div.vis-button.vis-right{background-image:url(img/network/rightArrow.png);bottom:10px;left:95px}div.vis-network div.vis-navigation div.vis-button.vis-zoomIn{background-image:url(img/network/plus.png);bottom:10px;right:15px}div.vis-network div.vis-navigation div.vis-button.vis-zoomOut{background-image:url(img/network/minus.png);bottom:10px;right:55px}div.vis-network div.vis-navigation div.vis-button.vis-zoomExtends{background-image:url(img/network/zoomExtends.png);bottom:50px;right:15px}div.vis-color-picker{position:absolute;margin-top:-140px;margin-left:30px;width:293px;height:425px;padding:10px;border-radius:15px;background-color:#fff;display:none;box-shadow:rgba(0,0,0,.5) 0 0 10px 0}div.vis-color-picker div.vis-arrow{position:absolute;top:147px;left:5px}div.vis-color-picker div.vis-arrow:after,div.vis-color-picker div.vis-arrow:before{right:100%;top:50%;border:solid transparent;content:" ";height:0;width:0;position:absolute;pointer-events:none}div.vis-color-picker div.vis-arrow:after{border-color:rgba(255,255,255,0);border-right-color:#fff;border-width:30px;margin-top:-30px}div.vis-color-picker div.vis-color{position:absolute;width:289px;height:289px;cursor:pointer}div.vis-color-picker div.vis-brightness{position:absolute;top:313px}div.vis-color-picker div.vis-opacity{position:absolute;top:350px}div.vis-color-picker div.vis-selector{position:absolute;top:137px;left:137px;width:15px;height:15px;border-radius:15px;border:1px solid #fff;background:#4c4c4c;background:-moz-linear-gradient(top,#4c4c4c 0,#595959 12%,#666 25%,#474747 39%,#2c2c2c 50%,#000 51%,#111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0,#4c4c4c),color-stop(12%,#595959),color-stop(25%,#666),color-stop(39%,#474747),color-stop(50%,#2c2c2c),color-stop(51%,#000),color-stop(60%,#111),color-stop(76%,#2b2b2b),color-stop(91%,#1c1c1c),color-stop(100%,#131313));background:-webkit-linear-gradient(top,#4c4c4c 0,#595959 12%,#666 25%,#474747 39%,#2c2c2c 50%,#000 51%,#111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%);background:-o-linear-gradient(top,#4c4c4c 0,#595959 12%,#666 25%,#474747 39%,#2c2c2c 50%,#000 51%,#111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%);background:-ms-linear-gradient(top,#4c4c4c 0,#595959 12%,#666 25%,#474747 39%,#2c2c2c 50%,#000 51%,#111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%);background:linear-gradient(to bottom,#4c4c4c 0,#595959 12%,#666 25%,#474747 39%,#2c2c2c 50%,#000 51%,#111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#131313', GradientType=0 )}div.vis-color-picker div.vis-initial-color,div.vis-color-picker div.vis-new-color{width:140px;height:20px;top:380px;font-size:10px;color:rgba(0,0,0,.4);line-height:20px;position:absolute;vertical-align:middle}div.vis-color-picker div.vis-new-color{border:1px solid rgba(0,0,0,.1);border-radius:5px;left:159px;text-align:right;padding-right:2px}div.vis-color-picker div.vis-initial-color{border:1px solid rgba(0,0,0,.1);border-radius:5px;left:10px;text-align:left;padding-left:2px}div.vis-color-picker div.vis-label{position:absolute;width:300px;left:10px}div.vis-color-picker div.vis-label.vis-brightness{top:300px}div.vis-color-picker div.vis-label.vis-opacity{top:338px}div.vis-color-picker div.vis-button{position:absolute;width:68px;height:25px;border-radius:10px;vertical-align:middle;text-align:center;line-height:25px;top:410px;border:2px solid #d9d9d9;background-color:#f7f7f7;cursor:pointer}div.vis-color-picker div.vis-button.vis-cancel{left:5px}div.vis-color-picker div.vis-button.vis-load{left:82px}div.vis-color-picker div.vis-button.vis-apply{left:159px}div.vis-color-picker div.vis-button.vis-save{left:236px}div.vis-color-picker input.vis-range{width:290px;height:20px} -------------------------------------------------------------------------------- /main.py: -------------------------------------------------------------------------------- 1 | from news_graph import NewsMining 2 | 3 | content1 = """ 4 | 5 | We’re living through a fascinating era of rapid change for the blockbuster movie model. America producers, eager to get their $200 million movies into the lucrative Chinese market, are increasingly looking for Chinese production partners, shooting in Chinese locations, and adding China-friendly characters and plotlines to American movies, even including extra scenes just for the Chinese cuts of films. But simultaneously, China and other countries are moving toward the blockbuster model themselves, creating homegrown films that don’t need to involve American partners at all. 6 | 7 | And just as American films attempt to find paydays in foreign markets, foreign blockbusters are coming to America. The Wandering Earth, described as China’s first big-budget science fiction thriller, quietly made it onto screens at AMC theaters in North America this weekend, and it shows a new side of Chinese filmmaking — one focused toward futuristic spectacles rather than China’s traditionally grand, massive historical epics. At the same time, The Wandering Earth feels like a throwback to a few familiar eras of American filmmaking. While the film’s cast, setting, and tone are all Chinese, longtime science fiction fans are going to see a lot on the screen that reminds them of other movies, for better or worse. 8 | 9 | The film, based on a short story by Three-Body Problem author Cixin Liu, lays out a crisis of unprecedented proportions: the sun has become unstable, and within a hundred years, it will expand to consume Earth. Within 300, the entire solar system will be gone. Earth’s governments rally and unite to face the problem, and come up with a novel solution: they speckle the planet with 10,000 gigantic jets, and blast it out of its orbit and off on a hundred-generation journey to a new home 4.2 light-years away. The idea is to use Jupiter’s gravitational well to pick up speed for the trip, but a malfunction of the Earth Engine system leaves the planet caught in Jupiter’s gravity, and gradually being pulled toward destruction. A frantic group of workers have to scramble to reactivate the jets and correct the Earth’s course. 10 | 11 | The action takes place in two arenas simultaneously. On the Earth’s frigid surface, self-proclaimed genius Liu Qi (Qu Chuxiao) and his younger adopted sister Han Duoduo (Zhao Jinmai) get roped into the rescue efforts after they run away from home. Han is just curious to see the planet’s surface — most of humanity now lives in crowded underground cities, and the surface is for workers only — but Liu Qi is nursing a deeper grudge against his astronaut father Liu Peiqiang (longtime martial-arts movie star Wu Jing) and grandfather (Ng Man-tat, whom Western audiences might recognize from Stephen Chow’s Shaolin Soccer). When Liu Qi was a child, his father moved to a newly-built international space station, designed to move ahead of Earth as a guide and pathfinder. Now an adult, Liu Qi feels his father abandoned him, and wants to strike out independently. 12 | 13 | Meanwhile, on the space station, Liu Peiqiang is ironically a day away from completing his 17-year tour of duty and returning to Earth and his family when the crisis hits. The station’s artificial intelligence, MOSS, insists on putting the station’s personnel in hibernation to save energy, but Liu Peiqiang realizes the computer has a secret agenda, and he and a Russian cosmonaut set out to defy it. 14 | 15 | The entire space plot may feel suspiciously familiar to American audiences, who have a strong emotional touchstone when it comes to a calm-voiced computer in space telling a desperate astronaut that it can’t obey his orders, even when human lives are on the line, because it has orders of its own. MOSS even looks something like the HAL 9000 from 2001: A Space Odyssey: it’s represented as a red light on a gimbled panel, like a single unblinking, judgmental red eye. But a good deal of Liu Peiqiang’s space adventure also plays out like a sequence from Alfonso Cuarón’s 2013 Oscar-winner Gravity, with dizzying sequences of astronauts trying to navigate clouds of debris and find handholds on a treacherous moving station while tumbling through space. 16 | 17 | Meanwhile, the Earthside half of the mission resembles nothing so much as the 2003 nonsense-thriller The Core, about a team trying to drill their way to the center of the Earth to set the planet’s core spinning again. Liu Qi and Han pick up a few distinctive allies along the way, including biracial Chinese-Australian gadabout Tim (viral video star Mike Sui), but mostly, the characters are drawn as blandly and broadly as in any American action movie, and a fair number of them get killed along the journey without ever having developed enough personality for audiences to feel the loss. 18 | 19 | Pretty much any flaw The Wandering Earth can claim — flashy action scenes without much substance, a marked bent toward sticky sentimentality, an insistently pushy score that demands emotional response from the audience at every given moment — are familiar flaws from past blockbusters. Where the film really stands out, though, is in its eye for grandiose spectacle. Director Frant Gwo gives the film a surprising stateliness, especially in the scenes of the mobile Earth wandering the cosmos, wreathed in tiny blue jets that leave eerie space-contrails behind. His attention to detail is marvelous — in scenes where characters stand on Earth’s surface, contemplating Jupiter’s malicious beauty, the swirling colors of the Great Red Spot are clearly visible in reflections in their suit helmets. 20 | 21 | No matter how familiar the plot beats feel, that level of attention not just to functional special effects, but to outright beauty, makes The Wandering Earth memorable. Not every CGI sequence is aesthetically impeccable — sequences like a vehicle chase through a frozen Shanghai sometimes look brittle and false. But everything having to do with Jupiter, Earth as seen from space, and the space station subplot is visually sumptuous. This is frequently a gorgeously rendered film, with an emphasis on intimidating space vistas that will look tremendous on IMAX screens. 22 | 23 | And while the constant attempts to flee the destructive power of changing weather have their own echoes in past films, from The Day After Tomorrow to 2012, Gwo mostly keeps the action tight and propulsive. The Wandering Earth is frequently breathless, though the action occasionally gets a little muddled in editing. At times, particularly on the surface scenes where everyone is wearing identical pressure suits, it can be easy to lose track of which character is where. It’s often easy to feel that Gwo cares more about the collective rescue project than about any individual character — potentially a value that will work better for Chinese audiences than American viewers, who are looking for a single standout hero to root for. 24 | 25 | But the film’s biggest strengths are in its quieter moments, where Gwo takes the time to contemplate Jupiter’s gravity well slowly deepening its pull on Earth’s atmosphere, or Liu Qi staring up, awestruck, at the gas giant dwarfing his home. In those chilly sequences, the film calls back to an older tradition of slower science fiction, in epic-scale classics like 1951’s When Worlds Collide or 1956’s Forbidden Planet. The interludes are brief, but they’re a welcome respite from chase sequences and destruction. 26 | 27 | The Wandering Earth gets pretty goofy at times, with jokes about Tim’s heritage, or Liu Qi’s inexperienced driving and overwhelming arrogance, or with high-speed banter over an impossibly long technical manual that no one has time to digest in the middle of an emergency. At times, the humor is even a little dry, as when MOSS responds to Liu Peiqiang’s repeated rebellions with a passive-aggressive “Will all violators stop contact immediately with Earth?” But Gwo finds time for majesty as well, and makes a point of considering the problem on a global scale, rather than just focusing on the few desperate strivers who’ve tied the Earth’s potential destruction into their own personal issues. 28 | 29 | Much like the Russian space blockbuster Salyut-7 was a fascinating look into the cultural differences between American films and their Russian equivalents, The Wandering Earth feels like a telling illustration of the similarities and differences between Chinese and American values. Gwo’s film is full of images and moments that will be familiar to American audiences, and it has an equally familiar preoccupation with the importance of family connections, and the nobility of sacrifice. But it also puts a strong focus on global collective action, on the need for international cooperation, and for the will of the group over the will of the individual. 30 | 31 | None of these things will be inherently alien to American viewers, who may experience The Wandering Earth as a best-of mash-up of past science fiction films, just with less-familiar faces in the lead roles. But as China gets into the action-blockbuster business, it’ll continue to be fascinating to see how the country brings its own distinctive voices and talents into a global market. The Wandering Earth feels like the same kind of projects American filmmakers are making — accessible, thrill-focused, and at least somewhat generic, in an attempt to go down easy with any audience. But there’s enough specific personality in it to point to a future of more nationally inflected blockbusters. Once every country is making would-be international crossovers, the strongest appeal may come from the most distinctive, personal visions with the most to say about the cultures they come from. 32 | """ 33 | 34 | content2 = """ 35 | Ever since 2017, when the new flat and fast course was introduced in the 11th　edition of the Tokyo Marathon, fast times are being recorded. The Tokyo Marathon is now a truly world class race. 36 | 37 | Two years ago, a former world record holder Wilson Kipsang (KEN) recorded the Japanese all comers record of 2:03:58 on this course. In the same year, a marathon debutant Yuta Shitara (JPN, Honda) ran aggressively and for a while, stayed close to Kipsang. The race gave hope and courage to Japanese runners and fans, leading to the thoughts "Japanese can compete well at the world class level." 38 | Sequel to the drama, Shitara recorded Japanese record of 2:06:11 for the first time in 16 years. To add further excitement, the Japan Industrial Track & Field Association awarded Shitara with 100-million-yen prize money as part of "Project Exceed", a program launched to encourage athletes to break national records. Additionally, nine Japanese runners have cracked 2:10 for the marathon, showing that many of them are ready to compete at the world class level. I remember last year's race was nothing like previous years, leading to the new era for Japanese men's marathon. 39 | 40 | This year, the 13th edition of the Tokyo Marathon, is expected to be even more exciting than the previous years. 41 | 42 | On the men's side, Kenenisa Bekele (ETH), who has the personal best of 2:03:03, third fastest marathon in history on the standard course, head the field. Kenenisa, who is endowed with superior speed, won the gold medal at track events in both the 2004 & 2008 Olympics. He is known for his aggressive running style and thus likely to be the force to be reckoned with in Tokyo Marathon. Total of five 2:04 runners, including great tactician Dickson Chumba, the only two-time Tokyo Marathon champion (2014, 2018) on the men's side, and El Hassan El Abassi (BRN), who battled with Hiroto Inoue (JPN, MHPS) in the 2018 Asian Games, will start the race. Furthermore, two Kenyans with 2:05 marathon best are in the field. It is very interesting to see how the race will unfold. 43 | 44 | The most fascinating runner in the field, at least from the Japanese perspective, is Suguru Osako (JPN, Nike Oregon Project), who recorded the national record of 2:05:50 in the Chicago Marathon in October. How will he run his first Tokyo Marathon? In the 2017 Boston Marathon, his debut, Osako recorded 2:10:28. In his second marathon, the 2017 Fukuoka Marathon, he improved his personal best to 2:07:19 before recording the national record in Chicago. He is steadily improving his personal best and his potential is unimaginable. By battling well against the runners from abroad including Kenenisa Bekele, perhaps he can improve his own national record again. 45 | 46 | At the present time, two sets of pacemakers are planned for the men's race. First set of pacemakers will lead at 2:57-2:58 /km pace until 30km, targeting the time around 2:04:30 to 2:05:10. Osako, along with the Africans headed by Kenenisa Bekele are expected to follow the first set of pacemakers. I would also like to see other Japanese runners to follow these pacers to experience the world class races. 47 | The second set of pacemakers will lead the runners at 3min/km to target the final time around 2:06:35. Ryo Kiname (JPN, MHPS), who finished seventh with 2:08:08 last year in Tokyo, as well as Shogo Nakamura (JPN, Fujitsu), who has the best of 2:08:16, have a potential to record 2:06 marathon. They probably target at least 2:07 marathon in Tokyo. 48 | 49 | It is hard not to expect a great marathon from Kenta Murayama (JPN, Asahi Kasei). In the 10th edition of the Tokyo Marathon in 2016, Murayama was the only Japanese to stay with the lead pack as far as 22km. The impact he made in his debut marathon is unforgettable. Many imagine that Murayama runs better at a fast-paced marathon. If he is sucked into the fast pace, Murayama could move up several levels as a marathon runner. 50 | 51 | In recent years, Japanese men's marathon is on the rise. Last year, Shitara and Inoue recorded 2:06 marathon in Tokyo. Later in the year, Inoue won the Asian Games marathon, Osako recorded the national record and first 2:05 marathon by Japanese in Chicago, and in December Yuma Hattori (JPN, Toyota Motors) became the first Japanese to win the Fukuoka Marathon in 14 years. With young and upcoming runners on the rise, the Japanese are closing on to the best in the world. I am determined to do everything possible for the race so that at least five Japanese will run 2:06 marathon before the 2020 Tokyo Olympics. 52 | 53 | The women's field is also loaded this year with fast runners and thus the expectation for a great competition is high. The rising star from abroad is Ruti Aga (ETH), who recorded the personal best of 2:18:34 at the Berlin Marathon last September. Perhaps one set of women's pacemakers will aim for a 2:17 finishing time. In addition, there are three other runners with the personal best of 2:19 including Florence Kiplagat. 54 | 55 | Among the Japanese women Honami Maeda (JPN, Tenmaya), who was second in the 2018 Osaka Women's Marathon and Keiko Nogami (JPN, 18 Bank), who won the silver medal at the 2018 Asian Games, will start the race. They have already qualified for the Marathon Grand Championships (MGC, the Japanese Olympic trial marathon). Yuka Takashima (JPN, Shiseido), who ran 10000m in the 2016 Olympic Games in Rio de Janeiro, is running her second marathon in her attempt to qualify for the MGC. Mao Ichiyama (JPN, Wacoal), making her marathon debut, is expected to run aggressively. Excitement is never ending for this year's race. 56 | 57 | With the Tokyo Olympics just around the corner, elite runners, both men and women, are gathering in Tokyo to experience the Olympic course. It is exciting to see the world class competitions. If Osako and his Japanese rivals come close to the national record, it will add to the excitement. The history may be in making. Please enjoy the Tokyo Marathon 2019, the scene of world class runners running over the world class course. 58 | """ 59 | 60 | content3 = """ 61 | RESEARCHERS WHO STUDY stylometry—the statistical analysis of linguistic style—have long known that writing is a unique, individualistic process. The vocabulary you select, your syntax, and your grammatical decisions leave behind a signature. Automated tools can now accurately identify the author of a forum post for example, as long as they have adequate training data to work with. But newer research shows that stylometry can also apply to artificial language samples, like code. Software developers, it turns out, leave behind a fingerprint as well. 62 | 63 | Rachel Greenstadt, an associate professor of computer science at Drexel University, and Aylin Caliskan, Greenstadt's former PhD student and now an assistant professor at George Washington University, have found that code, like other forms of stylistic expression, are not anonymous. At the DefCon hacking conference Friday, the pair will present a number of studies they've conducted using machine learning techniques to de-anonymize the authors of code samples. Their work, some of which was funded by and conducted in collaboration with the United States Army Research Laboratory, could be useful in a plagiarism dispute, for instance, but also has privacy implications, especially for the thousands of developers who contribute open source code to the world. 64 | 65 | How To De-Anonymize Code 66 | Here's a simple explanation of how the researchers used machine learning to uncover who authored a piece of code. First, the algorithm they designed identifies all the features found in a selection of code samples. That's a lot of different characteristics. Think of every aspect that exists in natural language: There's the words you choose, which way you put them together, sentence length, and so on. Greenstadt and Caliskan then narrowed the features to only include the ones that actually distinguish developers from each other, trimming the list from hundreds of thousands to around 50 or so. 67 | 68 | The researchers don't rely on low-level features, like how code was formatted. Instead, they create "abstract syntax trees," which reflect code's underlying structure, rather than its arbitrary components. Their technique is akin to prioritizing someone's sentence structure, instead of whether they indent each line in a paragraph. 69 | 70 | 'People should be aware that it’s generally very hard to 100 percent hide your identity in these kinds of situations.' 71 | 72 | RACHEL GREENSTADT, DREXEL UNIVERSITY 73 | 74 | The method also need requires examples of someone's work to teach an algorithm to know when it spots another one of their code samples. If a random GitHub account pops up and publishes a code fragment, Greenstadt and Caliskan wouldn't necessarily be able to identify the person behind it, because they only have one sample to work with. (They could possibly tell that it was a developer they hadn't seen before.) Greenstadt and Caliskan, however, don't need your life's work to attribute code to you. It only takes a few short samples. 75 | 76 | For example, in a 2017 paper, Caliskan, Greenstadt, and two other researchers demonstrated that even small snippets of code on the repository site GitHub can be enough to differentiate one coder from another with a high degree of accuracy. 77 | 78 | Most impressively, Caliskan and a team of other researchers showed in a separate paper that it’s possible to de-anonymize a programmer using only their compiled binary code. After a developer finishes writing a section of code, a program called a compiler turns it into a series of 1s and 0s that can be read by a machine, called binary. To humans, it mostly looks like nonsense. 79 | 80 | Caliskan and the other researchers she worked with can decompile the binary back into the C++ programming language, while preserving elements of a developer’s unique style. Imagine you wrote a paper and used Google Translate to transform it into another language. While the text might seem completely different, elements of how you write are still embedded in traits like your syntax. The same holds true for code. 81 | 82 | “Style is preserved,” says Caliskan. “There is a very strong stylistic fingerprint that remains when things are based on learning on an individual basis.” 83 | 84 | To conduct the binary experiment, Caliskan and the other researchers used code samples from Google’s annual Code Jam competition. The machine learning algorithm correctly identified a group of 100 individual programmers 96 percent of the time, using eight code samples from each. Even when the sample size was widened to 600 programmers, the algorithm still made an accurate identification 83 percent of the time. 85 | 86 | Plagiarism and Privacy Implications 87 | Caliskan and Greenstadt say their work could be used to tell whether a programming student plagiarized, or whether a developer violated a noncompete clause in their employment contract. Security researchers could potentially use it to help determine who might have created a specific type of malware. 88 | 89 | More worryingly, an authoritarian government could use the de-anonymization techniques to identify the individuals behind, say, a censorship circumvention tool. The research also has privacy implications for developers who contribute to open source projects, especially if they consistently use the same GitHub account. 90 | 91 | “People should be aware that it’s generally very hard to 100 percent hide your identity in these kinds of situations,” says Greenstadt. 92 | 93 | For example, Greenstadt and Caliskan have found that some off-the-shelf obfuscation methods, tools used by software engineers to make code more complicated, and thus secure, aren't successful in hiding a developer's unique style. The researchers say that in the future, however, programmers might be able to conceal their styles using more sophisticated methods. 94 | 95 | “I do think as we proceed, one thing we’re going to discover is what kind of obfuscation works to hide this stuff,” says Greenstadt. “I’m not convinced that the end point of this is going to be everything you do forever is traceable. I hope not, anyway.” 96 | 97 | In a separate paper, for instance, a team led by Lucy Simko at the University of Washington found that programmers could craft code with the intention of tricking an algorithm into believing it had been authored by someone else. The team found that a developer may be able to spoof their "coding signature," even if they're not specifically trained in creating forgeries. 98 | 99 | Future Work 100 | Greenstadt and Caliskan have also uncovered a number of interesting insights about the nature of programming. For example, they have found that experienced developers appear easier to identify than novice ones. The more skilled you are, the more unique your work apparently becomes. That might be in part because beginner programmers often copy and paste code solutions from websites like Stack Overflow. 101 | 102 | Similarly, they found that code samples addressing more difficult problems are also easier to attribute. Using a sample set of 62 programmers, who each solved seven "easy" problems, the researchers were able to de-anonymize their work 90 percent of the time. When the researchers used seven "hard" problem samples instead, their accuracy bumped to 95 percent. 103 | 104 | 'Style is preserved.' 105 | 106 | AYLIN CALISKAN, GEORGE WASHINGTON UNIVERSITY 107 | 108 | In the future, Greenstadt and Caliskan want to understand how other factors might affect a person’s coding style, like what happens when members of the same organization collaborate on a project. They also want to explore questions like whether people from different countries code in different ways. In one preliminary study for example, they found they could differentiate between code samples written by Canadian and by Chinese developers with over 90 percent accuracy. 109 | 110 | There’s also the question of whether the same attribution methods could be used across different programming languages in a standardized way. For now, the researchers stress that de-anonymizing code is still a mysterious process, though so far their methods have been shown to work. 111 | 112 | “We’re still trying to understand what makes something really attributable and what doesn't,” says Greenstadt. “There’s enough here to say it should be a concern, but I hope it doesn’t cause anybody to not contribute publicly on things.” 113 | 114 | Updated 8/14/18 2:53 PM PST: This article has been updated to reflect the contributions of the US Army Research Laboratory. 115 | """ 116 | 117 | Miner = NewsMining() 118 | Miner.main(content1) 119 | -------------------------------------------------------------------------------- /VIS/dist/vis.css: -------------------------------------------------------------------------------- 1 | .vis .overlay { 2 | position: absolute; 3 | top: 0; 4 | left: 0; 5 | width: 100%; 6 | height: 100%; 7 | 8 | /* Must be displayed above for example selected Timeline items */ 9 | z-index: 10; 10 | } 11 | 12 | .vis-active { 13 | box-shadow: 0 0 10px #86d5f8; 14 | } 15 | 16 | /* override some bootstrap styles screwing up the timelines css */ 17 | 18 | .vis [class*="span"] { 19 | min-height: 0; 20 | width: auto; 21 | } 22 | 23 | div.vis-configuration { 24 | position:relative; 25 | display:block; 26 | float:left; 27 | font-size:12px; 28 | } 29 | 30 | div.vis-configuration-wrapper { 31 | display:block; 32 | width:700px; 33 | } 34 | 35 | 36 | div.vis-configuration.vis-config-option-container{ 37 | display:block; 38 | width:495px; 39 | background-color: #ffffff; 40 | border:2px solid #f7f8fa; 41 | border-radius:4px; 42 | margin-top:20px; 43 | left:10px; 44 | padding-left:5px; 45 | } 46 | 47 | div.vis-configuration.vis-config-button{ 48 | display:block; 49 | width:495px; 50 | height:25px; 51 | vertical-align: middle; 52 | line-height:25px; 53 | background-color: #f7f8fa; 54 | border:2px solid #ceced0; 55 | border-radius:4px; 56 | margin-top:20px; 57 | left:10px; 58 | padding-left:5px; 59 | cursor: pointer; 60 | margin-bottom:30px; 61 | } 62 | 63 | div.vis-configuration.vis-config-button.hover{ 64 | background-color: #4588e6; 65 | border:2px solid #214373; 66 | color:#ffffff; 67 | } 68 | 69 | div.vis-configuration.vis-config-item{ 70 | display:block; 71 | float:left; 72 | width:495px; 73 | height:25px; 74 | vertical-align: middle; 75 | line-height:25px; 76 | } 77 | 78 | 79 | div.vis-configuration.vis-config-item.vis-config-s2{ 80 | left:10px; 81 | background-color: #f7f8fa; 82 | padding-left:5px; 83 | border-radius:3px; 84 | } 85 | div.vis-configuration.vis-config-item.vis-config-s3{ 86 | left:20px; 87 | background-color: #e4e9f0; 88 | padding-left:5px; 89 | border-radius:3px; 90 | } 91 | div.vis-configuration.vis-config-item.vis-config-s4{ 92 | left:30px; 93 | background-color: #cfd8e6; 94 | padding-left:5px; 95 | border-radius:3px; 96 | } 97 | 98 | div.vis-configuration.vis-config-header{ 99 | font-size:18px; 100 | font-weight: bold; 101 | } 102 | 103 | div.vis-configuration.vis-config-label{ 104 | width:120px; 105 | height:25px; 106 | line-height: 25px; 107 | } 108 | 109 | div.vis-configuration.vis-config-label.vis-config-s3{ 110 | width:110px; 111 | } 112 | div.vis-configuration.vis-config-label.vis-config-s4{ 113 | width:100px; 114 | } 115 | 116 | div.vis-configuration.vis-config-colorBlock{ 117 | top:1px; 118 | width:30px; 119 | height:19px; 120 | border:1px solid #444444; 121 | border-radius:2px; 122 | padding:0px; 123 | margin:0px; 124 | cursor:pointer; 125 | } 126 | 127 | input.vis-configuration.vis-config-checkbox { 128 | left:-5px; 129 | } 130 | 131 | 132 | input.vis-configuration.vis-config-rangeinput{ 133 | position:relative; 134 | top:-5px; 135 | width:60px; 136 | height:13px; 137 | padding:1px; 138 | margin:0; 139 | pointer-events:none; 140 | } 141 | 142 | input.vis-configuration.vis-config-range{ 143 | /*removes default webkit styles*/ 144 | -webkit-appearance: none; 145 | 146 | /*fix for FF unable to apply focus style bug */ 147 | border: 0px solid white; 148 | background-color:rgba(0,0,0,0); 149 | 150 | /*required for proper track sizing in FF*/ 151 | width: 300px; 152 | height:20px; 153 | } 154 | input.vis-configuration.vis-config-range::-webkit-slider-runnable-track { 155 | width: 300px; 156 | height: 5px; 157 | background: #dedede; /* Old browsers */ 158 | background: -moz-linear-gradient(top, #dedede 0%, #c8c8c8 99%); /* FF3.6+ */ 159 | background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#dedede), color-stop(99%,#c8c8c8)); /* Chrome,Safari4+ */ 160 | background: -webkit-linear-gradient(top, #dedede 0%,#c8c8c8 99%); /* Chrome10+,Safari5.1+ */ 161 | background: -o-linear-gradient(top, #dedede 0%, #c8c8c8 99%); /* Opera 11.10+ */ 162 | background: -ms-linear-gradient(top, #dedede 0%,#c8c8c8 99%); /* IE10+ */ 163 | background: linear-gradient(to bottom, #dedede 0%,#c8c8c8 99%); /* W3C */ 164 | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dedede', endColorstr='#c8c8c8',GradientType=0 ); /* IE6-9 */ 165 | 166 | border: 1px solid #999999; 167 | box-shadow: #aaaaaa 0px 0px 3px 0px; 168 | border-radius: 3px; 169 | } 170 | input.vis-configuration.vis-config-range::-webkit-slider-thumb { 171 | -webkit-appearance: none; 172 | border: 1px solid #14334b; 173 | height: 17px; 174 | width: 17px; 175 | border-radius: 50%; 176 | background: #3876c2; /* Old browsers */ 177 | background: -moz-linear-gradient(top, #3876c2 0%, #385380 100%); /* FF3.6+ */ 178 | background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3876c2), color-stop(100%,#385380)); /* Chrome,Safari4+ */ 179 | background: -webkit-linear-gradient(top, #3876c2 0%,#385380 100%); /* Chrome10+,Safari5.1+ */ 180 | background: -o-linear-gradient(top, #3876c2 0%,#385380 100%); /* Opera 11.10+ */ 181 | background: -ms-linear-gradient(top, #3876c2 0%,#385380 100%); /* IE10+ */ 182 | background: linear-gradient(to bottom, #3876c2 0%,#385380 100%); /* W3C */ 183 | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3876c2', endColorstr='#385380',GradientType=0 ); /* IE6-9 */ 184 | box-shadow: #111927 0px 0px 1px 0px; 185 | margin-top: -7px; 186 | } 187 | input.vis-configuration.vis-config-range:focus { 188 | outline: none; 189 | } 190 | input.vis-configuration.vis-config-range:focus::-webkit-slider-runnable-track { 191 | background: #9d9d9d; /* Old browsers */ 192 | background: -moz-linear-gradient(top, #9d9d9d 0%, #c8c8c8 99%); /* FF3.6+ */ 193 | background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#9d9d9d), color-stop(99%,#c8c8c8)); /* Chrome,Safari4+ */ 194 | background: -webkit-linear-gradient(top, #9d9d9d 0%,#c8c8c8 99%); /* Chrome10+,Safari5.1+ */ 195 | background: -o-linear-gradient(top, #9d9d9d 0%,#c8c8c8 99%); /* Opera 11.10+ */ 196 | background: -ms-linear-gradient(top, #9d9d9d 0%,#c8c8c8 99%); /* IE10+ */ 197 | background: linear-gradient(to bottom, #9d9d9d 0%,#c8c8c8 99%); /* W3C */ 198 | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9d9d9d', endColorstr='#c8c8c8',GradientType=0 ); /* IE6-9 */ 199 | } 200 | 201 | input.vis-configuration.vis-config-range::-moz-range-track { 202 | width: 300px; 203 | height: 10px; 204 | background: #dedede; /* Old browsers */ 205 | background: -moz-linear-gradient(top, #dedede 0%, #c8c8c8 99%); /* FF3.6+ */ 206 | background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#dedede), color-stop(99%,#c8c8c8)); /* Chrome,Safari4+ */ 207 | background: -webkit-linear-gradient(top, #dedede 0%,#c8c8c8 99%); /* Chrome10+,Safari5.1+ */ 208 | background: -o-linear-gradient(top, #dedede 0%, #c8c8c8 99%); /* Opera 11.10+ */ 209 | background: -ms-linear-gradient(top, #dedede 0%,#c8c8c8 99%); /* IE10+ */ 210 | background: linear-gradient(to bottom, #dedede 0%,#c8c8c8 99%); /* W3C */ 211 | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dedede', endColorstr='#c8c8c8',GradientType=0 ); /* IE6-9 */ 212 | 213 | border: 1px solid #999999; 214 | box-shadow: #aaaaaa 0px 0px 3px 0px; 215 | border-radius: 3px; 216 | } 217 | input.vis-configuration.vis-config-range::-moz-range-thumb { 218 | border: none; 219 | height: 16px; 220 | width: 16px; 221 | 222 | border-radius: 50%; 223 | background: #385380; 224 | } 225 | 226 | /*hide the outline behind the border*/ 227 | input.vis-configuration.vis-config-range:-moz-focusring{ 228 | outline: 1px solid white; 229 | outline-offset: -1px; 230 | } 231 | 232 | input.vis-configuration.vis-config-range::-ms-track { 233 | width: 300px; 234 | height: 5px; 235 | 236 | /*remove bg colour from the track, we'll use ms-fill-lower and ms-fill-upper instead */ 237 | background: transparent; 238 | 239 | /*leave room for the larger thumb to overflow with a transparent border */ 240 | border-color: transparent; 241 | border-width: 6px 0; 242 | 243 | /*remove default tick marks*/ 244 | color: transparent; 245 | } 246 | input.vis-configuration.vis-config-range::-ms-fill-lower { 247 | background: #777; 248 | border-radius: 10px; 249 | } 250 | input.vis-configuration.vis-config-range::-ms-fill-upper { 251 | background: #ddd; 252 | border-radius: 10px; 253 | } 254 | input.vis-configuration.vis-config-range::-ms-thumb { 255 | border: none; 256 | height: 16px; 257 | width: 16px; 258 | border-radius: 50%; 259 | background: #385380; 260 | } 261 | input.vis-configuration.vis-config-range:focus::-ms-fill-lower { 262 | background: #888; 263 | } 264 | input.vis-configuration.vis-config-range:focus::-ms-fill-upper { 265 | background: #ccc; 266 | } 267 | 268 | .vis-configuration-popup { 269 | position: absolute; 270 | background: rgba(57, 76, 89, 0.85); 271 | border: 2px solid #f2faff; 272 | line-height:30px; 273 | height:30px; 274 | width:150px; 275 | text-align:center; 276 | color: #ffffff; 277 | font-size:14px; 278 | border-radius:4px; 279 | -webkit-transition: opacity 0.3s ease-in-out; 280 | -moz-transition: opacity 0.3s ease-in-out; 281 | transition: opacity 0.3s ease-in-out; 282 | } 283 | .vis-configuration-popup:after, .vis-configuration-popup:before { 284 | left: 100%; 285 | top: 50%; 286 | border: solid transparent; 287 | content: " "; 288 | height: 0; 289 | width: 0; 290 | position: absolute; 291 | pointer-events: none; 292 | } 293 | 294 | .vis-configuration-popup:after { 295 | border-color: rgba(136, 183, 213, 0); 296 | border-left-color: rgba(57, 76, 89, 0.85); 297 | border-width: 8px; 298 | margin-top: -8px; 299 | } 300 | .vis-configuration-popup:before { 301 | border-color: rgba(194, 225, 245, 0); 302 | border-left-color: #f2faff; 303 | border-width: 12px; 304 | margin-top: -12px; 305 | } 306 | 307 | .vis-timeline { 308 | position: relative; 309 | border: 1px solid #bfbfbf; 310 | 311 | overflow: hidden; 312 | padding: 0; 313 | margin: 0; 314 | 315 | box-sizing: border-box; 316 | } 317 | 318 | 319 | .vis-panel { 320 | position: absolute; 321 | 322 | padding: 0; 323 | margin: 0; 324 | 325 | box-sizing: border-box; 326 | } 327 | 328 | .vis-panel.vis-center, 329 | .vis-panel.vis-left, 330 | .vis-panel.vis-right, 331 | .vis-panel.vis-top, 332 | .vis-panel.vis-bottom { 333 | border: 1px #bfbfbf; 334 | } 335 | 336 | .vis-panel.vis-center, 337 | .vis-panel.vis-left, 338 | .vis-panel.vis-right { 339 | border-top-style: solid; 340 | border-bottom-style: solid; 341 | overflow: hidden; 342 | } 343 | 344 | .vis-panel.vis-center, 345 | .vis-panel.vis-top, 346 | .vis-panel.vis-bottom { 347 | border-left-style: solid; 348 | border-right-style: solid; 349 | } 350 | 351 | .vis-background { 352 | overflow: hidden; 353 | } 354 | 355 | .vis-panel > .vis-content { 356 | position: relative; 357 | } 358 | 359 | .vis-panel .vis-shadow { 360 | position: absolute; 361 | width: 100%; 362 | height: 1px; 363 | box-shadow: 0 0 10px rgba(0,0,0,0.8); 364 | /* TODO: find a nice way to ensure vis-shadows are drawn on top of items 365 | z-index: 1; 366 | */ 367 | } 368 | 369 | .vis-panel .vis-shadow.vis-top { 370 | top: -1px; 371 | left: 0; 372 | } 373 | 374 | .vis-panel .vis-shadow.vis-bottom { 375 | bottom: -1px; 376 | left: 0; 377 | } 378 | 379 | .vis-labelset { 380 | position: relative; 381 | 382 | overflow: hidden; 383 | 384 | box-sizing: border-box; 385 | } 386 | 387 | .vis-labelset .vis-label { 388 | position: relative; 389 | left: 0; 390 | top: 0; 391 | width: 100%; 392 | color: #4d4d4d; 393 | 394 | box-sizing: border-box; 395 | } 396 | 397 | .vis-labelset .vis-label { 398 | border-bottom: 1px solid #bfbfbf; 399 | } 400 | 401 | .vis-labelset .vis-label.draggable { 402 | cursor: pointer; 403 | } 404 | 405 | .vis-labelset .vis-label:last-child { 406 | border-bottom: none; 407 | } 408 | 409 | .vis-labelset .vis-label .vis-inner { 410 | display: inline-block; 411 | padding: 5px; 412 | } 413 | 414 | .vis-labelset .vis-label .vis-inner.vis-hidden { 415 | padding: 0; 416 | } 417 | 418 | 419 | .vis-itemset { 420 | position: relative; 421 | padding: 0; 422 | margin: 0; 423 | 424 | box-sizing: border-box; 425 | } 426 | 427 | .vis-itemset .vis-background, 428 | .vis-itemset .vis-foreground { 429 | position: absolute; 430 | width: 100%; 431 | height: 100%; 432 | overflow: visible; 433 | } 434 | 435 | .vis-axis { 436 | position: absolute; 437 | width: 100%; 438 | height: 0; 439 | left: 0; 440 | z-index: 1; 441 | } 442 | 443 | .vis-foreground .vis-group { 444 | position: relative; 445 | box-sizing: border-box; 446 | border-bottom: 1px solid #bfbfbf; 447 | } 448 | 449 | .vis-foreground .vis-group:last-child { 450 | border-bottom: none; 451 | } 452 | 453 | .vis-overlay { 454 | position: absolute; 455 | top: 0; 456 | left: 0; 457 | width: 100%; 458 | height: 100%; 459 | z-index: 10; 460 | } 461 | 462 | .vis-item { 463 | position: absolute; 464 | color: #1A1A1A; 465 | border-color: #97B0F8; 466 | border-width: 1px; 467 | background-color: #D5DDF6; 468 | display: inline-block; 469 | /*overflow: hidden;*/ 470 | } 471 | 472 | .vis-item.vis-selected { 473 | border-color: #FFC200; 474 | background-color: #FFF785; 475 | 476 | /* z-index must be higher than the z-index of custom time bar and current time bar */ 477 | z-index: 2; 478 | } 479 | 480 | .vis-editable.vis-selected { 481 | cursor: move; 482 | } 483 | 484 | .vis-item.vis-point.vis-selected { 485 | background-color: #FFF785; 486 | } 487 | 488 | .vis-item.vis-box { 489 | text-align: center; 490 | border-style: solid; 491 | border-radius: 2px; 492 | } 493 | 494 | .vis-item.vis-point { 495 | background: none; 496 | } 497 | 498 | .vis-item.vis-dot { 499 | position: absolute; 500 | padding: 0; 501 | border-width: 4px; 502 | border-style: solid; 503 | border-radius: 4px; 504 | } 505 | 506 | .vis-item.vis-range { 507 | border-style: solid; 508 | border-radius: 2px; 509 | box-sizing: border-box; 510 | } 511 | 512 | .vis-item.vis-background { 513 | border: none; 514 | background-color: rgba(213, 221, 246, 0.4); 515 | box-sizing: border-box; 516 | padding: 0; 517 | margin: 0; 518 | } 519 | 520 | .vis-item .vis-item-overflow { 521 | position: relative; 522 | width: 100%; 523 | height: 100%; 524 | padding: 0; 525 | margin: 0; 526 | overflow: hidden; 527 | } 528 | 529 | .vis-item.vis-range .vis-item-content { 530 | position: relative; 531 | display: inline-block; 532 | } 533 | 534 | .vis-item.vis-background .vis-item-content { 535 | position: absolute; 536 | display: inline-block; 537 | } 538 | 539 | .vis-item.vis-line { 540 | padding: 0; 541 | position: absolute; 542 | width: 0; 543 | border-left-width: 1px; 544 | border-left-style: solid; 545 | } 546 | 547 | .vis-item .vis-item-content { 548 | white-space: nowrap; 549 | box-sizing: border-box; 550 | padding: 5px; 551 | } 552 | 553 | .vis-item .vis-delete { 554 | background: url('img/timeline/delete.png') no-repeat center; 555 | position: absolute; 556 | width: 24px; 557 | height: 24px; 558 | top: -4px; 559 | right: -24px; 560 | cursor: pointer; 561 | } 562 | 563 | .vis-item.vis-range .vis-drag-left { 564 | position: absolute; 565 | width: 24px; 566 | max-width: 20%; 567 | min-width: 2px; 568 | height: 100%; 569 | top: 0; 570 | left: -4px; 571 | 572 | cursor: w-resize; 573 | } 574 | 575 | .vis-item.vis-range .vis-drag-right { 576 | position: absolute; 577 | width: 24px; 578 | max-width: 20%; 579 | min-width: 2px; 580 | height: 100%; 581 | top: 0; 582 | right: -4px; 583 | 584 | cursor: e-resize; 585 | } 586 | 587 | .vis-time-axis { 588 | position: relative; 589 | overflow: hidden; 590 | } 591 | 592 | .vis-time-axis.vis-foreground { 593 | top: 0; 594 | left: 0; 595 | width: 100%; 596 | } 597 | 598 | .vis-time-axis.vis-background { 599 | position: absolute; 600 | top: 0; 601 | left: 0; 602 | width: 100%; 603 | height: 100%; 604 | } 605 | 606 | .vis-time-axis .vis-text { 607 | position: absolute; 608 | color: #4d4d4d; 609 | padding: 3px; 610 | overflow: hidden; 611 | box-sizing: border-box; 612 | 613 | white-space: nowrap; 614 | } 615 | 616 | .vis-time-axis .vis-text.vis-measure { 617 | position: absolute; 618 | padding-left: 0; 619 | padding-right: 0; 620 | margin-left: 0; 621 | margin-right: 0; 622 | visibility: hidden; 623 | } 624 | 625 | .vis-time-axis .vis-grid.vis-vertical { 626 | position: absolute; 627 | border-left: 1px solid; 628 | } 629 | 630 | .vis-time-axis .vis-grid.vis-minor { 631 | border-color: #e5e5e5; 632 | } 633 | 634 | .vis-time-axis .vis-grid.vis-major { 635 | border-color: #bfbfbf; 636 | } 637 | 638 | .vis-current-time { 639 | background-color: #FF7F6E; 640 | width: 2px; 641 | z-index: 1; 642 | } 643 | .vis-custom-time { 644 | background-color: #6E94FF; 645 | width: 2px; 646 | cursor: move; 647 | z-index: 1; 648 | } 649 | .vis-timeline { 650 | /* 651 | -webkit-transition: height .4s ease-in-out; 652 | transition: height .4s ease-in-out; 653 | */ 654 | } 655 | 656 | .vis-panel { 657 | /* 658 | -webkit-transition: height .4s ease-in-out, top .4s ease-in-out; 659 | transition: height .4s ease-in-out, top .4s ease-in-out; 660 | */ 661 | } 662 | 663 | .vis-axis { 664 | /* 665 | -webkit-transition: top .4s ease-in-out; 666 | transition: top .4s ease-in-out; 667 | */ 668 | } 669 | 670 | /* TODO: get animation working nicely 671 | 672 | .vis-item { 673 | -webkit-transition: top .4s ease-in-out; 674 | transition: top .4s ease-in-out; 675 | } 676 | 677 | .vis-item.line { 678 | -webkit-transition: height .4s ease-in-out, top .4s ease-in-out; 679 | transition: height .4s ease-in-out, top .4s ease-in-out; 680 | } 681 | /**/ 682 | 683 | .vis-panel.vis-background.vis-horizontal .vis-grid.vis-horizontal { 684 | position: absolute; 685 | width: 100%; 686 | height: 0; 687 | border-bottom: 1px solid; 688 | } 689 | 690 | .vis-panel.vis-background.vis-horizontal .vis-grid.vis-minor { 691 | border-color: #e5e5e5; 692 | } 693 | 694 | .vis-panel.vis-background.vis-horizontal .vis-grid.vis-major { 695 | border-color: #bfbfbf; 696 | } 697 | 698 | 699 | .vis-data-axis .vis-y-axis.vis-major { 700 | width: 100%; 701 | position: absolute; 702 | color: #4d4d4d; 703 | white-space: nowrap; 704 | } 705 | 706 | .vis-data-axis .vis-y-axis.vis-major.vis-measure { 707 | padding: 0; 708 | margin: 0; 709 | border: 0; 710 | visibility: hidden; 711 | width: auto; 712 | } 713 | 714 | 715 | .vis-data-axis .vis-y-axis.vis-minor { 716 | position: absolute; 717 | width: 100%; 718 | color: #bebebe; 719 | white-space: nowrap; 720 | } 721 | 722 | .vis-data-axis .vis-y-axis.vis-minor.vis-measure { 723 | padding: 0; 724 | margin: 0; 725 | border: 0; 726 | visibility: hidden; 727 | width: auto; 728 | } 729 | 730 | .vis-data-axis .vis-y-axis.vis-title { 731 | position: absolute; 732 | color: #4d4d4d; 733 | white-space: nowrap; 734 | bottom: 20px; 735 | text-align: center; 736 | } 737 | 738 | .vis-data-axis .vis-y-axis.vis-title.vis-measure { 739 | padding: 0; 740 | margin: 0; 741 | visibility: hidden; 742 | width: auto; 743 | } 744 | 745 | .vis-data-axis .vis-y-axis.vis-title.vis-left { 746 | bottom: 0; 747 | -webkit-transform-origin: left top; 748 | -moz-transform-origin: left top; 749 | -ms-transform-origin: left top; 750 | -o-transform-origin: left top; 751 | transform-origin: left bottom; 752 | -webkit-transform: rotate(-90deg); 753 | -moz-transform: rotate(-90deg); 754 | -ms-transform: rotate(-90deg); 755 | -o-transform: rotate(-90deg); 756 | transform: rotate(-90deg); 757 | } 758 | 759 | .vis-data-axis .vis-y-axis.vis-title.vis-right { 760 | bottom: 0; 761 | -webkit-transform-origin: right bottom; 762 | -moz-transform-origin: right bottom; 763 | -ms-transform-origin: right bottom; 764 | -o-transform-origin: right bottom; 765 | transform-origin: right bottom; 766 | -webkit-transform: rotate(90deg); 767 | -moz-transform: rotate(90deg); 768 | -ms-transform: rotate(90deg); 769 | -o-transform: rotate(90deg); 770 | transform: rotate(90deg); 771 | } 772 | 773 | .vis-legend { 774 | background-color: rgba(247, 252, 255, 0.65); 775 | padding: 5px; 776 | border: 1px solid #b3b3b3; 777 | box-shadow: 2px 2px 10px rgba(154, 154, 154, 0.55); 778 | } 779 | 780 | .vis-legend-text { 781 | /*font-size: 10px;*/ 782 | white-space: nowrap; 783 | display: inline-block 784 | } 785 | .vis-graph-group0 { 786 | fill:#4f81bd; 787 | fill-opacity:0; 788 | stroke-width:2px; 789 | stroke: #4f81bd; 790 | } 791 | 792 | .vis-graph-group1 { 793 | fill:#f79646; 794 | fill-opacity:0; 795 | stroke-width:2px; 796 | stroke: #f79646; 797 | } 798 | 799 | .vis-graph-group2 { 800 | fill: #8c51cf; 801 | fill-opacity:0; 802 | stroke-width:2px; 803 | stroke: #8c51cf; 804 | } 805 | 806 | .vis-graph-group3 { 807 | fill: #75c841; 808 | fill-opacity:0; 809 | stroke-width:2px; 810 | stroke: #75c841; 811 | } 812 | 813 | .vis-graph-group4 { 814 | fill: #ff0100; 815 | fill-opacity:0; 816 | stroke-width:2px; 817 | stroke: #ff0100; 818 | } 819 | 820 | .vis-graph-group5 { 821 | fill: #37d8e6; 822 | fill-opacity:0; 823 | stroke-width:2px; 824 | stroke: #37d8e6; 825 | } 826 | 827 | .vis-graph-group6 { 828 | fill: #042662; 829 | fill-opacity:0; 830 | stroke-width:2px; 831 | stroke: #042662; 832 | } 833 | 834 | .vis-graph-group7 { 835 | fill:#00ff26; 836 | fill-opacity:0; 837 | stroke-width:2px; 838 | stroke: #00ff26; 839 | } 840 | 841 | .vis-graph-group8 { 842 | fill:#ff00ff; 843 | fill-opacity:0; 844 | stroke-width:2px; 845 | stroke: #ff00ff; 846 | } 847 | 848 | .vis-graph-group9 { 849 | fill: #8f3938; 850 | fill-opacity:0; 851 | stroke-width:2px; 852 | stroke: #8f3938; 853 | } 854 | 855 | .vis-timeline .vis-fill { 856 | fill-opacity:0.1; 857 | stroke: none; 858 | } 859 | 860 | 861 | .vis-timeline .vis-bar { 862 | fill-opacity:0.5; 863 | stroke-width:1px; 864 | } 865 | 866 | .vis-timeline .vis-point { 867 | stroke-width:2px; 868 | fill-opacity:1.0; 869 | } 870 | 871 | 872 | .vis-timeline .vis-legend-background { 873 | stroke-width:1px; 874 | fill-opacity:0.9; 875 | fill: #ffffff; 876 | stroke: #c2c2c2; 877 | } 878 | 879 | 880 | .vis-timeline .vis-outline { 881 | stroke-width:1px; 882 | fill-opacity:1; 883 | fill: #ffffff; 884 | stroke: #e5e5e5; 885 | } 886 | 887 | .vis-timeline .vis-icon-fill { 888 | fill-opacity:0.3; 889 | stroke: none; 890 | } 891 | 892 | div.vis-network div.vis-manipulation { 893 | border-width: 0; 894 | border-bottom: 1px; 895 | border-style:solid; 896 | border-color: #d6d9d8; 897 | background: #ffffff; /* Old browsers */ 898 | background: -moz-linear-gradient(top, #ffffff 0%, #fcfcfc 48%, #fafafa 50%, #fcfcfc 100%); /* FF3.6+ */ 899 | background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(48%,#fcfcfc), color-stop(50%,#fafafa), color-stop(100%,#fcfcfc)); /* Chrome,Safari4+ */ 900 | background: -webkit-linear-gradient(top, #ffffff 0%,#fcfcfc 48%,#fafafa 50%,#fcfcfc 100%); /* Chrome10+,Safari5.1+ */ 901 | background: -o-linear-gradient(top, #ffffff 0%,#fcfcfc 48%,#fafafa 50%,#fcfcfc 100%); /* Opera 11.10+ */ 902 | background: -ms-linear-gradient(top, #ffffff 0%,#fcfcfc 48%,#fafafa 50%,#fcfcfc 100%); /* IE10+ */ 903 | background: linear-gradient(to bottom, #ffffff 0%,#fcfcfc 48%,#fafafa 50%,#fcfcfc 100%); /* W3C */ 904 | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#fcfcfc',GradientType=0 ); /* IE6-9 */ 905 | 906 | position: absolute; 907 | left: 0; 908 | top: 0; 909 | width: 100%; 910 | height: 30px; 911 | } 912 | 913 | div.vis-network div.vis-edit-mode { 914 | position:absolute; 915 | left: 0; 916 | top: 15px; 917 | height: 30px; 918 | } 919 | 920 | /* FIXME: shouldn't the vis-close button be a child of the vis-manipulation div? */ 921 | 922 | div.vis-network div.vis-close { 923 | position:absolute; 924 | right: 0; 925 | top: 0; 926 | width: 30px; 927 | height: 30px; 928 | 929 | background-position: 20px 3px; 930 | background-repeat: no-repeat; 931 | background-image: url("img/network/cross.png"); 932 | cursor: pointer; 933 | -webkit-touch-callout: none; 934 | -webkit-user-select: none; 935 | -khtml-user-select: none; 936 | -moz-user-select: none; 937 | -ms-user-select: none; 938 | user-select: none; 939 | } 940 | 941 | div.vis-network div.vis-close:hover { 942 | opacity: 0.6; 943 | } 944 | 945 | div.vis-network div.vis-manipulation div.vis-button, 946 | div.vis-network div.vis-edit-mode div.vis-button { 947 | position:relative; 948 | top:-7px; 949 | font-family: verdana; 950 | font-size: 12px; 951 | -moz-border-radius: 15px; 952 | border-radius: 15px; 953 | display:inline-block; 954 | background-position: 0px 0px; 955 | background-repeat:no-repeat; 956 | height:24px; 957 | margin: 0px 0px 0px 10px; 958 | vertical-align:middle; 959 | cursor: pointer; 960 | padding: 0px 8px 0px 8px; 961 | -webkit-touch-callout: none; 962 | -webkit-user-select: none; 963 | -khtml-user-select: none; 964 | -moz-user-select: none; 965 | -ms-user-select: none; 966 | user-select: none; 967 | } 968 | 969 | div.vis-network div.vis-manipulation div.vis-button:hover { 970 | box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.20); 971 | } 972 | 973 | div.vis-network div.vis-manipulation div.vis-button:active { 974 | box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.50); 975 | } 976 | 977 | div.vis-network div.vis-manipulation div.vis-button.vis-back { 978 | background-image: url("img/network/backIcon.png"); 979 | } 980 | 981 | div.vis-network div.vis-manipulation div.vis-button.vis-none:hover { 982 | box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.0); 983 | cursor: default; 984 | } 985 | div.vis-network div.vis-manipulation div.vis-button.vis-none:active { 986 | box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.0); 987 | } 988 | div.vis-network div.vis-manipulation div.vis-button.vis-none { 989 | padding: 0; 990 | } 991 | div.vis-network div.vis-manipulation div.notification { 992 | margin: 2px; 993 | font-weight: bold; 994 | } 995 | 996 | div.vis-network div.vis-manipulation div.vis-button.vis-add { 997 | background-image: url("img/network/addNodeIcon.png"); 998 | } 999 | 1000 | div.vis-network div.vis-manipulation div.vis-button.vis-edit, 1001 | div.vis-network div.vis-edit-mode div.vis-button.vis-edit { 1002 | background-image: url("img/network/editIcon.png"); 1003 | } 1004 | 1005 | div.vis-network div.vis-edit-mode div.vis-button.vis-edit.vis-edit-mode { 1006 | background-color: #fcfcfc; 1007 | border: 1px solid #cccccc; 1008 | } 1009 | 1010 | div.vis-network div.vis-manipulation div.vis-button.vis-connect { 1011 | background-image: url("img/network/connectIcon.png"); 1012 | } 1013 | 1014 | div.vis-network div.vis-manipulation div.vis-button.vis-delete { 1015 | background-image: url("img/network/deleteIcon.png"); 1016 | } 1017 | /* top right bottom left */ 1018 | div.vis-network div.vis-manipulation div.vis-label, 1019 | div.vis-network div.vis-edit-mode div.vis-label { 1020 | margin: 0 0 0 23px; 1021 | line-height: 25px; 1022 | } 1023 | div.vis-network div.vis-manipulation div.vis-separator-line { 1024 | display:inline-block; 1025 | width:1px; 1026 | height:20px; 1027 | background-color: #bdbdbd; 1028 | margin: 5px 7px 0 15px; 1029 | } 1030 | 1031 | /* TODO: is this redundant? 1032 | div.network-navigation_wrapper { 1033 | position: absolute; 1034 | left: 0; 1035 | top: 0; 1036 | width: 100%; 1037 | height: 100%; 1038 | } 1039 | */ 1040 | div.vis-network-tooltip { 1041 | position: absolute; 1042 | visibility: hidden; 1043 | padding: 5px; 1044 | white-space: nowrap; 1045 | 1046 | font-family: verdana; 1047 | font-size:14px; 1048 | font-color:#000000; 1049 | background-color: #f5f4ed; 1050 | 1051 | -moz-border-radius: 3px; 1052 | -webkit-border-radius: 3px; 1053 | border-radius: 3px; 1054 | border: 1px solid #808074; 1055 | 1056 | box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.2); 1057 | pointer-events: none; 1058 | } 1059 | div.vis-network div.vis-navigation div.vis-button { 1060 | width:34px; 1061 | height:34px; 1062 | -moz-border-radius: 17px; 1063 | border-radius: 17px; 1064 | position:absolute; 1065 | display:inline-block; 1066 | background-position: 2px 2px; 1067 | background-repeat:no-repeat; 1068 | cursor: pointer; 1069 | -webkit-touch-callout: none; 1070 | -webkit-user-select: none; 1071 | -khtml-user-select: none; 1072 | -moz-user-select: none; 1073 | -ms-user-select: none; 1074 | user-select: none; 1075 | } 1076 | 1077 | div.vis-network div.vis-navigation div.vis-button:hover { 1078 | box-shadow: 0 0 3px 3px rgba(56, 207, 21, 0.30); 1079 | } 1080 | 1081 | div.vis-network div.vis-navigation div.vis-button:active { 1082 | box-shadow: 0 0 1px 3px rgba(56, 207, 21, 0.95); 1083 | } 1084 | 1085 | div.vis-network div.vis-navigation div.vis-button.vis-up { 1086 | background-image: url("img/network/upArrow.png"); 1087 | bottom:50px; 1088 | left:55px; 1089 | } 1090 | div.vis-network div.vis-navigation div.vis-button.vis-down { 1091 | background-image: url("img/network/downArrow.png"); 1092 | bottom:10px; 1093 | left:55px; 1094 | } 1095 | div.vis-network div.vis-navigation div.vis-button.vis-left { 1096 | background-image: url("img/network/leftArrow.png"); 1097 | bottom:10px; 1098 | left:15px; 1099 | } 1100 | div.vis-network div.vis-navigation div.vis-button.vis-right { 1101 | background-image: url("img/network/rightArrow.png"); 1102 | bottom:10px; 1103 | left:95px; 1104 | } 1105 | div.vis-network div.vis-navigation div.vis-button.vis-zoomIn { 1106 | background-image: url("img/network/plus.png"); 1107 | bottom:10px; 1108 | right:15px; 1109 | } 1110 | div.vis-network div.vis-navigation div.vis-button.vis-zoomOut { 1111 | background-image: url("img/network/minus.png"); 1112 | bottom:10px; 1113 | right:55px; 1114 | } 1115 | div.vis-network div.vis-navigation div.vis-button.vis-zoomExtends { 1116 | background-image: url("img/network/zoomExtends.png"); 1117 | bottom:50px; 1118 | right:15px; 1119 | } 1120 | 1121 | div.vis-color-picker { 1122 | position:absolute; 1123 | margin-top:-140px; 1124 | margin-left:30px; 1125 | width:293px; 1126 | height:425px; 1127 | padding: 10px; 1128 | border-radius:15px; 1129 | background-color:#ffffff; 1130 | display:none; 1131 | box-shadow: rgba(0,0,0,0.5) 0px 0px 10px 0px; 1132 | } 1133 | 1134 | div.vis-color-picker div.vis-arrow { 1135 | position: absolute; 1136 | top:147px; 1137 | left:5px; 1138 | } 1139 | 1140 | div.vis-color-picker div.vis-arrow:after, 1141 | div.vis-color-picker div.vis-arrow:before { 1142 | right: 100%; 1143 | top: 50%; 1144 | border: solid transparent; 1145 | content: " "; 1146 | height: 0; 1147 | width: 0; 1148 | position: absolute; 1149 | pointer-events: none; 1150 | } 1151 | 1152 | div.vis-color-picker div.vis-arrow:after { 1153 | border-color: rgba(255, 255, 255, 0); 1154 | border-right-color: #ffffff; 1155 | border-width: 30px; 1156 | margin-top: -30px; 1157 | } 1158 | 1159 | div.vis-color-picker div.vis-color { 1160 | position:absolute; 1161 | width: 289px; 1162 | height: 289px; 1163 | cursor: pointer; 1164 | } 1165 | 1166 | 1167 | 1168 | div.vis-color-picker div.vis-brightness { 1169 | position: absolute; 1170 | top:313px; 1171 | } 1172 | 1173 | div.vis-color-picker div.vis-opacity { 1174 | position:absolute; 1175 | top:350px; 1176 | } 1177 | 1178 | div.vis-color-picker div.vis-selector { 1179 | position:absolute; 1180 | top:137px; 1181 | left:137px; 1182 | width:15px; 1183 | height:15px; 1184 | border-radius:15px; 1185 | border:1px solid #ffffff; 1186 | background: #4c4c4c; /* Old browsers */ 1187 | background: -moz-linear-gradient(top, #4c4c4c 0%, #595959 12%, #666666 25%, #474747 39%, #2c2c2c 50%, #000000 51%, #111111 60%, #2b2b2b 76%, #1c1c1c 91%, #131313 100%); /* FF3.6+ */ 1188 | background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4c4c4c), color-stop(12%,#595959), color-stop(25%,#666666), color-stop(39%,#474747), color-stop(50%,#2c2c2c), color-stop(51%,#000000), color-stop(60%,#111111), color-stop(76%,#2b2b2b), color-stop(91%,#1c1c1c), color-stop(100%,#131313)); /* Chrome,Safari4+ */ 1189 | background: -webkit-linear-gradient(top, #4c4c4c 0%,#595959 12%,#666666 25%,#474747 39%,#2c2c2c 50%,#000000 51%,#111111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%); /* Chrome10+,Safari5.1+ */ 1190 | background: -o-linear-gradient(top, #4c4c4c 0%,#595959 12%,#666666 25%,#474747 39%,#2c2c2c 50%,#000000 51%,#111111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%); /* Opera 11.10+ */ 1191 | background: -ms-linear-gradient(top, #4c4c4c 0%,#595959 12%,#666666 25%,#474747 39%,#2c2c2c 50%,#000000 51%,#111111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%); /* IE10+ */ 1192 | background: linear-gradient(to bottom, #4c4c4c 0%,#595959 12%,#666666 25%,#474747 39%,#2c2c2c 50%,#000000 51%,#111111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%); /* W3C */ 1193 | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#131313',GradientType=0 ); /* IE6-9 */ 1194 | } 1195 | 1196 | 1197 | 1198 | div.vis-color-picker div.vis-new-color { 1199 | position:absolute; 1200 | width:140px; 1201 | height:20px; 1202 | border:1px solid rgba(0,0,0,0.1); 1203 | border-radius:5px; 1204 | top:380px; 1205 | left:159px; 1206 | text-align:right; 1207 | padding-right:2px; 1208 | font-size:10px; 1209 | color:rgba(0,0,0,0.4); 1210 | vertical-align:middle; 1211 | line-height:20px; 1212 | 1213 | } 1214 | 1215 | div.vis-color-picker div.vis-initial-color { 1216 | position:absolute; 1217 | width:140px; 1218 | height:20px; 1219 | border:1px solid rgba(0,0,0,0.1); 1220 | border-radius:5px; 1221 | top:380px; 1222 | left:10px; 1223 | text-align:left; 1224 | padding-left:2px; 1225 | font-size:10px; 1226 | color:rgba(0,0,0,0.4); 1227 | vertical-align:middle; 1228 | line-height:20px; 1229 | } 1230 | 1231 | div.vis-color-picker div.vis-label { 1232 | position:absolute; 1233 | width:300px; 1234 | left:10px; 1235 | } 1236 | 1237 | div.vis-color-picker div.vis-label.vis-brightness { 1238 | top:300px; 1239 | } 1240 | 1241 | div.vis-color-picker div.vis-label.vis-opacity { 1242 | top:338px; 1243 | } 1244 | 1245 | div.vis-color-picker div.vis-button { 1246 | position:absolute; 1247 | width:68px; 1248 | height:25px; 1249 | border-radius:10px; 1250 | vertical-align: middle; 1251 | text-align:center; 1252 | line-height: 25px; 1253 | top:410px; 1254 | border:2px solid #d9d9d9; 1255 | background-color: #f7f7f7; 1256 | cursor:pointer; 1257 | } 1258 | 1259 | div.vis-color-picker div.vis-button.vis-cancel { 1260 | /*border:2px solid #ff4e33;*/ 1261 | /*background-color: #ff7761;*/ 1262 | left:5px; 1263 | } 1264 | div.vis-color-picker div.vis-button.vis-load { 1265 | /*border:2px solid #a153e6;*/ 1266 | /*background-color: #cb8dff;*/ 1267 | left:82px; 1268 | } 1269 | div.vis-color-picker div.vis-button.vis-apply { 1270 | /*border:2px solid #4588e6;*/ 1271 | /*background-color: #82b6ff;*/ 1272 | left:159px; 1273 | } 1274 | div.vis-color-picker div.vis-button.vis-save { 1275 | /*border:2px solid #45e655;*/ 1276 | /*background-color: #6dff7c;*/ 1277 | left:236px; 1278 | } 1279 | 1280 | 1281 | div.vis-color-picker input.vis-range { 1282 | width: 290px; 1283 | height:20px; 1284 | } 1285 | 1286 | /* TODO: is this redundant? 1287 | div.vis-color-picker input.vis-range-brightness { 1288 | width: 289px !important; 1289 | } 1290 | 1291 | 1292 | div.vis-color-picker input.vis-saturation-range { 1293 | width: 289px !important; 1294 | }*/ --------------------------------------------------------------------------------