Mercurial > hg > NetworkVis

comparison d3s_examples/python-neo4jrestclient/static/platin/loader_devel.html @ 8:18ef6948d689

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
new d3s examples
author Dirk Wintergruen <dwinter@mpiwg-berlin.mpg.de>
date Thu, 01 Oct 2015 17:17:27 +0200
parents
children
comparison
equal deleted inserted replaced
7:45dad9e38c82 8:18ef6948d689
1 <!DOCTYPE html>
2 <html height="100%">
3
4 <head>
5 <meta http-equiv="content-type" content="text/html; charset=UTF-8">
6 <title>PLATIN</title>
7
8 <style type="text/css">
9 .legend > table, .legend > div {
10 width: 200px !important;
11 height: 100px !important;
12 display: block;
13 overflow-y: scroll;
14 position: absolute;
15 right: 0px;
16 bottom: 0px;
17 font-size: 12px;
18 }
19 </style>
20
21 <link href="css/platin.css" rel="stylesheet" type="text/css">
22 <script src="js/Util/Publisher.js"></script>
23 <script src="js/Build/Loader/DynaJsLoader.js"></script>
24 <script src="js/Build/Loader/Loader.js"></script>
25 </head>
26
27 <body height="100%">
28
29 <noscript>
30 <div style="width: 22em; position: absolute; left: 50%; margin-left: -11em; color: red; background-color: white; border: 1px solid red; padding: 4px; font-family: sans-serif">
31 Your web browser must have JavaScript enabled in order for this application to display correctly.
32 </div>
33 </noscript>
34
35 <table width=100%>
36 <tr>
37 <td colspan=2 width=100% align="center">
38 <div style="width:100%; position:relative">
39 <div style='width: 100%; float:left;'>
40 <a href="http://www.informatik.uni-leipzig.de:8080/geotemco/" target="_"><img width='18%' src='images/geotemco.png'></a>
41 <a href="http://www.topoi.org/group/d-6/" target="_"><img width='18%' src='images/topoi.png'></a>
42 <a href="http://skruse.github.io/PLATIN/" target="_"><img width='18%' src='images/platin.png'></a>
43 <a href="http://www.mpiwg-berlin.mpg.de /de/index.html" target=""><img width='18%' src='images/mpiwg.gif'></a>
44 <a href="https://de.dariah.eu/geobrowser" target="_"><img width='18%' src='images/dariah.png'></a>
45 </div>
46 </div>
47 </td>
48 </tr>
49 <tr >
50 <td width=50%>
51 <fieldset id="dataloaderContainerDiv" style="position:relative;">
52 <legend>Load Data</legend>
53 </fieldset>
54 </td>
55 <td rowspan=3 width=50% valign=top>
56 <fieldset id="storytellingContainerDiv" style="position:relative;">
57 <legend>Data History</legend>
58 </fieldset>
59 </td>
60 </tr>
61 <tr>
62 <td width=50%>
63 <fieldset id="overlayloaderContainerDiv" style="position:relative;">
64 <legend>Load Overlay</legend>
65 </fieldset>
66 </td>
67 </tr>
68 <tr>
69 <td width=50%>
70 <fieldset id="storytelling2ContainerDiv" style="position:relative;">
71 <legend>Storytelling</legend>
72 </fieldset>
73 </td>
74 </tr>
75 <tr>
76 <td width=50%>
77 <div id="mapContainerDiv" style="position:relative;"></div>
78 </td>
79 <td width=50%>
80 <div id="piechartContainerDiv" style="height:580px; position:relative;"></div>
81 </td>
82 </tr>
83 </table>
84 <div id="plotContainerDiv" style="position:relative;"></div>
85 <div id="tableContainerDiv" style="position:relative;"></div>
86
87 <script>
88 Publisher.Subscribe( 'GeoTemCoReady', this, function(){
89 var datasets = [];
90 var mapDiv = document.getElementById("mapContainerDiv");
91 var map = new WidgetWrapper();
92 var mapWidget = new MapWidget(map,mapDiv,{
93 mapTitle: "Publication Place"
94 });
95 var timeDiv = document.getElementById("plotContainerDiv");
96 var time = new WidgetWrapper();
97 var timeWidget = new FuzzyTimelineWidget(time,timeDiv,{
98 timeTitle: "Publication Date"
99 });
100 var tableDiv = document.getElementById("tableContainerDiv");
101 var table = new WidgetWrapper();
102 var tableWidget = new TableWidget(table,tableDiv);
103
104 var dataloaderDiv = document.getElementById("dataloaderContainerDiv");
105 var dataloader = new WidgetWrapper();
106 var dataloaderWidget = new DataloaderWidget(dataloader,dataloaderDiv);
107
108 var overlayloaderDiv = document.getElementById("overlayloaderContainerDiv");
109 var overlayloader = new WidgetWrapper();
110 var overlayloaderWidget = new OverlayloaderWidget(overlayloader,overlayloaderDiv);
111 overlayloaderWidget.attachMapWidget(mapWidget);
112
113 var piechartDiv = document.getElementById("piechartContainerDiv");
114 var piechart = new WidgetWrapper();
115 var piechartWidget = new PieChartWidget(piechart,piechartDiv);
116
117 var storytellingDiv = document.getElementById("storytellingContainerDiv");
118 var storytelling = new WidgetWrapper();
119 var storytellingWidget = new StorytellingWidget(storytelling,storytellingDiv);
120
121 var storytelling2Div = document.getElementById("storytelling2ContainerDiv");
122 var storytelling2 = new WidgetWrapper();
123 var storytellingv2Widget = new Storytellingv2Widget(storytelling2,storytelling2Div);
124
125
126 var lineOverlay = new WidgetWrapper();
127 var lineOverlayWidget = new LineOverlayWidget(lineOverlay);
128 lineOverlayWidget.attachMapWidget(mapWidget);
129 lineOverlayWidget.matchColumns(0,"ident",0,"parent");
130
131 dataloaderWidget.loadFromURL();
132 });
133 </script>
134
135 </body>
136
137 </html>