working worker

This commit is contained in:
Oliver Gorwits
2017-12-14 19:15:21 +00:00
parent ebadebe69a
commit 61a3a9e06d
4 changed files with 49 additions and 30 deletions

View File

@@ -1,12 +1,24 @@
importScripts( 'http://localhost:5000/javascripts/d3-3.5.6.js' );
importScripts("https://d3js.org/d3-collection.v1.min.js");
importScripts("https://d3js.org/d3-dispatch.v1.min.js");
importScripts("https://d3js.org/d3-quadtree.v1.min.js");
importScripts("https://d3js.org/d3-timer.v1.min.js");
importScripts("https://d3js.org/d3-force.v1.min.js");
onmessage = function(event) {
var force = event.data.force;
var nodes = event.data.nodes,
links = event.data.links;
for (var i = 0, n = Math.ceil(Math.log(0.001) / Math.log(1 - (1 - Math.pow(0.001, 1 / 300)))); i < n; ++i) {
var simulation = d3.forceSimulation(nodes)
.force("charge", d3.forceManyBody())
.force("link", d3.forceLink(links).distance(20).strength(1))
.force("x", d3.forceX())
.force("y", d3.forceY())
.stop();
for (var i = 0, n = Math.ceil(Math.log(simulation.alphaMin()) / Math.log(1 - simulation.alphaDecay())); i < n; ++i) {
postMessage({type: "tick", progress: i / n});
force.tick();
simulation.tick();
}
postMessage({type: "end", force: force});
postMessage({type: "end", nodes: nodes, links: links});
};

View File

@@ -2,7 +2,7 @@
// custom resize function as there is no event to fire and we need
// to react to the sidebar.
$.getJSON('[% uri_for('/ajax/data/device/netmap') %]', {q: '[% params.q %]'}, function(data) {
$.getJSON('[% uri_for('/ajax/data/device/netmap') %]', {q: '[% params.q %]'}, function(mapdata) {
function resizeGraphContainer() {
setTimeout(function(){
@@ -27,25 +27,20 @@ $.getJSON('[% uri_for('/ajax/data/device/netmap') %]', {q: '[% params.q %]'}, fu
.minZoomFactor(0.1)
.maxZoomFactor(10);
// stop force
netmap_pane.inspect().main.force.stop();
// center on our selected device
netmap_pane.inspect().main.force.on('end.centernode', function() {
var node = netmap_pane.nodeDataById( data['data']['centernode'] );
var node = netmap_pane.nodeDataById( mapdata['v3']['centernode'] );
netmap_pane.zoomSmooth(node.x, node.y, node.radius * 200);
netmap_pane.inspect().main.force.on('end.centernode', null);
});
// disable the default ticker
netmap_pane.inspect().main.force.on('tick', function() {} );
// now start, but without a ticker
netmap_pane.start(data);
jQuery('#nd_sidebar-toggle-img-in').on("click", resizeGraphContainer);
jQuery('#nd_sidebar-toggle-img-out').on("click", resizeGraphContainer);
jQuery(window).on("resize", resizeGraphContainer);
var worker = new Worker( 'http://localhost:5000/javascripts/worker.js' );
console.log(netmap_pane.inspect().main.force);
worker.postMessage({force: netmap_pane.inspect().main.force});
worker.postMessage(mapdata['v4']);
worker.onmessage = function(event) {
switch (event.data.type) {
case "tick": return ticked(event.data);
@@ -55,18 +50,23 @@ $.getJSON('[% uri_for('/ajax/data/device/netmap') %]', {q: '[% params.q %]'}, fu
function ticked(data) {
var progress = data.progress;
console.log(100 * progress + "%");
// console.log( 100 * progress + "%" );
//meter.style.width = 100 * progress + "%";
}
function ended(data) {
console.log( data );
}
var newnodes = data.nodes.map(function(node) {
var index = node['index'];
var x = mapdata['v3']['nodes'][index];
x['x'] = node['x'];
x['y'] = node['y'];
return x;
});
// jQuery('#nd_sidebar-toggle-img-in').on("click", resizeGraphContainer);
// jQuery('#nd_sidebar-toggle-img-out').on("click", resizeGraphContainer);
// jQuery(window).on("resize", resizeGraphContainer);
// resizeGraphContainer();
var netmapdata = {'data': {'nodes': newnodes, 'links': mapdata['v3']['links']}};
netmap_pane.start(netmapdata);
resizeGraphContainer();
}
});
});

View File

@@ -20,7 +20,7 @@
<script type="text/javascript" src="[% uri_base %]/javascripts/bootstrap.min.js"></script>
<script type="text/javascript" src="[% uri_base %]/javascripts/underscore.min.js"></script>
<script type="text/javascript" src="[% uri_base %]/javascripts/jquery.qtip.min.js"></script>
<script type="text/javascript" src="[% uri_base %]/javascripts/d3-3.5.6.js"></script>
<script type="text/javascript" src="[% uri_base %]/javascripts/d3.min.js"></script>
<script type="text/javascript" src="[% uri_base %]/javascripts/d3-force.js"></script>
<script type="text/javascript" src="[% uri_base %]/javascripts/toastr.js"></script>
<script type="text/javascript" src="[% uri_base %]/javascripts/jquery.floatThead.js"></script>