टेक्स्ट की तुलना करें

दो टेक्स्ट फ़ाइलों के बीच अंतर ढूंढें

रियल-टाइम एडिटर
रिक्त स्थान छिपाएँ
अपरिवर्तित संक्षिप्त करें
लाइन रैप बंद
लेआउट
परिवर्तन हाइलाइट करें
टेक्स्ट शैलियां
सिंटैक्स हाइलाइटिंग

Untitled diff

बनाया गया Diff कभी समाप्त नहीं होता
20 हटाए गए
162 लाइनें
22 जोड़े गए
164 लाइनें
var params = {};
var params = {};
params.width = 320;
params.width = 320;
params.height = 320;
params.height = 320;
params.more = 31;
params.more = 31;
params.container = '.network';
params.container = '.network';
params.nodes = [
params.nodes = [
{
{
"name": "Karnataka",
"name": "Karnataka",
"value": 16
"value": 16
},
},
{
{
"name": "Uttar Pradesh(East)",
"name": "Uttar Pradesh(East)",
"value": 22,
"value": 22,
},
},
{
{
"name": "Uttar Pradesh East",
"name": "Uttar Pradesh East",
"value": 31
"value": 31
},
},
{
{
"name": "Delhi",
"name": "Delhi",
"value": 55
"value": 55
},
},
{
{
"name": "Andhra Pradesh",
"name": "Andhra Pradesh",
"value": 108
"value": 108
}
}
];
];


var data = params.nodes;
var data = params.nodes;
var margin = {top: 0, right: 40, bottom: 40, left: 60};
var margin = {top: 0, right: 40, bottom: 40, left: 60};
var width = params.width - margin.right - margin.left;
var width = params.width - margin.right - margin.left;
var height = params.height - margin.top - margin.bottom;
var height = params.height - margin.top - margin.bottom;
var left = 5;
var left = 5;
var top = 5;
var top = 5;
var axisLeft = 20;
var axisLeft = 20;


var svg = d3.select(params.container)
var svg = d3.select(params.container)
.select('svg')
.select('svg')
.attr('width', width + margin.right + margin.left)
.attr('width', width + margin.right + margin.left)
.attr('height', height + margin.top + margin.bottom)
.attr('height', height + margin.top + margin.bottom)
.select('g')
.select('g')
.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');


// Remove any other chart
// Remove any other chart
svg.selectAll('*').remove();
svg.selectAll('*').remove();


// set the ranges
// set the ranges
var yScale = d3.scaleBand()
var yScale = d3.scaleBand()
.range([height, 0])
.range([height, 0])
.padding(0.1);
.padding(0.1);


var xScale = d3.scaleLinear()
var xScale = d3.scaleLinear()
.range([0, width]);
.range([0, width]);
// Scale the range of the data in the domains
// Scale the range of the data in the domains
xScale.domain([0, d3.max(data, function(d) { return d.value; })]);
xScale.domain([0, d3.max(data, function(d) { return d.value; })]);
yScale.domain(data.map(function(d) { return d.name; }));
yScale.domain(data.map(function(d) { return d.name; }));


var yAxis = d3.axisLeft(yScale);
var yAxis = d3.axisLeft(yScale);
var bar = svg.selectAll('g')
var bar = svg
.data(data)
.enter()
.append('g')
.append('g')
.attr('class', 'y axis')
.attr('class', 'y axis')
.attr('transform', 'translate(' + axisLeft + ',0)')
.attr('transform', 'translate(' + axisLeft + ',0)')
.call(yAxis);
.call(yAxis)



svg.selectAll('.tick text')
svg.selectAll('.tick text')
.attr('dy', '.35em')
.attr('dy', '.35em')
.text(function(d) {
.text(function(d) {
if (d.length > 20) {
if (d.length > 20) {
return d.substring(0, 20) + '...';
return d.substring(0, 20) + '...';
}
}
return d;
return d;
})
})
.attr('transform', function(d) {
.attr('transform', function(d) {
var name = d;
var name = d;
if (d.length > 20) {
if (d.length > 20) {
name = d.substring(0, 20) + '...';
name = d.substring(0, 20) + '...';
}
}
var names = name.split(' ');
var names = name.split(' ');
return 'translate(0,' + (-names.length / 2) * 10 + ')';
return 'translate(0,' + (-names.length / 2) * 10 + ')';
})
})
.call(wrap, 50)
.call(wrap, 50)
.on('click', function(d) {
.on('click', function(d) {
//$scope.$broadcast('bar:clicked', d);
//$scope.$broadcast('bar:clicked', d);
});
});


