mirror of
https://github.com/arnaucube/goBlockchainDataAnalysis.git
synced 2026-02-07 03:36:44 +01:00
implemented generation of network map of address history, not finished
This commit is contained in:
29
web/views/addressNetwork/addressNetwork.html
Normal file
29
web/views/addressNetwork/addressNetwork.html
Normal file
@@ -0,0 +1,29 @@
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-sm-3">
|
||||
<div class="panel-heading c_blueGrey300">
|
||||
<h3 class="panel-title">All addresses</h3>
|
||||
</div>
|
||||
<div class="panel-body" style="max-height: 500px;overflow-y: scroll;">
|
||||
<div class="form-group label-floating">
|
||||
<input ng-model="filterAddress" abmFormControl class="form-control" placeholder="Filter" type="text">
|
||||
</div>
|
||||
<div ng-click="getAddressNetwork(node)" class="list-group-item" ng-repeat="node in addresses | filter: filterAddress">
|
||||
<div class="row-content">
|
||||
<p class="list-group-item-text">{{node.id}}</p>
|
||||
|
||||
<!--<p class="list-group-item-text">Maecenas sed diam eget risus varius blandit.</p>-->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-9">
|
||||
<div class="panel-heading c_blueGrey300">
|
||||
<h3 class="panel-title">Network</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div id="mynetwork" style="height:800px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
104
web/views/addressNetwork/addressNetwork.js
Normal file
104
web/views/addressNetwork/addressNetwork.js
Normal file
@@ -0,0 +1,104 @@
|
||||
'use strict';
|
||||
|
||||
angular.module('app.addressNetwork', ['ngRoute'])
|
||||
|
||||
.config(['$routeProvider', function($routeProvider) {
|
||||
$routeProvider.when('/addressNetwork', {
|
||||
templateUrl: 'views/addressNetwork/addressNetwork.html',
|
||||
controller: 'AddressNetworkCtrl'
|
||||
});
|
||||
}])
|
||||
|
||||
.controller('AddressNetworkCtrl', function($scope, $http, $routeParams) {
|
||||
$scope.data = [];
|
||||
$scope.addresses;
|
||||
$scope.nodes = [];
|
||||
$scope.edges = [];
|
||||
$scope.selectedNode = {};
|
||||
var nodes, edges, container, network;
|
||||
var options = {
|
||||
layout: {
|
||||
improvedLayout: false
|
||||
},
|
||||
interaction: {
|
||||
hover: true
|
||||
},
|
||||
physics: {
|
||||
stabilization: false,
|
||||
//enabled: false
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
$scope.showMap = function() {
|
||||
var nodes = $scope.nodes;
|
||||
var edges = $scope.edges;
|
||||
|
||||
var container = document.getElementById('mynetwork');
|
||||
var data = {
|
||||
nodes: nodes,
|
||||
edges: edges
|
||||
};
|
||||
network = new vis.Network(container, data, options);
|
||||
network.on("click", function(params) {
|
||||
params.event = "[original event]";
|
||||
//$scope.selectedNode = JSON.stringify(params, null, 4);
|
||||
$scope.selectedNode = params;
|
||||
console.log($scope.selectedNode);
|
||||
console.log($scope.selectedNode.nodes);
|
||||
var options = {
|
||||
// position: {x:positionx,y:positiony}, // this is not relevant when focusing on nodes
|
||||
scale: 1,
|
||||
offset: {
|
||||
x: 0,
|
||||
y: 0
|
||||
},
|
||||
animation: {
|
||||
duration: 500,
|
||||
easingFunction: "easeInOutQuad"
|
||||
}
|
||||
};
|
||||
network.focus($scope.selectedNode.nodes[0], options);
|
||||
//console.log('click event, getNodeAt returns: ' + this.getNodeAt(params.pointer.DOM));
|
||||
});
|
||||
};
|
||||
$http.get(urlapi + 'alladdresses')
|
||||
.then(function(data, status, headers, config) {
|
||||
console.log('data success');
|
||||
console.log(data);
|
||||
$scope.addresses = data.data;
|
||||
}, function(data, status, headers, config) {
|
||||
console.log('data error');
|
||||
});
|
||||
|
||||
$scope.getAddressNetwork = function(address) {
|
||||
console.log(address);
|
||||
$http.get(urlapi + 'address/network/' + address.id)
|
||||
.then(function(data, status, headers, config) {
|
||||
console.log('data success');
|
||||
console.log(data);
|
||||
$scope.nodes = data.data.nodes;
|
||||
$scope.edges = data.data.edges;
|
||||
$scope.showMap();
|
||||
}, function(data, status, headers, config) {
|
||||
console.log('data error');
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
$scope.focusNode = function(node) {
|
||||
var options = {
|
||||
// position: {x:positionx,y:positiony}, // this is not relevant when focusing on nodes
|
||||
scale: 1,
|
||||
offset: {
|
||||
x: 0,
|
||||
y: 0
|
||||
},
|
||||
animation: {
|
||||
duration: 500,
|
||||
easingFunction: "easeInOutQuad"
|
||||
}
|
||||
};
|
||||
network.focus(node.id, options);
|
||||
};
|
||||
});
|
||||
Reference in New Issue
Block a user