playground
/
c3
mirror of https://github.com/masayuki0812/c3.git
1
0
Fork 0
Code Issues Releases Activity
Browse Source

Add 'length' and 'to' options to flow - #207

pull/263/merge
Masayuki Tanaka 11 years ago
parent
759197fb27
commit
76cff82291
4 changed files with 67 additions and 42 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 53
      c3.js
  2. 4
      c3.min.js
  3. 8
      htdocs/samples/api_flow.html
  4. 14
      htdocs/samples/api_flow_timeseries.html

53
c3.js
Unescape View File

@ -2478,15 +2478,16 @@
area = __axis_rotated ? area.x0(value0).x1(value1).y(xx) : area.x(xx).y0(value0).y1(value1);
return function (d) {
var data = filterRemoveNull(d.values), x0, y0;
var data = filterRemoveNull(d.values), x0, y0, path;
if (isAreaType(d)) {
return area.interpolate(getInterpolate(d))(data);
path = area.interpolate(getInterpolate(d))(data);
} else {
x0 = x(data[0].x);
y0 = getYScale(d.id)(data[0].value);
return __axis_rotated ? "M " + y0 + " " + x0 : "M " + x0 + " " + y0;
path = __axis_rotated ? "M " + y0 + " " + x0 : "M " + x0 + " " + y0;
}
return path ? path : "M 0 0";
};
}
@ -2503,20 +2504,21 @@
if (!__line_connect_null) { line = line.defined(function (d) { return d.value != null; }); }
return function (d) {
var data = __line_connect_null ? filterRemoveNull(d.values) : d.values,
x = isSub ? x : subX, y = yScaleGetter(d.id), x0 = 0, y0 = 0;
x = isSub ? x : subX, y = yScaleGetter(d.id), x0 = 0, y0 = 0, path;
if (isLineType(d)) {
if (__data_regions[d.id]) {
return lineWithRegions(data, x, y, __data_regions[d.id]);
path = lineWithRegions(data, x, y, __data_regions[d.id]);
} else {
return line.interpolate(getInterpolate(d))(data);
path = line.interpolate(getInterpolate(d))(data);
}
} else {
if (data[0]) {
x0 = x(data[0].x);
y0 = y(data[0].value);
}
return __axis_rotated ? "M " + y0 + " " + x0 : "M " + x0 + " " + y0;
path = __axis_rotated ? "M " + y0 + " " + x0 : "M " + x0 + " " + y0;
}
return path ? path : "M 0 0";
};
}
@ -3408,7 +3410,7 @@
}
function redraw(options, transitions) {
var xgrid, xgridAttr, xgridData, xgridLines, xgridLine, ygrid, ygridLines, ygridLine;
var xgrid, xgridAttr, xgridData, xgridLines, xgridLine, ygrid, ygridLines, ygridLine, flushXGrid;
var mainLine, mainArea, mainCircle, mainBar, mainArc, mainRegion, mainText, contextLine, contextArea, contextBar, eventRect, eventRectUpdate;
var areaIndices = getShapeIndices(isAreaType), barIndices = getShapeIndices(isBarType), lineIndices = getShapeIndices(isLineType), maxDataCountTarget, tickOffset;
var rectX, rectW;
@ -3542,8 +3544,6 @@
// grid
main.select('line.' + CLASS.xgridFocus).style("visibility", "hidden");
if (__grid_x_show) {
xgridData = generateGridData(__grid_x_type, x);
tickOffset = isCategorized ? xAxis.tickOffset() : 0;
xgridAttr = __axis_rotated ? {
'x1': 0,
'x2': width,
@ -3555,12 +3555,20 @@
'y1': margin.top,
'y2': height
};
// this is used to flow
flushXGrid = function (withoutUpdate) {
xgridData = generateGridData(__grid_x_type, x);
tickOffset = isCategorized ? xAxis.tickOffset() : 0;
xgrid = main.select('.' + CLASS.xgrids).selectAll('.' + CLASS.xgrid)
.data(xgridData);
xgrid.enter().append('line').attr("class", CLASS.xgrid);
if (!withoutUpdate) {
xgrid.attr(xgridAttr)
.style("opacity", function () { return +d3.select(this).attr(__axis_rotated ? 'y1' : 'x1') === (__axis_rotated ? height : 0) ? 0 : 1; });
}
xgrid.exit().remove();
};
flushXGrid();
}
if (notEmpty(__grid_x_lines)) {
xgridLines = main.select('.' + CLASS.xgridLines).selectAll('.' + CLASS.xgridLine)
@ -4009,13 +4017,12 @@
// update x domain to generate axis elements for flow
updateXDomain(targetsToShow, true, true);
// update elements related to x scale
flushXGrid(true);
// generate transform to flow
translateX = x(flowStart.x) - x(flowEnd.x);
if (isTimeSeries) {
translateX = translateX * 0.9; // TODO: fix 0.9, I don't know why 0.9..
translateX = (x(flowStart.x) - x(flowEnd.x)) * (isTimeSeries ? 0.9 : 1); // TODO: fix 0.9, I don't know why 0.9..
scaleX = (diffDomain(orgDomain) / diffDomain(x.domain()));
}
transform = 'translate(' + translateX + ',0) scale(' + scaleX + ',1)';
d3.transition().ease('linear').duration(durationForFlow).each(function () {
@ -4033,6 +4040,7 @@
var i, shapes = [], texts = [], eventRects = [];
// remove flowed elements
if (flowLength) {
for (i = 0; i < flowLength; i++) {
shapes.push('.' + CLASS.shape + '-' + (flowIndex + i));
texts.push('.' + CLASS.text + '-' + (flowIndex + i));
@ -4042,10 +4050,12 @@
svg.selectAll('.' + CLASS.texts).selectAll(texts).remove();
svg.selectAll('.' + CLASS.eventRects).selectAll(eventRects).remove();
svg.select('.' + CLASS.xgrid).remove();
}
// draw again for removing flowed elements and reverting attr
xgrid
.attr('transform', null);
.attr('transform', null)
.attr(xgridAttr);
xgridLines
.attr('transform', null);
xgridLines.select('line')
@ -4074,7 +4084,8 @@
mainRegion
.attr('transform', null);
mainRegion.select('rect').filter(isRegionOnX)
.attr("x", regionX);
.attr("x", regionX)
.attr("width", regionWidth);
eventRectUpdate
.attr("x", __axis_rotated ? 0 : rectX)
.attr("y", __axis_rotated ? rectX : 0)
@ -4827,6 +4838,16 @@
});
c3.data.targets = c3.data.targets.concat(targets); // add remained
// Update length to flow if needed
if (isDefined(args.to)) {
length = 0;
c3.data.targets[0].values.forEach(function (v) {
if (v.x <= args.to) { length++; }
});
} else if (isDefined(args.length)) {
length = args.length;
}
// Set targets
updateTargets(c3.data.targets);

4
c3.min.js vendored
View File

File diff suppressed because one or more lines are too long

8
htdocs/samples/api_flow.html
Unescape View File

@ -74,9 +74,11 @@
['data1', 200],
['data3', 100]
],
duration: 150
duration: 150,
length: 0
});
}
},
length: 2
});
}, 1000);
@ -87,7 +89,7 @@
// ['data2', 100],
['data3', 100]
],
duration: 150
to: 5,
});
}, 3000);

14
htdocs/samples/api_flow_timeseries.html
Unescape View File

@ -60,11 +60,12 @@
setTimeout(function () {
chart.flow({
columns: [
['x', '2013-01-21'],
['data1', 500],
// ['data2', 100],
['data3', 200],
]
['x', '2013-01-21', '2013-01-25'],
['data1', 500, 300],
// ['data2', 100, 100],
['data3', 200, 150],
],
min: new Date('2013-01-20'),
});
}, 1000);
@ -75,7 +76,8 @@
['data1', 200],
['data2', 100],
['data3', 100]
]
],
length: 0
});
}, 2000);

Write Preview
Loading…
Cancel
Save