// append the rectangles for the bar chart
// append the rectangles for the bar chart
bar.append('rect')
bar
.selectAll('rect')
.data(data)
.enter()
.append('rect')
.attr('class', 'barChart')
.attr('class', 'barChart')
.attr('x', left)
.attr('x', left)
.attr('width', function(d) { return xScale(d.value); })
.attr('width', function(d) { return xScale(d.value); })
.attr('y', function(d) { return yScale(d.name) + yScale.bandwidth() / 4; })
.attr('y', function(d) { return yScale(d.name) + yScale.bandwidth() / 4; })
.attr('height', yScale.bandwidth() / 2)
.attr('height', yScale.bandwidth() / 2)
.attr('fill', 'black')
.attr('fill', 'black')
//.attr('fill', function(d) { return $scope.getBubbleFill(d); })
//.attr('fill', function(d) { return $scope.getBubbleFill(d); })
.on('click', function(d) {
.on('click', function(d) {
//$scope.$broadcast('bar:clicked', d.name);
//$scope.$broadcast('bar:clicked', d.name);
});
});


bar.append('text')
.attr('class', 'label')
.attr('fill', 'white')
.attr('text-anchor', function(d) {
return xScale(d.value) < 20 ? 'middle' : 'end';
})
.attr('x', function(d) {
return xScale(d.value);
})
.attr('y', function(d) {
return yScale(d.name) + (yScale.bandwidth() / 2 + top);
})
.on('click', function(d) {
//$scope.$broadcast('bar:clicked', d.name);
});
if (params.more) {
if (params.more) {
bar.append('text')
bar.append('text')
.attr('class', 'label')
.attr('class', 'label')
.attr('fill', 'white')
.attr('fill', 'white')
.text(function() { return '+' + params.more + ' more'; })
.text(function() { return '+' + params.more + ' more'; })
.attr('transform', 'translate(' + 0 + ',' + (height + 20) + ')')
.attr('transform', 'translate(' + 0 + ',' + (height + 20) + ')')
.on('click', function(d) {
.on('click', function(d) {
//$scope.gotoExplore(d);
//$scope.gotoExplore(d);
});
});
}
}




function wrap(text, width) {
function wrap(text, width) {
text.each(function() {
text.each(function() {
var text = d3.select(this); // eslint-disable-line no-invalid-this
var text = d3.select(this); // eslint-disable-line no-invalid-this
var words = text.text()
var words = text.text()
.split(/\s+/)
.split(/\s+/)
.reverse();
.reverse();
var word;
var word;
var line = [];
var line = [];
var lineHeight = 1.1;
var lineHeight = 1.1;
var lineNumber = 0;
var lineNumber = 0;
var y = 0;
var y = 0;
var x = 0;
var x = 0;
// var dy = 0;
// var dy = 0;
var tspan = text.text(null)
var tspan = text.text(null)
.append('tspan')
.append('tspan')
.attr('x', x)
.attr('x', x)
.attr('y', y);
.attr('y', y)
.text('1');
var tspanHeight = tspan.node().getBBox().height;;

word = words.pop();
word = words.pop();
while (word) {
while (word) {
line.push(word);
line.push(word);
tspan.text(line.join(' '));
tspan.text(line.join(' '));
if (tspan.node().getComputedTextLength() > width - x) {
if (tspan.node().getComputedTextLength() > width - x) {
line.pop();
line.pop();
tspan.text(line.join(' '));
tspan.text(line.join(' '));
line = [word];
line = [word];
lineNumber += 1;
lineNumber += 1;
tspan = text.append('tspan')
tspan = text.append('tspan')
.attr('x', x)
.attr('x', x)
.attr('dy', lineHeight + 'em')
.attr('dy', lineHeight + 'em')
.text(word);
.text(word);
}
}
word = words.pop();
word = words.pop();
}
}
var textHeight = text.node().getBBox().height;
console.log('tspanHeight', tspanHeight)
console.log('textHeight', textHeight)
var yTransition = textHeight / 2 - tspanHeight / 2;
text.attr('transform', 'translate(-10,-'+ yTransition +')')
});
});
};
};
सेव किए गए Diffs