Angular dc.js滤波器问题
Angular dc.js滤波器问题
提问于 2015-08-16 19:49:07
我正在使用这个angular addon和Angular一起使用dc.js图表。
我正在使用这个带有自定义行为的example，我添加了一个输入框，以便从输入框的值中过滤运行值，angular正在捕捉变量的变化，但dc.js没有相应地过滤。
下面是我的自定义html和js：
<!DOCTYPE html>
<html lang="en">
<head>
<title>dc.js - Pie Chart Example</title>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="//dc-js.github.io/dc.js/css/dc.css"/>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.min.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/d3/3.4.4/d3.min.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/crossfilter/1.3.7/crossfilter.min.js"></script>
<script type="text/javascript" src="//dc-js.github.io/dc.js/js/dc.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.15/angular.min.js"></script>
<script type="text/javascript" src="/angular-dc/dist/angular-dc.min.js"></script>
</head>
<body ng-app="app">
<!-- we nicely separate the view and the data. Here, all information concerning the way to display the data
is in the template -->
<div ng-controller="myController" dc-chart="pieChart" dc-chart-group="1"
dc-width="780" dc-height="480" dc-inner-radius="100"
dc-slices-cap="4"
dc-dimension="runDimension" dc-group="speedSumGroup"
dc-legend="dc.legend()">
<input name="calypso" ng-model="calypso">
<p>{{calypso}}</p>
</div>
<script type="text/javascript">
var myApp = angular.module("app", ["angularDc"]);
myApp.controller('myController', ['$scope', function ($scope, Data) {
$scope.Data = Data;
d3.csv("morley.csv", function(error, experiments) {
var ndx = $scope.ndx = crossfilter(experiments)
$scope.runDimension = ndx.dimension(function(d) {return d.Run;})
$scope.speedSumGroup = $scope.runDimension.group().reduceSum(function(d) {return d.Speed * d.Run;});
// for simplicity we use d3.csv, but normally, we should use $http in order for this
// to be called in the $digest
//$scope.$apply()
$scope.$watch('calypso', function() {
console.log(parseInt($scope.calypso,10));
$scope.runDimension.filter(parseInt($scope.calypso,10));
});
$scope.$apply();
});
}]);
</script>
</body>
</html>
回答 1
Stack Overflow用户
发布于 2015-08-16 22:54:06
您是否有权访问全局命名空间中的dc对象？还是通过指令？我假设你需要调用dc.redrawAll() (documented here)，因为在你以某种方式通知dc.js图表/指令之前，它们不会意识到你改变了交叉过滤器上的过滤器。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/32034746
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号