mirror of
https://github.com/bendtherules/chart-builder-demo.git
synced 2026-08-18 13:42:05 +00:00
Add plot random button
This commit is contained in:
+16
@@ -43,6 +43,9 @@ app.value("allData",{
|
||||
|
||||
|
||||
app.controller("mainController", ["allData","$scope",function (allData,$scope) {
|
||||
init();
|
||||
|
||||
function init() {
|
||||
$scope.data = {};
|
||||
$scope.data.chooserDimensions = allData.dimensions;
|
||||
$scope.data.chosenDimension = undefined;
|
||||
@@ -50,6 +53,7 @@ app.controller("mainController", ["allData","$scope",function (allData,$scope) {
|
||||
$scope.data.chosenMeasure = undefined;
|
||||
|
||||
$scope.data.values = allData.values;
|
||||
}
|
||||
|
||||
$scope.allowDrop = function(ev,location) {
|
||||
// var prevLocation = ev.dataTransfer.getData("location");
|
||||
@@ -128,4 +132,16 @@ app.controller("mainController", ["allData","$scope",function (allData,$scope) {
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function getRandomInt(min, max) {
|
||||
return Math.floor(Math.random() * (max - min + 1)) + min;
|
||||
}
|
||||
|
||||
$scope.plotRandom = function () {
|
||||
var indexDimension = getRandomInt(0,($scope.data.chooserDimensions.length - 1));
|
||||
var indexMeasure = getRandomInt(0,($scope.data.chooserMeasures.length - 1));
|
||||
|
||||
moveData("chooser.dimension","chosen.dimension", $scope.data.chooserDimensions[indexDimension]);
|
||||
moveData("chooser.measure","chosen.measure", $scope.data.chooserMeasures[indexMeasure]);
|
||||
}
|
||||
}]);
|
||||
|
||||
@@ -8,7 +8,7 @@ app.directive("dynamicChart", function (d3Tip) {
|
||||
$scope.chartTypeChosen = $scope.chartTypes[0];
|
||||
|
||||
$scope.$watch("[chartData,chartAxisLabel,chartTypeChosen]",function(){
|
||||
console.log([$scope.chartData,$scope.chartAxisLabel]);
|
||||
// console.log([$scope.chartData,$scope.chartAxisLabel]);
|
||||
if ($scope.chartTypeChosen && $scope.chartData){
|
||||
drawChart($scope.chartTypeChosen,$scope.chartData,$scope.chartAxisLabel);
|
||||
}
|
||||
@@ -300,7 +300,7 @@ app.directive("dynamicChart", function (d3Tip) {
|
||||
var indexDirection = Math.floor(midAngle/360 *8);
|
||||
|
||||
var direction = availableDirection[indexDirection];
|
||||
console.log(direction);
|
||||
// console.log(direction);
|
||||
return direction;
|
||||
})
|
||||
.offset(function (d) {
|
||||
@@ -312,8 +312,8 @@ app.directive("dynamicChart", function (d3Tip) {
|
||||
var extraRadius = 15;
|
||||
var posCentre = [-extraRadius*Math.sin(midAngle),-extraRadius*Math.cos(midAngle)];
|
||||
|
||||
console.log(midAngle*180/Math.PI);
|
||||
console.log(posCentre);
|
||||
// console.log(midAngle*180/Math.PI);
|
||||
// console.log(posCentre);
|
||||
return posCentre;
|
||||
});
|
||||
|
||||
|
||||
+3
-2
@@ -5,11 +5,11 @@
|
||||
<title>Chart Builder</title>
|
||||
<link rel="stylesheet" href="styles/style.css">
|
||||
</head>
|
||||
<body ng-app="chart-builder">
|
||||
<body ng-app="chart-builder" ng-controller="mainController">
|
||||
<div class="header">
|
||||
Chart Builder
|
||||
</div>
|
||||
<div class="content" ng-controller="mainController">
|
||||
<div class="content">
|
||||
<div class="sidebar chooser">
|
||||
<div class="chooser-dim" ng-drop="drop($event,'chooser.dimension')" ng-dragover="allowDrop($event,'chooser.dimension')">
|
||||
<div class="dim-header"> Dimensions </div>
|
||||
@@ -57,6 +57,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<input type="button" class="plot-btn" ng-click="plotRandom()" value="Plot something"></input>
|
||||
<script type="text/javascript" src="./lib/d3.v4.min.js"></script>
|
||||
<script type="text/javascript" src="./lib/d3-tip.js"></script>
|
||||
<script type="text/javascript" src="./lib/angular.min.js"></script>
|
||||
|
||||
@@ -131,3 +131,10 @@ li[draggable] {
|
||||
padding: .25em .5em;
|
||||
margin: .5em 0;
|
||||
}
|
||||
|
||||
.plot-btn
|
||||
{
|
||||
position: absolute;
|
||||
left: 1em;
|
||||
top: 1em;
|
||||
}
|
||||
Reference in New Issue
Block a user