Anyone using vis.js with AngularJS?

I am trying to use vis.js using AngularJS. It works fine, I created a simple directive ... But I need to use some of the events listed here here , but they do not quit.

In this example, the event listener graph.on('select', ...)does not start, are there any problems with how I do this?

That's what I'm doing:

    app.directive('visGraph', [function() {
        return {
            restrict: 'AE',
            scope: {
                data: '=data',
                options: '=options'
            },
            link: function(scope, element, attrs) {

                var container = element[0];

                var graph = null;
                    graph = new vis.Graph(container, scope.data, scope.options);


                scope.$watch(function() {
                    return scope.data; 
                }, function(value) {
                    graph = new vis.Graph(container, scope.data, scope.options);
                });

                graph.on('select', function (properties) {
                    console.info('select.properties.nodes', properties.nodes);
                    console.info('select.properties.edges', properties.edges);
                });

            }
        };
    }]);

Anyone can help?

+4
source share
2 answers

. node node. . Coffeescript, JS:

angular.module("myApp.directives").directive("visGraph", function($timeout, $window) {
  return {
    restrict: "AE",
    link: function(scope, element, attrs) {
      var buildGraph;
      buildGraph = function(scope, element) {
        var container, graph;
        container = element[0];
        graph = null;
        graph = new vis.Graph(container, scope.data, scope.options);
        return graph.on('doubleClick', function(properties) {
          if (properties.nodes.length !== 0) {
            return $window.location = FRONTEND_URL + properties.nodes;
          }
        });
      };
      // Wait for data asynchronously with $resource in the controller
      scope.$watch('data', function(newval, oldval) {
        buildGraph(scope, element);
      }, true);
    }
  };
});

$scope.data $scope.options. vis-graph.

, !

+2

() ... , ... , .

, , :

<div id="graph" vis-graph data="graph.data" options="graph.options" event="select" callback="callbackFunction(params)"></div>

repo GitHub .

!

+1

Source: https://habr.com/ru/post/1537768/


All Articles