You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
controller :
$scope.ok = function () {
$modalInstance.close();
};
$scope.cancel = function () {
$modalInstance.dismiss('cancel');
};
$scope.legends = [];
$scope.update = function(data){
console.log("asdas");
};
$scope.applyChart = function(){
$scope.chart();
$scope.digest();
}
$scope.chart = function(){
// Set the dimensions of the canvas / graph
var margin = {
top : 30,
right : 20,
bottom : 70,
left : 50
}, width = 600 - margin.left - margin.right, height = 300 - margin.top
- margin.bottom;
// Parse the date / time
var parseDate = d3.time.format("%d-%b-%y").parse;
// Set the ranges
var x = d3.time.scale().range([ 0, width ]);
var y = d3.scale.linear().range([ height, 0 ]);
// set the colour scale
var color = d3.scale.category10();
// Define the axes
var xAxis = d3.svg.axis().scale(x).orient("bottom").ticks(5);
var yAxis = d3.svg.axis().scale(y).orient("left").ticks(5);
// Define the line
var valueline = d3.svg.line().x(function(d) {
return x(d.Date);
}).y(function(d) {
return y(d.Number);
});
// Adds the svg canvas
var canvas = d3.select("#chart").append("svg").attr("width",
width + margin.left + margin.right).attr("height",
height + margin.top + margin.bottom).append("g").attr("transform",
"translate(" + margin.left + "," + margin.top + ")");
var legend = d3.select("#legend");
// Get the data
d3
.json(
"app/module/esa/assignment-listing-details/testData.json",
function(data) {
var keys = [];
var counter = 0;
var set=[];
data.forEach(function(d) {
d.Date = parseDate(d.Date);
d.Number = +d.Number;
});
// Scale the range of the data
x.domain(d3.extent(data, function(d) {
return d.Date;
}));
y.domain([ d3.min(data, function(d) {
return d.Number;
}), d3.max(data, function(d) {
return d.Number;
}) ]);
// Nest the entries by symbol
var dataNest = d3.nest().key(function(d) {
return d.Legend;
}).entries(data);
legendSpace = width / dataNest.length; // spacing for the legend
// Loop through each symbol / key
dataNest
.forEach(function(d, i) {
canvas.append("path").attr("class", "line")
.style("stroke", function() { // Add the colours dynamically
return d.color = color(d.key);
}).attr("id", 'tag' + d.key) // assign ID
.attr("d", valueline(d.values))
.attr("show","true");
// Add the Legend
canvas
.append("text")
.attr(
"x",
legendSpace / 2 + i
* legendSpace)
// space legend
.attr("y", height + 50)
.attr("class", "legend")
// style the legend
.style("fill", function() { // Add the colours dynamically
return d.color = color(d.key);
})
.on(
"click",
function() {
// Determine if current line is visible
var active = d.active ? false
: true, newOpacity = active ? 0
: 1;
// Hide or show the elements based on the ID
d3
.select(
"#tag"
+ d.key)
.style(
"opacity",
newOpacity);
// Update whether or not the elements are active
d.active = active;
}).text(d.key);
keys[counter] = d.key;
set[counter] = d;
$scope.legends[counter] ={name: d.key, maker: d.key, ticked: false};
counter++;
});
legend
.on("change",
function() {
var value = document.getElementById("legend").value;
var tag = document.getElementById("tag"+value);
var show = tag.getAttribute("show")
var newShow = true;
if(show == "true")
{
newShow = false;
}
else{
newShow = true;
}
var newOpacity = newShow ? 1 : 0 ;
// Hide or show the elements based on the ID
d3
.select(
"#tag"
+ value)
.style(
"opacity",
newOpacity);
// Update whether or not the elements are active
tag.setAttribute("show",newShow);
})
.selectAll("option").data(keys)
.enter().append("option")
.attr("id",String)
.text(String);
});
// Add the X Axis
canvas.append("g").attr("class", "x axis").attr(
"transform", "translate(0," + height + ")")
.call(xAxis);
// Add the Y Axis
canvas.append("g").attr("class", "y axis").call(yAxis);
};
The text was updated successfully, but these errors were encountered:
html :
controller :
$scope.ok = function () {
$modalInstance.close();
};
$scope.cancel = function () {
$modalInstance.dismiss('cancel');
};
$scope.legends = [];
$scope.update = function(data){
console.log("asdas");
};
$scope.applyChart = function(){
$scope.chart();
$scope.digest();
}
$scope.chart = function(){
// Set the dimensions of the canvas / graph
var margin = {
top : 30,
right : 20,
bottom : 70,
left : 50
}, width = 600 - margin.left - margin.right, height = 300 - margin.top
- margin.bottom;
};
The text was updated successfully, but these errors were encountered: