AngularJS 应用程序中的 D3

使用AngularJS和D3创建交互式数据可视化

html

javascript
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
  // 在这里处理数据
});

javascript
app.controller('myCtrl', function($scope) {
  var svg = d3.select("body")
              .append("svg")
              .attr("width", 500)
              .attr("height", 500);
  var data = [10, 20, 30, 40, 50];
  svg.selectAll("circle")
     .data(data)
     .enter()
     .append("circle")
     .attr("cx", function(d, i) {
        return i * 50 + 50;
     })
     .attr("cy", 250)
     .attr("r", function(d) {
        return d;
     })
     .attr("fill", "blue");
});

html
  
  
  
  
  

javascript
app.controller('myCtrl', function($scope) {
  // ...
  $scope.data = [10, 20, 30, 40, 50];
});