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

Merge branch 'pr/1650' into dev

pull/1675/head
Ændrew Rininsland 9 years ago
parent
99e6f7cc89 305ed6dc76
commit
6fb9c0a871
10 changed files with 132 additions and 47 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 51
      c3.js
  2. 10
      c3.min.js
  3. 45
      spec/axis-spec.js
  4. 4
      src/api.load.js
  5. 23
      src/axis.js
  6. 2
      src/config.js
  7. 2
      src/core.js
  8. 28
      src/data.convert.js
  9. 2
      src/data.load.js
  10. 8
      src/size.js

51
c3.js
Unescape View File

@ -86,7 +86,7 @@
$$.initParams(); $$.initParams();
if (config.data_url) { if (config.data_url) {
$$.convertUrlToData(config.data_url, config.data_mimeType, config.data_keys, $$.initWithData); $$.convertUrlToData(config.data_url, config.data_mimeType, config.data_headers, config.data_keys, $$.initWithData);
} }
else if (config.data_json) { else if (config.data_json) {
$$.initWithData($$.convertJsonToData(config.data_json, config.data_keys)); $$.initWithData($$.convertJsonToData(config.data_json, config.data_keys));
@ -1123,6 +1123,7 @@
data_onselected: function () {}, data_onselected: function () {},
data_onunselected: function () {}, data_onunselected: function () {},
data_url: undefined, data_url: undefined,
data_headers: undefined,
data_json: undefined, data_json: undefined,
data_rows: undefined, data_rows: undefined,
data_columns: undefined, data_columns: undefined,
@ -1187,6 +1188,7 @@
axis_y_tick_format: undefined, axis_y_tick_format: undefined,
axis_y_tick_outer: true, axis_y_tick_outer: true,
axis_y_tick_values: null, axis_y_tick_values: null,
axis_y_tick_rotate: 0,
axis_y_tick_count: undefined, axis_y_tick_count: undefined,
axis_y_tick_time_value: undefined, axis_y_tick_time_value: undefined,
axis_y_tick_time_interval: undefined, axis_y_tick_time_interval: undefined,
@ -2020,9 +2022,15 @@
return current; return current;
}; };
c3_chart_internal_fn.convertUrlToData = function (url, mimeType, keys, done) { c3_chart_internal_fn.convertUrlToData = function (url, mimeType, headers, keys, done) {
var $$ = this, type = mimeType ? mimeType : 'csv'; var $$ = this, type = mimeType ? mimeType : 'csv';
$$.d3.xhr(url, function (error, data) { var req = $$.d3.xhr(url);
if (headers) {
Object.keys(headers).forEach(function (header) {
req.header(header, headers[header]);
});
}
req.get(function (error, data) {
var d; var d;
if (!data) { if (!data) {
throw new Error(error.responseURL + ' ' + error.status + ' (' + error.statusText + ')'); throw new Error(error.responseURL + ' ' + error.status + ' (' + error.statusText + ')');
@ -2258,7 +2266,7 @@
$$.load($$.convertDataToTargets(args.data), args); $$.load($$.convertDataToTargets(args.data), args);
} }
else if (args.url) { else if (args.url) {
$$.convertUrlToData(args.url, args.mimeType, args.keys, function (data) { $$.convertUrlToData(args.url, args.mimeType, args.headers, args.keys, function (data) {
$$.load($$.convertDataToTargets(data), args); $$.load($$.convertDataToTargets(data), args);
}); });
} }
@ -2747,12 +2755,18 @@
var $$ = this, config = $$.config, h = 30; var $$ = this, config = $$.config, h = 30;
if (axisId === 'x' && !config.axis_x_show) { return 8; } if (axisId === 'x' && !config.axis_x_show) { return 8; }
if (axisId === 'x' && config.axis_x_height) { return config.axis_x_height; } if (axisId === 'x' && config.axis_x_height) { return config.axis_x_height; }
if (axisId === 'y' && !config.axis_y_show) { return config.legend_show && !$$.isLegendRight && !$$.isLegendInset ? 10 : 1; } if (axisId === 'y' && !config.axis_y_show) {
return config.legend_show && !$$.isLegendRight && !$$.isLegendInset ? 10 : 1;
}
if (axisId === 'y2' && !config.axis_y2_show) { return $$.rotated_padding_top; } if (axisId === 'y2' && !config.axis_y2_show) { return $$.rotated_padding_top; }
// Calculate x axis height when tick rotated // Calculate x axis height when tick rotated
if (axisId === 'x' && !config.axis_rotated && config.axis_x_tick_rotate) { if (axisId === 'x' && !config.axis_rotated && config.axis_x_tick_rotate) {
h = 30 + $$.axis.getMaxTickWidth(axisId) * Math.cos(Math.PI * (90 - config.axis_x_tick_rotate) / 180); h = 30 + $$.axis.getMaxTickWidth(axisId) * Math.cos(Math.PI * (90 - config.axis_x_tick_rotate) / 180);
} }
// Calculate y axis height when tick rotated
if (axisId === 'y' && config.axis_rotated && config.axis_y_tick_rotate) {
h = 30 + $$.axis.getMaxTickWidth(axisId) * Math.cos(Math.PI * (90 - config.axis_y_tick_rotate) / 180);
}
return h + ($$.axis.getLabelPositionById(axisId).isInner ? 0 : 10) + (axisId === 'y2' ? -10 : 0); return h + ($$.axis.getLabelPositionById(axisId).isInner ? 0 : 10) + (axisId === 'y2' ? -10 : 0);
}; };
@ -4396,17 +4410,16 @@
} }
return tickValues; return tickValues;
}; };
Axis.prototype.getYAxis = function getYAxis(scale, orient, tickFormat, tickValues, withOuterTick, withoutTransition) { Axis.prototype.getYAxis = function getYAxis(scale, orient, tickFormat, tickValues, withOuterTick, withoutTransition, withoutRotateTickText) {
var axisParams = { var $$ = this.owner, config = $$.config,
withOuterTick: withOuterTick, axisParams = {
withoutTransition: withoutTransition, withOuterTick: withOuterTick,
}, withoutTransition: withoutTransition,
$$ = this.owner, tickTextRotate: withoutRotateTickText ? 0 : config.axis_y_tick_rotate
d3 = $$.d3, },
config = $$.config, axis = c3_axis($$.d3, axisParams).scale(scale).orient(orient).tickFormat(tickFormat);
axis = c3_axis(d3, axisParams).scale(scale).orient(orient).tickFormat(tickFormat);
if ($$.isTimeSeriesY()) { if ($$.isTimeSeriesY()) {
axis.ticks(d3.time[config.axis_y_tick_time_value], config.axis_y_tick_time_interval); axis.ticks($$.d3.time[config.axis_y_tick_time_value], config.axis_y_tick_time_interval);
} else { } else {
axis.tickValues(tickValues); axis.tickValues(tickValues);
} }
@ -4596,10 +4609,10 @@
targetsToShow = $$.filterTargetsToShow($$.data.targets); targetsToShow = $$.filterTargetsToShow($$.data.targets);
if (id === 'y') { if (id === 'y') {
scale = $$.y.copy().domain($$.getYDomain(targetsToShow, 'y')); scale = $$.y.copy().domain($$.getYDomain(targetsToShow, 'y'));
axis = this.getYAxis(scale, $$.yOrient, config.axis_y_tick_format, $$.yAxisTickValues, false, true); axis = this.getYAxis(scale, $$.yOrient, config.axis_y_tick_format, $$.yAxisTickValues, false, true, true);
} else if (id === 'y2') { } else if (id === 'y2') {
scale = $$.y2.copy().domain($$.getYDomain(targetsToShow, 'y2')); scale = $$.y2.copy().domain($$.getYDomain(targetsToShow, 'y2'));
axis = this.getYAxis(scale, $$.y2Orient, config.axis_y2_tick_format, $$.y2AxisTickValues, false, true); axis = this.getYAxis(scale, $$.y2Orient, config.axis_y2_tick_format, $$.y2AxisTickValues, false, true, true);
} else { } else {
scale = $$.x.copy().domain($$.getXDomain(targetsToShow)); scale = $$.x.copy().domain($$.getXDomain(targetsToShow));
axis = this.getXAxis(scale, $$.xOrient, $$.xAxisTickFormat, $$.xAxisTickValues, false, true, true); axis = this.getXAxis(scale, $$.xOrient, $$.xAxisTickFormat, $$.xAxisTickValues, false, true, true);
@ -6220,6 +6233,10 @@
if (args.xs) { if (args.xs) {
$$.addXs(args.xs); $$.addXs(args.xs);
} }
// update names if exists
if ('names' in args) {
c3_chart_fn.data.names.bind(this)(args.names);
}
// update classes if exists // update classes if exists
if ('classes' in args) { if ('classes' in args) {
Object.keys(args.classes).forEach(function (id) { Object.keys(args.classes).forEach(function (id) {

10
c3.min.js vendored
View File

File diff suppressed because one or more lines are too long

45
spec/axis-spec.js
Unescape View File

@ -153,7 +153,7 @@ describe('c3 chart axis', function () {
describe('axis.x.tick.values', function () { describe('axis.x.tick.values', function () {
describe('function is provided', function () { describe('function is provided', function () {
var tickGenerator = function (/*domain*/) { var tickGenerator = function () {
var values = []; var values = [];
for (var i = 0; i <= 300; i += 50) { for (var i = 0; i <= 300; i += 50) {
values.push(i); values.push(i);
@ -599,6 +599,49 @@ describe('c3 chart axis', function () {
}); });
}); });
describe('axis.y.tick.rotate', function () {
describe('not rotated', function () {
it('should update args successfully', function () {
args = {
data: {
columns: [
['data1', 30, 200, 100, 400, 150, 250, 100, 600],
['data2', 50, 20, 10, 40, 15, 25],
]
},
axis: {
rotated: true,
y: {
tick: {
rotate: 45
}
}
}
};
expect(true).toBeTruthy();
});
it('should rotate tick texts', function () {
chart.internal.main.selectAll('.c3-axis-y g.tick').each(function () {
var tick = d3.select(this),
text = tick.select('text'),
tspan = text.select('tspan');
expect(text.attr('transform')).toBe('rotate(45)');
expect(text.attr('y')).toBe('4');
expect(tspan.attr('dx')).toBeCloseTo('5.6', 0);
});
});
it('should have automatically calculated y axis width', function () {
var box = chart.internal.main.select('.c3-axis-y').node().getBoundingClientRect();
expect(box.width).toBeCloseTo(590, 1);
});
});
});
describe('axis.x.tick.fit', function () { describe('axis.x.tick.fit', function () {
describe('axis.x.tick.fit = true', function () { describe('axis.x.tick.fit = true', function () {

4
src/api.load.js
Unescape View File

@ -4,6 +4,10 @@ c3_chart_fn.load = function (args) {
if (args.xs) { if (args.xs) {
$$.addXs(args.xs); $$.addXs(args.xs);
} }
// update names if exists
if ('names' in args) {
c3_chart_fn.data.names.bind(this)(args.names);
}
// update classes if exists // update classes if exists
if ('classes' in args) { if ('classes' in args) {
Object.keys(args.classes).forEach(function (id) { Object.keys(args.classes).forEach(function (id) {

23
src/axis.js
Unescape View File

@ -76,17 +76,16 @@ Axis.prototype.updateXAxisTickValues = function updateXAxisTickValues(targets, a
} }
return tickValues; return tickValues;
}; };
Axis.prototype.getYAxis = function getYAxis(scale, orient, tickFormat, tickValues, withOuterTick, withoutTransition) { Axis.prototype.getYAxis = function getYAxis(scale, orient, tickFormat, tickValues, withOuterTick, withoutTransition, withoutRotateTickText) {
var axisParams = { var $$ = this.owner, config = $$.config,
withOuterTick: withOuterTick, axisParams = {
withoutTransition: withoutTransition, withOuterTick: withOuterTick,
}, withoutTransition: withoutTransition,
$$ = this.owner, tickTextRotate: withoutRotateTickText ? 0 : config.axis_y_tick_rotate
d3 = $$.d3, },
config = $$.config, axis = c3_axis($$.d3, axisParams).scale(scale).orient(orient).tickFormat(tickFormat);
axis = c3_axis(d3, axisParams).scale(scale).orient(orient).tickFormat(tickFormat);
if ($$.isTimeSeriesY()) { if ($$.isTimeSeriesY()) {
axis.ticks(d3.time[config.axis_y_tick_time_value], config.axis_y_tick_time_interval); axis.ticks($$.d3.time[config.axis_y_tick_time_value], config.axis_y_tick_time_interval);
} else { } else {
axis.tickValues(tickValues); axis.tickValues(tickValues);
} }
@ -276,10 +275,10 @@ Axis.prototype.getMaxTickWidth = function getMaxTickWidth(id, withoutRecompute)
targetsToShow = $$.filterTargetsToShow($$.data.targets); targetsToShow = $$.filterTargetsToShow($$.data.targets);
if (id === 'y') { if (id === 'y') {
scale = $$.y.copy().domain($$.getYDomain(targetsToShow, 'y')); scale = $$.y.copy().domain($$.getYDomain(targetsToShow, 'y'));
axis = this.getYAxis(scale, $$.yOrient, config.axis_y_tick_format, $$.yAxisTickValues, false, true); axis = this.getYAxis(scale, $$.yOrient, config.axis_y_tick_format, $$.yAxisTickValues, false, true, true);
} else if (id === 'y2') { } else if (id === 'y2') {
scale = $$.y2.copy().domain($$.getYDomain(targetsToShow, 'y2')); scale = $$.y2.copy().domain($$.getYDomain(targetsToShow, 'y2'));
axis = this.getYAxis(scale, $$.y2Orient, config.axis_y2_tick_format, $$.y2AxisTickValues, false, true); axis = this.getYAxis(scale, $$.y2Orient, config.axis_y2_tick_format, $$.y2AxisTickValues, false, true, true);
} else { } else {
scale = $$.x.copy().domain($$.getXDomain(targetsToShow)); scale = $$.x.copy().domain($$.getXDomain(targetsToShow));
axis = this.getXAxis(scale, $$.xOrient, $$.xAxisTickFormat, $$.xAxisTickValues, false, true, true); axis = this.getXAxis(scale, $$.xOrient, $$.xAxisTickFormat, $$.xAxisTickValues, false, true, true);

2
src/config.js
Unescape View File

@ -56,6 +56,7 @@ c3_chart_internal_fn.getDefaultConfig = function () {
data_onselected: function () {}, data_onselected: function () {},
data_onunselected: function () {}, data_onunselected: function () {},
data_url: undefined, data_url: undefined,
data_headers: undefined,
data_json: undefined, data_json: undefined,
data_rows: undefined, data_rows: undefined,
data_columns: undefined, data_columns: undefined,
@ -120,6 +121,7 @@ c3_chart_internal_fn.getDefaultConfig = function () {
axis_y_tick_format: undefined, axis_y_tick_format: undefined,
axis_y_tick_outer: true, axis_y_tick_outer: true,
axis_y_tick_values: null, axis_y_tick_values: null,
axis_y_tick_rotate: 0,
axis_y_tick_count: undefined, axis_y_tick_count: undefined,
axis_y_tick_time_value: undefined, axis_y_tick_time_value: undefined,
axis_y_tick_time_interval: undefined, axis_y_tick_time_interval: undefined,

2
src/core.js
Unescape View File

@ -81,7 +81,7 @@ c3_chart_internal_fn.init = function () {
$$.initParams(); $$.initParams();
if (config.data_url) { if (config.data_url) {
$$.convertUrlToData(config.data_url, config.data_mimeType, config.data_keys, $$.initWithData); $$.convertUrlToData(config.data_url, config.data_mimeType, config.data_headers, config.data_keys, $$.initWithData);
} }
else if (config.data_json) { else if (config.data_json) {
$$.initWithData($$.convertJsonToData(config.data_json, config.data_keys)); $$.initWithData($$.convertJsonToData(config.data_json, config.data_keys));

28
src/data.convert.js
Unescape View File

@ -1,6 +1,12 @@
c3_chart_internal_fn.convertUrlToData = function (url, mimeType, keys, done) { c3_chart_internal_fn.convertUrlToData = function (url, mimeType, headers, keys, done) {
var $$ = this, type = mimeType ? mimeType : 'csv'; var $$ = this, type = mimeType ? mimeType : 'csv';
$$.d3.xhr(url, function (error, data) { var req = $$.d3.xhr(url);
if (headers) {
Object.keys(headers).forEach(function (header) {
req.header(header, headers[header]);
});
}
req.get(function (error, data) {
var d; var d;
if (!data) { if (!data) {
throw new Error(error.responseURL + ' ' + error.status + ' (' + error.statusText + ')'); throw new Error(error.responseURL + ' ' + error.status + ' (' + error.statusText + ')');
@ -140,12 +146,20 @@ c3_chart_internal_fn.convertDataToTargets = function (data, appendXs) {
id: convertedId, id: convertedId,
id_org: id, id_org: id,
values: data.map(function (d, i) { values: data.map(function (d, i) {
var xKey = $$.getXKey(id), rawX = d[xKey], x = $$.generateTargetX(rawX, id, i), var xKey = $$.getXKey(id), rawX = d[xKey],
value = d[id] !== null && !isNaN(d[id]) ? +d[id] : null; value = d[id] !== null && !isNaN(d[id]) ? +d[id] : null, x;
// use x as categories if custom x and categorized // use x as categories if custom x and categorized
if ($$.isCustomX() && $$.isCategorized() && index === 0 && rawX) { if ($$.isCustomX() && $$.isCategorized() && rawX) {
if (i === 0) { config.axis_x_categories = []; } if (index === 0 && i === 0) {
config.axis_x_categories.push(rawX); config.axis_x_categories = [];
}
x = config.axis_x_categories.indexOf(rawX);
if (x === -1) {
x = config.axis_x_categories.length;
config.axis_x_categories.push(rawX);
}
} else {
x = $$.generateTargetX(rawX, id, i);
} }
// mark as x = undefined if value is undefined and filter to remove after mapped // mark as x = undefined if value is undefined and filter to remove after mapped
if (isUndefined(d[id]) || $$.data.xs[id].length <= i) { if (isUndefined(d[id]) || $$.data.xs[id].length <= i) {

2
src/data.load.js
Unescape View File

@ -39,7 +39,7 @@ c3_chart_internal_fn.loadFromArgs = function (args) {
$$.load($$.convertDataToTargets(args.data), args); $$.load($$.convertDataToTargets(args.data), args);
} }
else if (args.url) { else if (args.url) {
$$.convertUrlToData(args.url, args.mimeType, args.keys, function (data) { $$.convertUrlToData(args.url, args.mimeType, args.headers, args.keys, function (data) {
$$.load($$.convertDataToTargets(data), args); $$.load($$.convertDataToTargets(data), args);
}); });
} }

8
src/size.js
Unescape View File

@ -95,12 +95,18 @@ c3_chart_internal_fn.getHorizontalAxisHeight = function (axisId) {
var $$ = this, config = $$.config, h = 30; var $$ = this, config = $$.config, h = 30;
if (axisId === 'x' && !config.axis_x_show) { return 8; } if (axisId === 'x' && !config.axis_x_show) { return 8; }
if (axisId === 'x' && config.axis_x_height) { return config.axis_x_height; } if (axisId === 'x' && config.axis_x_height) { return config.axis_x_height; }
if (axisId === 'y' && !config.axis_y_show) { return config.legend_show && !$$.isLegendRight && !$$.isLegendInset ? 10 : 1; } if (axisId === 'y' && !config.axis_y_show) {
return config.legend_show && !$$.isLegendRight && !$$.isLegendInset ? 10 : 1;
}
if (axisId === 'y2' && !config.axis_y2_show) { return $$.rotated_padding_top; } if (axisId === 'y2' && !config.axis_y2_show) { return $$.rotated_padding_top; }
// Calculate x axis height when tick rotated // Calculate x axis height when tick rotated
if (axisId === 'x' && !config.axis_rotated && config.axis_x_tick_rotate) { if (axisId === 'x' && !config.axis_rotated && config.axis_x_tick_rotate) {
h = 30 + $$.axis.getMaxTickWidth(axisId) * Math.cos(Math.PI * (90 - config.axis_x_tick_rotate) / 180); h = 30 + $$.axis.getMaxTickWidth(axisId) * Math.cos(Math.PI * (90 - config.axis_x_tick_rotate) / 180);
} }
// Calculate y axis height when tick rotated
if (axisId === 'y' && config.axis_rotated && config.axis_y_tick_rotate) {
h = 30 + $$.axis.getMaxTickWidth(axisId) * Math.cos(Math.PI * (90 - config.axis_y_tick_rotate) / 180);
}
return h + ($$.axis.getLabelPositionById(axisId).isInner ? 0 : 10) + (axisId === 'y2' ? -10 : 0); return h + ($$.axis.getLabelPositionById(axisId).isInner ? 0 : 10) + (axisId === 'y2' ? -10 : 0);
}; };

Write Preview
Loading…
Cancel
Save