Skip to content

Commit

Permalink
Merge "Related-Bug: #1533202"
Browse files Browse the repository at this point in the history
  • Loading branch information
Zuul authored and opencontrail-ci-admin committed Jan 24, 2016
2 parents 1a01b33 + a456857 commit 06560af
Show file tree
Hide file tree
Showing 2 changed files with 72 additions and 18 deletions.
59 changes: 55 additions & 4 deletions webroot/js/models/ZoomScatterChartModel.js
Original file line number Diff line number Diff line change
Expand Up @@ -74,8 +74,13 @@ define([
self.width = chartConfig['width'] - margin.left - margin.right;
self.height = chartConfig['height'] - margin.top - margin.bottom;

forceX = cowu.getForceAxis4Chart(chartData, chartConfig.xField, chartConfig.forceX);
forceY = cowu.getForceAxis4Chart(chartData, chartConfig.yField, chartConfig.forceY);
if(chartConfig['doBucketize'] == true) {
forceX = getAxisMinMaxForBucketization(chartData, chartConfig.xField, chartConfig.forceX);
forceY = getAxisMinMaxForBucketization(chartData, chartConfig.yField, chartConfig.forceY);
} else {
forceX = cowu.getForceAxis4Chart(chartData, chartConfig.xField, chartConfig.forceX);
forceY = cowu.getForceAxis4Chart(chartData, chartConfig.yField, chartConfig.forceY);
}

self.xMin = forceX[0];
self.xMax = forceX[1];
Expand All @@ -95,12 +100,20 @@ define([
//Set tickFormat only if specified
self.xAxis = d3.svg.axis().scale(self.xScale).orient("bottom").ticks(10)
.tickSize(-self.height)
if(chartConfig.xLabelFormat != null)
// .outerTickSize(0)
if(chartConfig['doBucketize'] == false) {
self.xAxis.tickFormat(chartConfig.xLabelFormat);
} else if(chartConfig.xLabelFormat != null) {
self.xAxis.tickFormat(chartConfig.xLabelFormat);
}
self.yAxis = d3.svg.axis().scale(self.yScale).orient("left").ticks(5)
.tickSize(-self.width)
if(chartConfig.yLabelFormat)
// .outerTickSize(0)
if(chartConfig['doBucketize'] == false) {
self.yAxis.tickFormat(chartConfig.yLabelFormat)
} else if(chartConfig.yLabelFormat != null) {
self.yAxis.tickFormat(chartConfig.yLabelFormat)
}

self.xMed = median(_.map(chartData, function (d) {
return d[chartConfig.xField];
Expand All @@ -120,6 +133,44 @@ define([
* Start: Bucketization functions
*/

function getAxisMinMaxForBucketization(chartData, fieldName, forceAxis) {
var axisMin = 0, axisMax;

//If all nodes are closer,then adding 10% buffer on edges makes them even closer
if(chartData.length > 0) {
axisMax = d3.max(chartData, function (d) {
return +d[fieldName];
});
axisMin = d3.min(chartData, function (d) {
return +d[fieldName];
});

if (axisMax == null) {
axisMax = 1;
}

if (axisMin == null) {
axisMin = 0;
}

} else {
axisMax = 1;
axisMin = 0;
}

if (forceAxis) {
if (axisMin > forceAxis[0]) {
axisMin = forceAxis[0];
}

if (axisMax < forceAxis[1]) {
axisMax = forceAxis[1];
}
}

return [axisMin, axisMax];
};

function doBucketization(data,chartOptions){
var data = $.extend(true,[],data);
var retData = [];
Expand Down
31 changes: 17 additions & 14 deletions webroot/js/views/ZoomScatterChartView.js
Original file line number Diff line number Diff line change
Expand Up @@ -25,8 +25,11 @@ define([
}

if (self.model != null) {
if(self.model.loadedFromCache == true)
if(cfDataSource == null) {
self.renderChart(selector, viewConfig, self.model);
} else if(self.model.loadedFromCache == true) {
self.renderChart(selector, viewConfig, self.model);
}

if(cfDataSource != null) {
cfDataSource.addCallBack('updateChart',function(data) {
Expand Down Expand Up @@ -139,9 +142,9 @@ define([

chartSVG = d3.select($(chartSelector)[0]).append("svg")
.attr("class", "zoom-scatter-chart")
.attr("width", width + margin.left + margin.right + maxCircleRadius)
.attr("height", height + margin.top + margin.bottom)
.attr("viewbox", '0 0 ' + (width + margin.left + margin.right + maxCircleRadius) + ' ' + (height + margin.top + margin.bottom + maxCircleRadius))
.attr("width", width + margin.left + margin.right + (2*maxCircleRadius))
.attr("height", height + margin.top + margin.bottom + (2*maxCircleRadius))
.attr("viewbox", '0 0 ' + (width + margin.left + margin.right + (2*maxCircleRadius)) + ' ' + (height + margin.top + margin.bottom + (2*maxCircleRadius)))
.append("g")
.attr("transform", "translate(" + margin.left + "," + margin.top + ")")
.call(chartView.zm)
Expand All @@ -163,31 +166,31 @@ define([
}

chartSVG.append("rect")
.attr("width", width + maxCircleRadius)
.attr("height", height)
.attr("width", width + (2*maxCircleRadius))
.attr("height", height + (2*maxCircleRadius))
.append("g")
.attr("transform", "translate(" + maxCircleRadius + ",0)")
.attr("transform", "translate(" + maxCircleRadius + "," + maxCircleRadius + ")")

chartSVG.append("g")
.attr("class", "x axis")
.attr("transform", "translate(" + maxCircleRadius + "," + height + ")")
.attr("transform", "translate(" + maxCircleRadius + "," + (height + maxCircleRadius) + ")")
.call(chartModel.xAxis)
.selectAll("text")
.attr("x", 0)
.attr("y", 8);

chartSVG.append("g")
.attr("class", "y axis")
.attr("transform", "translate(" + maxCircleRadius + ",0)")
.attr("transform", "translate(" + maxCircleRadius + "," + maxCircleRadius + ")")
.call(chartModel.yAxis)
.selectAll("text")
.attr("x", -8)
.attr("y", 0);

viewObjects = chartSVG.append("svg")
.attr("class", "objects")
.attr("width", width + maxCircleRadius)
.attr("height", height + maxCircleRadius);
.attr("width", width + (2*maxCircleRadius))
.attr("height", height + (2*maxCircleRadius));

chartSVG.append("text")
.attr("class", "x label")
Expand Down Expand Up @@ -268,7 +271,7 @@ define([
.attr("y", 0);

chartSVG.selectAll("circle").attr("transform", function (d) {
return "translate(" + (chartModel.xScale(d[chartConfig.xField]) + maxCircleRadius) + "," + chartModel.yScale(d[chartConfig.yField]) + ")";
return "translate(" + (chartModel.xScale(d[chartConfig.xField]) + maxCircleRadius) + "," + (chartModel.yScale(d[chartConfig.yField]) + maxCircleRadius) + ")";
});
}, true);
d3.event.stopPropagation();
Expand Down Expand Up @@ -510,7 +513,7 @@ define([
if(headerElem != null && cfDataSource != null) {
var filteredCnt = cfDataSource.getFilteredRecordCnt(),
totalCnt = cfDataSource.getRecordCnt();
var infoElem = $(headerElem);
var infoElem = ifNull($($(headerElem).contents()[1]),$(headerElem));
var innerText = infoElem.text().split('(')[0].trim();
if (cfDataSource.getFilter('chartFilter') == null) {
//Hide filter container
Expand Down Expand Up @@ -1068,7 +1071,7 @@ define([
function getChartConfig(selector, chartOptions) {
var margin = $.extend(true, {}, {top: 20, right: 5, bottom: 50, left: 50}, chartOptions['margin']),
chartSelector = $(selector).find('.chart-container'),
width = $(chartSelector).width() - 10,
width = $(chartSelector).width() - 20,
height = 275;

var chartViewConfig = {
Expand Down

0 comments on commit 06560af

Please sign in to comment.