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

Fix literal for CLASS

pull/529/head
Masayuki Tanaka 11 years ago
parent
a3a16800fb
commit
8a2e44a80c
24 changed files with 620 additions and 764 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. 688
      c3.js
  2. 8
      c3.min.js
  3. 16
      src/api.flow.js
  4. 6
      src/api.focus.js
  5. 4
      src/api.region.js
  6. 22
      src/api.selection.js
  7. 34
      src/arc.js
  8. 20
      src/axis.js
  9. 266
      src/class.js
  10. 28
      src/core.js
  11. 2
      src/data.load.js
  12. 26
      src/drag.js
  13. 52
      src/grid.js
  14. 40
      src/interaction.js
  15. 38
      src/legend.js
  16. 8
      src/region.js
  17. 18
      src/selection.js
  18. 20
      src/shape.bar.js
  19. 36
      src/shape.line.js
  20. 2
      src/size.js
  21. 28
      src/subchart.js
  22. 14
      src/text.js
  23. 4
      src/tooltip.js
  24. 4
      src/zoom.js

688
c3.js
View File

File diff suppressed because it is too large Load Diff

8
c3.min.js vendored
View File

File diff suppressed because one or more lines are too long

16
src/api.flow.js
Unescape View File

@ -140,7 +140,7 @@ c3_chart_fn.flow = function (args) {
}; };
c3_chart_internal_fn.generateFlow = function (args) { c3_chart_internal_fn.generateFlow = function (args) {
var $$ = this, config = $$.config, d3 = $$.d3, CLASS = $$.CLASS; var $$ = this, config = $$.config, d3 = $$.d3;
return function () { return function () {
var targets = args.targets, var targets = args.targets,
@ -226,14 +226,14 @@ c3_chart_internal_fn.generateFlow = function (args) {
// remove flowed elements // remove flowed elements
if (flowLength) { if (flowLength) {
for (i = 0; i < flowLength; i++) { for (i = 0; i < flowLength; i++) {
shapes.push('.' + CLASS[_shape] + '-' + (flowIndex + i)); shapes.push('.' + CLASS.shape + '-' + (flowIndex + i));
texts.push('.' + CLASS[_text] + '-' + (flowIndex + i)); texts.push('.' + CLASS.text + '-' + (flowIndex + i));
eventRects.push('.' + CLASS[_eventRect] + '-' + (flowIndex + i)); eventRects.push('.' + CLASS.eventRect + '-' + (flowIndex + i));
} }
$$.svg.selectAll('.' + CLASS[_shapes]).selectAll(shapes).remove(); $$.svg.selectAll('.' + CLASS.shapes).selectAll(shapes).remove();
$$.svg.selectAll('.' + CLASS[_texts]).selectAll(texts).remove(); $$.svg.selectAll('.' + CLASS.texts).selectAll(texts).remove();
$$.svg.selectAll('.' + CLASS[_eventRects]).selectAll(eventRects).remove(); $$.svg.selectAll('.' + CLASS.eventRects).selectAll(eventRects).remove();
$$.svg.select('.' + CLASS[_xgrid]).remove(); $$.svg.select('.' + CLASS.xgrid).remove();
} }
// draw again for removing flowed elements and reverting attr // draw again for removing flowed elements and reverting attr

6
src/api.focus.js
Unescape View File

@ -8,7 +8,7 @@ c3_chart_fn.focus = function (targetId) {
} }
this.revert(); this.revert();
this.defocus(); this.defocus();
focus(candidatesForNoneArc.classed(CLASS[_focused], true)); focus(candidatesForNoneArc.classed(CLASS.focused, true));
focus(candidatesForArc); focus(candidatesForArc);
if ($$.hasArcType()) { if ($$.hasArcType()) {
$$.expandArc(targetId, true); $$.expandArc(targetId, true);
@ -25,7 +25,7 @@ c3_chart_fn.defocus = function (targetId) {
$$.filterTargetsToShow(targets).transition().duration(100).style('opacity', 0.3); $$.filterTargetsToShow(targets).transition().duration(100).style('opacity', 0.3);
} }
this.revert(); this.revert();
defocus(candidatesForNoneArc.classed(CLASS[_focused], false)); defocus(candidatesForNoneArc.classed(CLASS.focused, false));
defocus(candidatesForArc); defocus(candidatesForArc);
if ($$.hasArcType()) { if ($$.hasArcType()) {
$$.unexpandArc(targetId); $$.unexpandArc(targetId);
@ -41,7 +41,7 @@ c3_chart_fn.revert = function (targetId) {
function revert(targets) { function revert(targets) {
$$.filterTargetsToShow(targets).transition().duration(100).style('opacity', 1); $$.filterTargetsToShow(targets).transition().duration(100).style('opacity', 1);
} }
revert(candidatesForNoneArc.classed(CLASS[_focused], false)); revert(candidatesForNoneArc.classed(CLASS.focused, false));
revert(candidatesForArc); revert(candidatesForArc);
if ($$.hasArcType()) { if ($$.hasArcType()) {
$$.unexpandArc(targetId); $$.unexpandArc(targetId);

4
src/api.region.js
Unescape View File

@ -18,9 +18,9 @@ c3_chart_fn.regions.remove = function (options) {
options = options || {}; options = options || {};
duration = $$.getOption(options, "duration", config.transition_duration); duration = $$.getOption(options, "duration", config.transition_duration);
classes = $$.getOption(options, "classes", [CLASS[_region]]); classes = $$.getOption(options, "classes", [CLASS.region]);
regions = $$.main.select('.' + CLASS[_regions]).selectAll(classes.map(function (c) { return '.' + c; })); regions = $$.main.select('.' + CLASS.regions).selectAll(classes.map(function (c) { return '.' + c; }));
(duration ? regions.transition().duration(duration) : regions) (duration ? regions.transition().duration(duration) : regions)
.style('opacity', 0) .style('opacity', 0)
.remove(); .remove();

22
src/api.selection.js
Unescape View File

@ -1,30 +1,30 @@
c3_chart_fn.selected = function (targetId) { c3_chart_fn.selected = function (targetId) {
var $$ = this.internal, d3 = $$.d3; var $$ = this.internal, d3 = $$.d3;
return d3.merge( return d3.merge(
$$.main.selectAll('.' + CLASS[_shapes] + $$.getTargetSelectorSuffix(targetId)).selectAll('.' + CLASS[_shape]) $$.main.selectAll('.' + CLASS.shapes + $$.getTargetSelectorSuffix(targetId)).selectAll('.' + CLASS.shape)
.filter(function () { return d3.select(this).classed(CLASS[_SELECTED]); }) .filter(function () { return d3.select(this).classed(CLASS.SELECTED); })
.map(function (d) { return d.map(function (d) { var data = d.__data__; return data.data ? data.data : data; }); }) .map(function (d) { return d.map(function (d) { var data = d.__data__; return data.data ? data.data : data; }); })
); );
}; };
c3_chart_fn.select = function (ids, indices, resetOther) { c3_chart_fn.select = function (ids, indices, resetOther) {
var $$ = this.internal, d3 = $$.d3, config = $$.config; var $$ = this.internal, d3 = $$.d3, config = $$.config;
if (! config.data_selection_enabled) { return; } if (! config.data_selection_enabled) { return; }
$$.main.selectAll('.' + CLASS[_shapes]).selectAll('.' + CLASS[_shape]).each(function (d, i) { $$.main.selectAll('.' + CLASS.shapes).selectAll('.' + CLASS.shape).each(function (d, i) {
var shape = d3.select(this), id = d.data ? d.data.id : d.id, toggle = $$.getToggle(this), var shape = d3.select(this), id = d.data ? d.data.id : d.id, toggle = $$.getToggle(this),
isTargetId = config.data_selection_grouped || !ids || ids.indexOf(id) >= 0, isTargetId = config.data_selection_grouped || !ids || ids.indexOf(id) >= 0,
isTargetIndex = !indices || indices.indexOf(i) >= 0, isTargetIndex = !indices || indices.indexOf(i) >= 0,
isSelected = shape.classed(CLASS[_SELECTED]); isSelected = shape.classed(CLASS.SELECTED);
// line/area selection not supported yet // line/area selection not supported yet
if (shape.classed(CLASS[_line]) || shape.classed(CLASS[_area])) { if (shape.classed(CLASS.line) || shape.classed(CLASS.area)) {
return; return;
} }
if (isTargetId && isTargetIndex) { if (isTargetId && isTargetIndex) {
if (config.data_selection_isselectable(d) && !isSelected) { if (config.data_selection_isselectable(d) && !isSelected) {
toggle(true, shape.classed(CLASS[_SELECTED], true), d, i); toggle(true, shape.classed(CLASS.SELECTED, true), d, i);
} }
} else if (isDefined(resetOther) && resetOther) { } else if (isDefined(resetOther) && resetOther) {
if (isSelected) { if (isSelected) {
toggle(false, shape.classed(CLASS[_SELECTED], false), d, i); toggle(false, shape.classed(CLASS.SELECTED, false), d, i);
} }
} }
}); });
@ -32,19 +32,19 @@ c3_chart_fn.select = function (ids, indices, resetOther) {
c3_chart_fn.unselect = function (ids, indices) { c3_chart_fn.unselect = function (ids, indices) {
var $$ = this.internal, d3 = $$.d3, config = $$.config; var $$ = this.internal, d3 = $$.d3, config = $$.config;
if (! config.data_selection_enabled) { return; } if (! config.data_selection_enabled) { return; }
$$.main.selectAll('.' + CLASS[_shapes]).selectAll('.' + CLASS[_shape]).each(function (d, i) { $$.main.selectAll('.' + CLASS.shapes).selectAll('.' + CLASS.shape).each(function (d, i) {
var shape = d3.select(this), id = d.data ? d.data.id : d.id, toggle = $$.getToggle(this), var shape = d3.select(this), id = d.data ? d.data.id : d.id, toggle = $$.getToggle(this),
isTargetId = config.data_selection_grouped || !ids || ids.indexOf(id) >= 0, isTargetId = config.data_selection_grouped || !ids || ids.indexOf(id) >= 0,
isTargetIndex = !indices || indices.indexOf(i) >= 0, isTargetIndex = !indices || indices.indexOf(i) >= 0,
isSelected = shape.classed(CLASS[_SELECTED]); isSelected = shape.classed(CLASS.SELECTED);
// line/area selection not supported yet // line/area selection not supported yet
if (shape.classed(CLASS[_line]) || shape.classed(CLASS[_area])) { if (shape.classed(CLASS.line) || shape.classed(CLASS.area)) {
return; return;
} }
if (isTargetId && isTargetIndex) { if (isTargetId && isTargetIndex) {
if (config.data_selection_isselectable(d)) { if (config.data_selection_isselectable(d)) {
if (isSelected) { if (isSelected) {
toggle(false, shape.classed(CLASS[_SELECTED], false), d, i); toggle(false, shape.classed(CLASS.SELECTED, false), d, i);
} }
} }
} }

34
src/arc.js
Unescape View File

@ -120,8 +120,8 @@ c3_chart_internal_fn.textForArcLabel = function (d) {
c3_chart_internal_fn.expandArc = function (id, withoutFadeOut) { c3_chart_internal_fn.expandArc = function (id, withoutFadeOut) {
var $$ = this, var $$ = this,
target = $$.svg.selectAll('.' + CLASS[_chartArc] + $$.selectorTarget(id)), target = $$.svg.selectAll('.' + CLASS.chartArc + $$.selectorTarget(id)),
noneTargets = $$.svg.selectAll('.' + CLASS[_arc]).filter(function (data) { return data.data.id !== id; }); noneTargets = $$.svg.selectAll('.' + CLASS.arc).filter(function (data) { return data.data.id !== id; });
if ($$.shouldExpand(id)) { if ($$.shouldExpand(id)) {
target.selectAll('path') target.selectAll('path')
@ -142,11 +142,11 @@ c3_chart_internal_fn.expandArc = function (id, withoutFadeOut) {
c3_chart_internal_fn.unexpandArc = function (id) { c3_chart_internal_fn.unexpandArc = function (id) {
var $$ = this, var $$ = this,
target = $$.svg.selectAll('.' + CLASS[_chartArc] + $$.selectorTarget(id)); target = $$.svg.selectAll('.' + CLASS.chartArc + $$.selectorTarget(id));
target.selectAll('path.' + CLASS[_arc]) target.selectAll('path.' + CLASS.arc)
.transition().duration(50) .transition().duration(50)
.attr("d", $$.svgArc); .attr("d", $$.svgArc);
$$.svg.selectAll('.' + CLASS[_arc]) $$.svg.selectAll('.' + CLASS.arc)
.style("opacity", 1); .style("opacity", 1);
}; };
@ -197,7 +197,7 @@ c3_chart_internal_fn.updateTargetsForArc = function (targets) {
mainPieUpdate, mainPieEnter, mainPieUpdate, mainPieEnter,
classChartArc = $$.classChartArc.bind($$), classChartArc = $$.classChartArc.bind($$),
classArcs = $$.classArcs.bind($$); classArcs = $$.classArcs.bind($$);
mainPieUpdate = main.select('.' + CLASS[_chartArcs]).selectAll('.' + CLASS[_chartArc]) mainPieUpdate = main.select('.' + CLASS.chartArcs).selectAll('.' + CLASS.chartArc)
.data($$.pie(targets)) .data($$.pie(targets))
.attr("class", classChartArc); .attr("class", classChartArc);
mainPieEnter = mainPieUpdate.enter().append("g") mainPieEnter = mainPieUpdate.enter().append("g")
@ -215,11 +215,11 @@ c3_chart_internal_fn.updateTargetsForArc = function (targets) {
c3_chart_internal_fn.initArc = function () { c3_chart_internal_fn.initArc = function () {
var $$ = this; var $$ = this;
$$.arcs = $$.main.select('.' + CLASS[_chart]).append("g") $$.arcs = $$.main.select('.' + CLASS.chart).append("g")
.attr("class", CLASS[_chartArcs]) .attr("class", CLASS.chartArcs)
.attr("transform", $$.getTranslate('arc')); .attr("transform", $$.getTranslate('arc'));
$$.arcs.append('text') $$.arcs.append('text')
.attr('class', CLASS[_chartArcsTitle]) .attr('class', CLASS.chartArcsTitle)
.style("text-anchor", "middle") .style("text-anchor", "middle")
.text($$.getArcTitle()); .text($$.getArcTitle());
}; };
@ -227,7 +227,7 @@ c3_chart_internal_fn.initArc = function () {
c3_chart_internal_fn.redrawArc = function (duration, durationForExit, withTransform) { c3_chart_internal_fn.redrawArc = function (duration, durationForExit, withTransform) {
var $$ = this, d3 = $$.d3, config = $$.config, main = $$.main, var $$ = this, d3 = $$.d3, config = $$.config, main = $$.main,
mainArc; mainArc;
mainArc = main.selectAll('.' + CLASS[_arcs]).selectAll('.' + CLASS[_arc]) mainArc = main.selectAll('.' + CLASS.arcs).selectAll('.' + CLASS.arc)
.data($$.arcData.bind($$)); .data($$.arcData.bind($$));
mainArc.enter().append('path') mainArc.enter().append('path')
.attr("class", $$.classArc.bind($$)) .attr("class", $$.classArc.bind($$))
@ -314,14 +314,14 @@ c3_chart_internal_fn.redrawArc = function (duration, durationForExit, withTransf
mainArc.exit().transition().duration(durationForExit) mainArc.exit().transition().duration(durationForExit)
.style('opacity', 0) .style('opacity', 0)
.remove(); .remove();
main.selectAll('.' + CLASS[_chartArc]).select('text') main.selectAll('.' + CLASS.chartArc).select('text')
.style("opacity", 0) .style("opacity", 0)
.attr('class', function (d) { return $$.isGaugeType(d.data) ? CLASS[_gaugeValue] : ''; }) .attr('class', function (d) { return $$.isGaugeType(d.data) ? CLASS.gaugeValue : ''; })
.text($$.textForArcLabel.bind($$)) .text($$.textForArcLabel.bind($$))
.attr("transform", $$.transformForArcLabel.bind($$)) .attr("transform", $$.transformForArcLabel.bind($$))
.transition().duration(duration) .transition().duration(duration)
.style("opacity", function (d) { return $$.isTargetToShow(d.data.id) && $$.isArcType(d.data) ? 1 : 0; }); .style("opacity", function (d) { return $$.isTargetToShow(d.data.id) && $$.isArcType(d.data) ? 1 : 0; });
main.select('.' + CLASS[_chartArcsTitle]) main.select('.' + CLASS.chartArcsTitle)
.style("opacity", $$.hasType('donut') || $$.hasType('gauge') ? 1 : 0); .style("opacity", $$.hasType('donut') || $$.hasType('gauge') ? 1 : 0);
}; };
@ -329,7 +329,7 @@ c3_chart_internal_fn.initGauge = function () {
var $$ = this, config = $$.config, arcs = $$.arcs; var $$ = this, config = $$.config, arcs = $$.arcs;
if ($$.hasType('gauge')) { if ($$.hasType('gauge')) {
arcs.append('path') arcs.append('path')
.attr("class", CLASS[_chartArcsBackground]) .attr("class", CLASS.chartArcsBackground)
.attr("d", function () { .attr("d", function () {
var d = { var d = {
data: [{value: config.gauge_max}], data: [{value: config.gauge_max}],
@ -340,21 +340,21 @@ c3_chart_internal_fn.initGauge = function () {
}); });
arcs.append("text") arcs.append("text")
.attr("dy", ".75em") .attr("dy", ".75em")
.attr("class", CLASS[_chartArcsGaugeUnit]) .attr("class", CLASS.chartArcsGaugeUnit)
.style("text-anchor", "middle") .style("text-anchor", "middle")
.style("pointer-events", "none") .style("pointer-events", "none")
.text(config.gauge_label_show ? config.gauge_units : ''); .text(config.gauge_label_show ? config.gauge_units : '');
arcs.append("text") arcs.append("text")
.attr("dx", -1 * ($$.innerRadius + (($$.radius - $$.innerRadius) / 2)) + "px") .attr("dx", -1 * ($$.innerRadius + (($$.radius - $$.innerRadius) / 2)) + "px")
.attr("dy", "1.2em") .attr("dy", "1.2em")
.attr("class", CLASS[_chartArcsGaugeMin]) .attr("class", CLASS.chartArcsGaugeMin)
.style("text-anchor", "middle") .style("text-anchor", "middle")
.style("pointer-events", "none") .style("pointer-events", "none")
.text(config.gauge_label_show ? config.gauge_min : ''); .text(config.gauge_label_show ? config.gauge_min : '');
arcs.append("text") arcs.append("text")
.attr("dx", $$.innerRadius + (($$.radius - $$.innerRadius) / 2) + "px") .attr("dx", $$.innerRadius + (($$.radius - $$.innerRadius) / 2) + "px")
.attr("dy", "1.2em") .attr("dy", "1.2em")
.attr("class", CLASS[_chartArcsGaugeMax]) .attr("class", CLASS.chartArcsGaugeMax)
.style("text-anchor", "middle") .style("text-anchor", "middle")
.style("pointer-events", "none") .style("pointer-events", "none")
.text(config.gauge_label_show ? config.gauge_max : ''); .text(config.gauge_label_show ? config.gauge_max : '');

20
src/axis.js
Unescape View File

@ -1,32 +1,32 @@
c3_chart_internal_fn.initAxis = function () { c3_chart_internal_fn.initAxis = function () {
var $$ = this, config = $$.config, main = $$.main, CLASS = $$.CLASS; var $$ = this, config = $$.config, main = $$.main;
$$.axes.x = main.append("g") $$.axes.x = main.append("g")
.attr("class", CLASS[_axis] + ' ' + CLASS[_axisX]) .attr("class", CLASS.axis + ' ' + CLASS.axisX)
.attr("clip-path", $$.clipPathForXAxis) .attr("clip-path", $$.clipPathForXAxis)
.attr("transform", $$.getTranslate('x')) .attr("transform", $$.getTranslate('x'))
.style("visibility", config.axis_x_show ? 'visible' : 'hidden'); .style("visibility", config.axis_x_show ? 'visible' : 'hidden');
$$.axes.x.append("text") $$.axes.x.append("text")
.attr("class", CLASS[_axisXLabel]) .attr("class", CLASS.axisXLabel)
.attr("transform", config.axis_rotated ? "rotate(-90)" : "") .attr("transform", config.axis_rotated ? "rotate(-90)" : "")
.style("text-anchor", $$.textAnchorForXAxisLabel.bind($$)); .style("text-anchor", $$.textAnchorForXAxisLabel.bind($$));
$$.axes.y = main.append("g") $$.axes.y = main.append("g")
.attr("class", CLASS[_axis] + ' ' + CLASS[_axisY]) .attr("class", CLASS.axis + ' ' + CLASS.axisY)
.attr("clip-path", $$.clipPathForYAxis) .attr("clip-path", $$.clipPathForYAxis)
.attr("transform", $$.getTranslate('y')) .attr("transform", $$.getTranslate('y'))
.style("visibility", config.axis_y_show ? 'visible' : 'hidden'); .style("visibility", config.axis_y_show ? 'visible' : 'hidden');
$$.axes.y.append("text") $$.axes.y.append("text")
.attr("class", CLASS[_axisYLabel]) .attr("class", CLASS.axisYLabel)
.attr("transform", config.axis_rotated ? "" : "rotate(-90)") .attr("transform", config.axis_rotated ? "" : "rotate(-90)")
.style("text-anchor", $$.textAnchorForYAxisLabel.bind($$)); .style("text-anchor", $$.textAnchorForYAxisLabel.bind($$));
$$.axes.y2 = main.append("g") $$.axes.y2 = main.append("g")
.attr("class", CLASS[_axis] + ' ' + CLASS[_axisY2]) .attr("class", CLASS.axis + ' ' + CLASS.axisY2)
// clip-path? // clip-path?
.attr("transform", $$.getTranslate('y2')) .attr("transform", $$.getTranslate('y2'))
.style("visibility", config.axis_y2_show ? 'visible' : 'hidden'); .style("visibility", config.axis_y2_show ? 'visible' : 'hidden');
$$.axes.y2.append("text") $$.axes.y2.append("text")
.attr("class", CLASS[_axisY2Label]) .attr("class", CLASS.axisY2Label)
.attr("transform", config.axis_rotated ? "" : "rotate(-90)") .attr("transform", config.axis_rotated ? "" : "rotate(-90)")
.style("text-anchor", $$.textAnchorForY2AxisLabel.bind($$)); .style("text-anchor", $$.textAnchorForY2AxisLabel.bind($$));
}; };
@ -261,9 +261,9 @@ c3_chart_internal_fn.getMaxTickWidth = function (id) {
c3_chart_internal_fn.updateAxisLabels = function (withTransition) { c3_chart_internal_fn.updateAxisLabels = function (withTransition) {
var $$ = this; var $$ = this;
var axisXLabel = $$.main.select('.' + CLASS[_axisX] + ' .' + CLASS[_axisXLabel]), var axisXLabel = $$.main.select('.' + CLASS.axisX + ' .' + CLASS.axisXLabel),
axisYLabel = $$.main.select('.' + CLASS[_axisY] + ' .' + CLASS[_axisYLabel]), axisYLabel = $$.main.select('.' + CLASS.axisY + ' .' + CLASS.axisYLabel),
axisY2Label = $$.main.select('.' + CLASS[_axisY2] + ' .' + CLASS[_axisY2Label]); axisY2Label = $$.main.select('.' + CLASS.axisY2 + ' .' + CLASS.axisY2Label);
(withTransition ? axisXLabel.transition() : axisXLabel) (withTransition ? axisXLabel.transition() : axisXLabel)
.attr("x", $$.xForXAxisLabel.bind($$)) .attr("x", $$.xForXAxisLabel.bind($$))
.attr("dx", $$.dxForXAxisLabel.bind($$)) .attr("dx", $$.dxForXAxisLabel.bind($$))

266
src/class.js
Unescape View File

@ -1,231 +1,159 @@
var _target = 'target', var CLASS = c3_chart_internal_fn.CLASS = {
_chart = 'chart ', target: 'c3-target',
_chartLine = 'chartLine', chart: 'c3-chart',
_chartLines = 'chartLines', chartLine: 'c3-chart-line',
_chartBar = 'chartBar', chartLines: 'c3-chart-lines',
_chartBars = 'chartBars', chartBar: 'c3-chart-bar',
_chartText = 'chartText', chartBars: 'c3-chart-bars',
_chartTexts = 'chartTexts', chartText: 'c3-chart-text',
_chartArc = 'chartArc', chartTexts: 'c3-chart-texts',
_chartArcs = 'chartArcs', chartArc: 'c3-chart-arc',
_chartArcsTitle = 'chartArcsTitle', chartArcs: 'c3-chart-arcs',
_chartArcsBackground = 'chartArcsBackground', chartArcsTitle: 'c3-chart-arcs-title',
_chartArcsGaugeUnit = 'chartArcsGaugeUnit', chartArcsBackground: 'c3-chart-arcs-background',
_chartArcsGaugeMax = 'chartArcsGaugeMax', chartArcsGaugeUnit: 'c3-chart-arcs-gauge-unit',
_chartArcsGaugeMin = 'chartArcsGaugeMin', chartArcsGaugeMax: 'c3-chart-arcs-gauge-max',
_selectedCircle = 'selectedCircle', chartArcsGaugeMin: 'c3-chart-arcs-gauge-min',
_selectedCircles = 'selectedCircles', selectedCircle: 'c3-selected-circle',
_eventRect = 'eventRect', selectedCircles: 'c3-selected-circles',
_eventRects = 'eventRects', eventRect: 'c3-event-rect',
_eventRectsSingle = 'eventRectsSingle', eventRects: 'c3-event-rects',
_eventRectsMultiple = 'eventRectsMultiple', eventRectsSingle: 'c3-event-rects-single',
_zoomRect = 'zoomRect', eventRectsMultiple: 'c3-event-rects-multiple',
_brush = 'brush', zoomRect: 'c3-zoom-rect',
_focused = 'focused', brush: 'c3-brush',
_region = 'region', focused: 'c3-focused',
_regions = 'regions', region: 'c3-region',
_tooltip = 'tooltip', regions: 'c3-regions',
_tooltipName = 'tooltipName', tooltip: 'c3-tooltip',
_shape = 'shape', tooltipName: 'c3-tooltip-name',
_shapes = 'shapes', shape: 'c3-shape',
_line = 'line', shapes: 'c3-shapes',
_lines = 'lines', line: 'c3-line',
_bar = 'bar', lines: 'c3-lines',
_bars = 'bars', bar: 'c3-bar',
_circle = 'circle', bars: 'c3-bars',
_circles = 'circles', circle: 'c3-circle',
_arc = 'arc', circles: 'c3-circles',
_arcs = 'arcs', arc: 'c3-arc',
_area = 'area', arcs: 'c3-arcs',
_areas = 'areas', area: 'c3-area',
_empty = 'empty', areas: 'c3-areas',
_text = 'text', empty: 'c3-empty',
_texts = 'texts', text: 'c3-text',
_gaugeValue = 'gaugeValue', texts: 'c3-texts',
_grid = 'grid', gaugeValue: 'c3-gauge-value',
_xgrid = 'xgrid', grid: 'c3-grid',
_xgrids = 'xgrids', xgrid: 'c3-xgrid',
_xgridLine = 'xgridLine', xgrids: 'c3-xgrids',
_xgridLines = 'xgridLines', xgridLine: 'c3-xgrid-line',
_xgridFocus = 'xgridFocus', xgridLines: 'c3-xgrid-lines',
_ygrid = 'ygrid', xgridFocus: 'c3-xgrid-focus',
_ygrids = 'ygrids', ygrid: 'c3-ygrid',
_ygridLine = 'ygridLine', ygrids: 'c3-ygrids',
_ygridLines = 'ygridLines', ygridLine: 'c3-ygrid-line',
_axis = 'axis', ygridLines: 'c3-ygrid-lines',
_axisX = 'axisX', axis: 'c3-axis',
_axisXLabel = 'axisXLabel', axisX: 'c3-axis-x',
_axisY = 'axisY', axisXLabel: 'c3-axis-x-label',
_axisYLabel = 'axisYLabel', axisY: 'c3-axis-y',
_axisY2 = 'axisY2', axisYLabel: 'c3-axis-y-label',
_axisY2Label = 'axisY2Label', axisY2: 'c3-axis-y2',
_legendBackground = 'legendBackground', axisY2Label: 'c3-axis-y2-label',
_legendItem = 'legendItem', legendBackground: 'c3-legend-background',
_legendItemEvent = 'legendItemEvent', legendItem: 'c3-legend-item',
_legendItemTile = 'legendItemTile', legendItemEvent: 'c3-legend-item-event',
_legendItemHidden = 'legendItemHidden', legendItemTile: 'c3-legend-item-tile',
_legendItemFocused = 'legendItemFocused', legendItemHidden: 'c3-legend-item-hidden',
_dragarea = 'dragarea', legendItemFocused: 'c3-legend-item-focused',
_EXPANDED = 'EXPANDED', dragarea: 'c3-dragarea',
_SELECTED = 'SELECTED', EXPANDED: '_expanded_',
_INCLUDED = 'INCLUDED'; SELECTED: '_selected_',
INCLUDED: '_included_'
var CLASS = c3_chart_internal_fn.CLASS = {}; };
CLASS[_target] = 'c3-target';
CLASS[_chart] = 'c3-chart';
CLASS[_chartLine] = 'c3-chart-line';
CLASS[_chartLines] = 'c3-chart-lines';
CLASS[_chartBar] = 'c3-chart-bar';
CLASS[_chartBars] = 'c3-chart-bars';
CLASS[_chartText] = 'c3-chart-text';
CLASS[_chartTexts] = 'c3-chart-texts';
CLASS[_chartArc] = 'c3-chart-arc';
CLASS[_chartArcs] = 'c3-chart-arcs';
CLASS[_chartArcsTitle] = 'c3-chart-arcs-title';
CLASS[_chartArcsBackground] = 'c3-chart-arcs-background';
CLASS[_chartArcsGaugeUnit] = 'c3-chart-arcs-gauge-unit';
CLASS[_chartArcsGaugeMax] = 'c3-chart-arcs-gauge-max';
CLASS[_chartArcsGaugeMin] = 'c3-chart-arcs-gauge-min';
CLASS[_selectedCircle] = 'c3-selected-circle';
CLASS[_selectedCircles] = 'c3-selected-circles';
CLASS[_eventRect] = 'c3-event-rect';
CLASS[_eventRects] = 'c3-event-rects';
CLASS[_eventRectsSingle] = 'c3-event-rects-single';
CLASS[_eventRectsMultiple] = 'c3-event-rects-multiple';
CLASS[_zoomRect] = 'c3-zoom-rect';
CLASS[_brush] = 'c3-brush';
CLASS[_focused] = 'c3-focused';
CLASS[_region] = 'c3-region';
CLASS[_regions] = 'c3-regions';
CLASS[_tooltip] = 'c3-tooltip';
CLASS[_tooltipName] = 'c3-tooltip-name';
CLASS[_shape] = 'c3-shape';
CLASS[_shapes] = 'c3-shapes';
CLASS[_line] = 'c3-line';
CLASS[_lines] = 'c3-lines';
CLASS[_bar] = 'c3-bar';
CLASS[_bars] = 'c3-bars';
CLASS[_circle] = 'c3-circle';
CLASS[_circles] = 'c3-circles';
CLASS[_arc] = 'c3-arc';
CLASS[_arcs] = 'c3-arcs';
CLASS[_area] = 'c3-area';
CLASS[_areas] = 'c3-areas';
CLASS[_empty] = 'c3-empty';
CLASS[_text] = 'c3-text';
CLASS[_texts] = 'c3-texts';
CLASS[_gaugeValue] = 'c3-gauge-value';
CLASS[_grid] = 'c3-grid';
CLASS[_xgrid] = 'c3-xgrid';
CLASS[_xgrids] = 'c3-xgrids';
CLASS[_xgridLine] = 'c3-xgrid-line';
CLASS[_xgridLines] = 'c3-xgrid-lines';
CLASS[_xgridFocus] = 'c3-xgrid-focus';
CLASS[_ygrid] = 'c3-ygrid';
CLASS[_ygrids] = 'c3-ygrids';
CLASS[_ygridLine] = 'c3-ygrid-line';
CLASS[_ygridLines] = 'c3-ygrid-lines';
CLASS[_axis] = 'c3-axis';
CLASS[_axisX] = 'c3-axis-x';
CLASS[_axisXLabel] = 'c3-axis-x-label';
CLASS[_axisY] = 'c3-axis-y';
CLASS[_axisYLabel] = 'c3-axis-y-label';
CLASS[_axisY2] = 'c3-axis-y2';
CLASS[_axisY2Label] = 'c3-axis-y2-label';
CLASS[_legendBackground] = 'c3-legend-background';
CLASS[_legendItem] = 'c3-legend-item';
CLASS[_legendItemEvent] = 'c3-legend-item-event';
CLASS[_legendItemTile] = 'c3-legend-item-tile';
CLASS[_legendItemHidden] = 'c3-legend-item-hidden';
CLASS[_legendItemFocused] = 'c3-legend-item-focused';
CLASS[_dragarea] = 'c3-dragarea';
CLASS[_EXPANDED] = '_expanded_';
CLASS[_SELECTED] = '_selected_';
CLASS[_INCLUDED] = '_included_';
c3_chart_internal_fn.generateClass = function (prefix, targetId) { c3_chart_internal_fn.generateClass = function (prefix, targetId) {
return " " + prefix + " " + prefix + this.getTargetSelectorSuffix(targetId); return " " + prefix + " " + prefix + this.getTargetSelectorSuffix(targetId);
}; };
c3_chart_internal_fn.classText = function (d) { c3_chart_internal_fn.classText = function (d) {
return this.generateClass(CLASS[_text], d.index); return this.generateClass(CLASS.text, d.index);
}; };
c3_chart_internal_fn.classTexts = function (d) { c3_chart_internal_fn.classTexts = function (d) {
return this.generateClass(CLASS[_texts], d.id); return this.generateClass(CLASS.texts, d.id);
}; };
c3_chart_internal_fn.classShape = function (d) { c3_chart_internal_fn.classShape = function (d) {
return this.generateClass(CLASS[_shape], d.index); return this.generateClass(CLASS.shape, d.index);
}; };
c3_chart_internal_fn.classShapes = function (d) { c3_chart_internal_fn.classShapes = function (d) {
return this.generateClass(CLASS[_shapes], d.id); return this.generateClass(CLASS.shapes, d.id);
}; };
c3_chart_internal_fn.classLine = function (d) { c3_chart_internal_fn.classLine = function (d) {
return this.classShape(d) + this.generateClass(CLASS[_line], d.id); return this.classShape(d) + this.generateClass(CLASS.line, d.id);
}; };
c3_chart_internal_fn.classLines = function (d) { c3_chart_internal_fn.classLines = function (d) {
return this.classShapes(d) + this.generateClass(CLASS[_lines], d.id); return this.classShapes(d) + this.generateClass(CLASS.lines, d.id);
}; };
c3_chart_internal_fn.classCircle = function (d) { c3_chart_internal_fn.classCircle = function (d) {
return this.classShape(d) + this.generateClass(CLASS[_circle], d.index); return this.classShape(d) + this.generateClass(CLASS.circle, d.index);
}; };
c3_chart_internal_fn.classCircles = function (d) { c3_chart_internal_fn.classCircles = function (d) {
return this.classShapes(d) + this.generateClass(CLASS[_circles], d.id); return this.classShapes(d) + this.generateClass(CLASS.circles, d.id);
}; };
c3_chart_internal_fn.classBar = function (d) { c3_chart_internal_fn.classBar = function (d) {
return this.classShape(d) + this.generateClass(CLASS[_bar], d.index); return this.classShape(d) + this.generateClass(CLASS.bar, d.index);
}; };
c3_chart_internal_fn.classBars = function (d) { c3_chart_internal_fn.classBars = function (d) {
return this.classShapes(d) + this.generateClass(CLASS[_bars], d.id); return this.classShapes(d) + this.generateClass(CLASS.bars, d.id);
}; };
c3_chart_internal_fn.classArc = function (d) { c3_chart_internal_fn.classArc = function (d) {
return this.classShape(d.data) + this.generateClass(CLASS[_arc], d.data.id); return this.classShape(d.data) + this.generateClass(CLASS.arc, d.data.id);
}; };
c3_chart_internal_fn.classArcs = function (d) { c3_chart_internal_fn.classArcs = function (d) {
return this.classShapes(d.data) + this.generateClass(CLASS[_arcs], d.data.id); return this.classShapes(d.data) + this.generateClass(CLASS.arcs, d.data.id);
}; };
c3_chart_internal_fn.classArea = function (d) { c3_chart_internal_fn.classArea = function (d) {
return this.classShape(d) + this.generateClass(CLASS[_area], d.id); return this.classShape(d) + this.generateClass(CLASS.area, d.id);
}; };
c3_chart_internal_fn.classAreas = function (d) { c3_chart_internal_fn.classAreas = function (d) {
return this.classShapes(d) + this.generateClass(CLASS[_areas], d.id); return this.classShapes(d) + this.generateClass(CLASS.areas, d.id);
}; };
c3_chart_internal_fn.classRegion = function (d, i) { c3_chart_internal_fn.classRegion = function (d, i) {
return this.generateClass(CLASS[_region], i) + ' ' + ('class' in d ? d.class : ''); return this.generateClass(CLASS.region, i) + ' ' + ('class' in d ? d.class : '');
}; };
c3_chart_internal_fn.classEvent = function (d) { c3_chart_internal_fn.classEvent = function (d) {
return this.generateClass(CLASS[_eventRect], d.index); return this.generateClass(CLASS.eventRect, d.index);
}; };
c3_chart_internal_fn.classTarget = function (id) { c3_chart_internal_fn.classTarget = function (id) {
var $$ = this; var $$ = this;
var additionalClassSuffix = $$.config.data_classes[id], additionalClass = ''; var additionalClassSuffix = $$.config.data_classes[id], additionalClass = '';
if (additionalClassSuffix) { if (additionalClassSuffix) {
additionalClass = ' ' + CLASS[_target] + '-' + additionalClassSuffix; additionalClass = ' ' + CLASS.target + '-' + additionalClassSuffix;
} }
return $$.generateClass(CLASS[_target], id) + additionalClass; return $$.generateClass(CLASS.target, id) + additionalClass;
}; };
c3_chart_internal_fn.classChartText = function (d) { c3_chart_internal_fn.classChartText = function (d) {
return CLASS[_chartText] + this.classTarget(d.id); return CLASS.chartText + this.classTarget(d.id);
}; };
c3_chart_internal_fn.classChartLine = function (d) { c3_chart_internal_fn.classChartLine = function (d) {
return CLASS[_chartLine] + this.classTarget(d.id); return CLASS.chartLine + this.classTarget(d.id);
}; };
c3_chart_internal_fn.classChartBar = function (d) { c3_chart_internal_fn.classChartBar = function (d) {
return CLASS[_chartBar] + this.classTarget(d.id); return CLASS.chartBar + this.classTarget(d.id);
}; };
c3_chart_internal_fn.classChartArc = function (d) { c3_chart_internal_fn.classChartArc = function (d) {
return CLASS[_chartArc] + this.classTarget(d.data.id); return CLASS.chartArc + this.classTarget(d.data.id);
}; };
c3_chart_internal_fn.getTargetSelectorSuffix = function (targetId) { c3_chart_internal_fn.getTargetSelectorSuffix = function (targetId) {
return targetId || targetId === 0 ? '-' + (targetId.replace ? targetId.replace(/([^a-zA-Z0-9-_])/g, '-') : targetId) : ''; return targetId || targetId === 0 ? '-' + (targetId.replace ? targetId.replace(/([^a-zA-Z0-9-_])/g, '-') : targetId) : '';
}; };
c3_chart_internal_fn.selectorTarget = function (id) { c3_chart_internal_fn.selectorTarget = function (id) {
return '.' + CLASS[_target] + this.getTargetSelectorSuffix(id); return '.' + CLASS.target + this.getTargetSelectorSuffix(id);
}; };
c3_chart_internal_fn.selectorTargets = function (ids) { c3_chart_internal_fn.selectorTargets = function (ids) {
var $$ = this; var $$ = this;
return ids.length ? ids.map(function (id) { return $$.selectorTarget(id); }) : null; return ids.length ? ids.map(function (id) { return $$.selectorTarget(id); }) : null;
}; };
c3_chart_internal_fn.selectorLegend = function (id) { c3_chart_internal_fn.selectorLegend = function (id) {
return '.' + CLASS[_legendItem] + this.getTargetSelectorSuffix(id); return '.' + CLASS.legendItem + this.getTargetSelectorSuffix(id);
}; };
c3_chart_internal_fn.selectorLegends = function (ids) { c3_chart_internal_fn.selectorLegends = function (ids) {
var $$ = this; var $$ = this;

28
src/core.js
Unescape View File

@ -204,7 +204,7 @@ c3_chart_internal_fn.initWithData = function (data) {
// text when empty // text when empty
main.append("text") main.append("text")
.attr("class", CLASS[_text] + ' ' + CLASS[_empty]) .attr("class", CLASS.text + ' ' + CLASS.empty)
.attr("text-anchor", "middle") // horizontal centering of text at x position in all browsers. .attr("text-anchor", "middle") // horizontal centering of text at x position in all browsers.
.attr("dominant-baseline", "middle"); // vertical centering of text at y position in all browsers, except IE. .attr("dominant-baseline", "middle"); // vertical centering of text at y position in all browsers, except IE.
@ -217,7 +217,7 @@ c3_chart_internal_fn.initWithData = function (data) {
// Define g for chart area // Define g for chart area
main.append('g') main.append('g')
.attr("clip-path", $$.clipPath) .attr("clip-path", $$.clipPath)
.attr('class', CLASS[_chart]); .attr('class', CLASS.chart);
// Cover whole with rects for events // Cover whole with rects for events
$$.initEventRect(); $$.initEventRect();
@ -237,8 +237,8 @@ c3_chart_internal_fn.initWithData = function (data) {
// if zoom privileged, insert rect to forefront // if zoom privileged, insert rect to forefront
// TODO: is this needed? // TODO: is this needed?
main.insert('rect', config.zoom_privileged ? null : 'g.' + CLASS[_regions]) main.insert('rect', config.zoom_privileged ? null : 'g.' + CLASS.regions)
.attr('class', CLASS[_zoomRect]) .attr('class', CLASS.zoomRect)
.attr('width', $$.width) .attr('width', $$.width)
.attr('height', $$.height) .attr('height', $$.height)
.style('opacity', 0) .style('opacity', 0)
@ -394,7 +394,7 @@ c3_chart_internal_fn.updateTargets = function (targets) {
/*-- Show --*/ /*-- Show --*/
// Fade-in each chart // Fade-in each chart
$$.svg.selectAll('.' + CLASS[_target]).filter(function (d) { return $$.isTargetToShow(d.id); }) $$.svg.selectAll('.' + CLASS.target).filter(function (d) { return $$.isTargetToShow(d.id); })
.transition().duration(config.transition_duration) .transition().duration(config.transition_duration)
.style("opacity", 1); .style("opacity", 1);
}; };
@ -470,14 +470,14 @@ c3_chart_internal_fn.redraw = function (options, transitions) {
break; break;
} }
} }
$$.svg.selectAll('.' + CLASS[_axisX] + ' .tick text').each(function (e) { $$.svg.selectAll('.' + CLASS.axisX + ' .tick text').each(function (e) {
var index = tickValues.indexOf(e); var index = tickValues.indexOf(e);
if (index >= 0) { if (index >= 0) {
d3.select(this).style('display', index % intervalForCulling ? 'none' : 'block'); d3.select(this).style('display', index % intervalForCulling ? 'none' : 'block');
} }
}); });
} else { } else {
$$.svg.selectAll('.' + CLASS[_axisX] + ' .tick text').style('display', 'block'); $$.svg.selectAll('.' + CLASS.axisX + ' .tick text').style('display', 'block');
} }
} }
@ -504,7 +504,7 @@ c3_chart_internal_fn.redraw = function (options, transitions) {
$$.updateXgridFocus(); $$.updateXgridFocus();
// Data empty label positioning and text. // Data empty label positioning and text.
main.select("text." + CLASS[_text] + '.' + CLASS[_empty]) main.select("text." + CLASS.text + '.' + CLASS.empty)
.attr("x", $$.width / 2) .attr("x", $$.width / 2)
.attr("y", $$.height / 2) .attr("y", $$.height / 2)
.text(config.data_empty_label_text) .text(config.data_empty_label_text)
@ -539,7 +539,7 @@ c3_chart_internal_fn.redraw = function (options, transitions) {
} }
// circles for select // circles for select
main.selectAll('.' + CLASS[_selectedCircles]) main.selectAll('.' + CLASS.selectedCircles)
.filter($$.isBarType.bind($$)) .filter($$.isBarType.bind($$))
.selectAll('circle') .selectAll('circle')
.remove(); .remove();
@ -691,26 +691,26 @@ c3_chart_internal_fn.transformMain = function (withTransition, transitions) {
if (transitions && transitions.axisX) { if (transitions && transitions.axisX) {
xAxis = transitions.axisX; xAxis = transitions.axisX;
} else { } else {
xAxis = $$.main.select('.' + CLASS[_axisX]); xAxis = $$.main.select('.' + CLASS.axisX);
if (withTransition) { xAxis = xAxis.transition(); } if (withTransition) { xAxis = xAxis.transition(); }
} }
if (transitions && transitions.axisY) { if (transitions && transitions.axisY) {
yAxis = transitions.axisY; yAxis = transitions.axisY;
} else { } else {
yAxis = $$.main.select('.' + CLASS[_axisY]); yAxis = $$.main.select('.' + CLASS.axisY);
if (withTransition) { yAxis = yAxis.transition(); } if (withTransition) { yAxis = yAxis.transition(); }
} }
if (transitions && transitions.axisY2) { if (transitions && transitions.axisY2) {
y2Axis = transitions.axisY2; y2Axis = transitions.axisY2;
} else { } else {
y2Axis = $$.main.select('.' + CLASS[_axisY2]); y2Axis = $$.main.select('.' + CLASS.axisY2);
if (withTransition) { y2Axis = y2Axis.transition(); } if (withTransition) { y2Axis = y2Axis.transition(); }
} }
(withTransition ? $$.main.transition() : $$.main).attr("transform", $$.getTranslate('main')); (withTransition ? $$.main.transition() : $$.main).attr("transform", $$.getTranslate('main'));
xAxis.attr("transform", $$.getTranslate('x')); xAxis.attr("transform", $$.getTranslate('x'));
yAxis.attr("transform", $$.getTranslate('y')); yAxis.attr("transform", $$.getTranslate('y'));
y2Axis.attr("transform", $$.getTranslate('y2')); y2Axis.attr("transform", $$.getTranslate('y2'));
$$.main.select('.' + CLASS[_chartArcs]).attr("transform", $$.getTranslate('arc')); $$.main.select('.' + CLASS.chartArcs).attr("transform", $$.getTranslate('arc'));
}; };
c3_chart_internal_fn.transformAll = function (withTransition, transitions) { c3_chart_internal_fn.transformAll = function (withTransition, transitions) {
var $$ = this; var $$ = this;
@ -735,7 +735,7 @@ c3_chart_internal_fn.updateSvgSize = function () {
.attr('y', $$.getYAxisClipY.bind($$)) .attr('y', $$.getYAxisClipY.bind($$))
.attr('width', $$.getYAxisClipWidth.bind($$)) .attr('width', $$.getYAxisClipWidth.bind($$))
.attr('height', $$.getYAxisClipHeight.bind($$)); .attr('height', $$.getYAxisClipHeight.bind($$));
$$.svg.select('.' + CLASS[_zoomRect]) $$.svg.select('.' + CLASS.zoomRect)
.attr('width', $$.width) .attr('width', $$.width)
.attr('height', $$.height); .attr('height', $$.height);
// MEMO: parent div's height will be bigger than svg when <!DOCTYPE html> // MEMO: parent div's height will be bigger than svg when <!DOCTYPE html>

2
src/data.load.js
Unescape View File

@ -77,7 +77,7 @@ c3_chart_internal_fn.unload = function (targetIds, done) {
$$.withoutFadeIn[id] = false; $$.withoutFadeIn[id] = false;
// Remove target's elements // Remove target's elements
if ($$.legend) { if ($$.legend) {
$$.legend.selectAll('.' + CLASS[_legendItem] + $$.getTargetSelectorSuffix(id)).remove(); $$.legend.selectAll('.' + CLASS.legendItem + $$.getTargetSelectorSuffix(id)).remove();
} }
// Remove target // Remove target
$$.data.targets = $$.data.targets.filter(function (t) { $$.data.targets = $$.data.targets.filter(function (t) {

26
src/drag.js
Unescape View File

@ -16,26 +16,26 @@ c3_chart_internal_fn.drag = function (mouse) {
minY = (config.data_selection_grouped) ? $$.margin.top : Math.min(sy, my); minY = (config.data_selection_grouped) ? $$.margin.top : Math.min(sy, my);
maxY = (config.data_selection_grouped) ? $$.height : Math.max(sy, my); maxY = (config.data_selection_grouped) ? $$.height : Math.max(sy, my);
main.select('.' + CLASS[_dragarea]) main.select('.' + CLASS.dragarea)
.attr('x', minX) .attr('x', minX)
.attr('y', minY) .attr('y', minY)
.attr('width', maxX - minX) .attr('width', maxX - minX)
.attr('height', maxY - minY); .attr('height', maxY - minY);
// TODO: binary search when multiple xs // TODO: binary search when multiple xs
main.selectAll('.' + CLASS[_shapes]).selectAll('.' + CLASS[_shape]) main.selectAll('.' + CLASS.shapes).selectAll('.' + CLASS.shape)
.filter(function (d) { return config.data_selection_isselectable(d); }) .filter(function (d) { return config.data_selection_isselectable(d); })
.each(function (d, i) { .each(function (d, i) {
var shape = d3.select(this), var shape = d3.select(this),
isSelected = shape.classed(CLASS[_SELECTED]), isSelected = shape.classed(CLASS.SELECTED),
isIncluded = shape.classed(CLASS[_INCLUDED]), isIncluded = shape.classed(CLASS.INCLUDED),
_x, _y, _w, _h, toggle, isWithin = false, box; _x, _y, _w, _h, toggle, isWithin = false, box;
if (shape.classed(CLASS[_circle])) { if (shape.classed(CLASS.circle)) {
_x = shape.attr("cx") * 1; _x = shape.attr("cx") * 1;
_y = shape.attr("cy") * 1; _y = shape.attr("cy") * 1;
toggle = $$.togglePoint; toggle = $$.togglePoint;
isWithin = minX < _x && _x < maxX && minY < _y && _y < maxY; isWithin = minX < _x && _x < maxX && minY < _y && _y < maxY;
} }
else if (shape.classed(CLASS[_bar])) { else if (shape.classed(CLASS.bar)) {
box = getPathBox(this); box = getPathBox(this);
_x = box.x; _x = box.x;
_y = box.y; _y = box.y;
@ -48,9 +48,9 @@ c3_chart_internal_fn.drag = function (mouse) {
return; return;
} }
if (isWithin ^ isIncluded) { if (isWithin ^ isIncluded) {
shape.classed(CLASS[_INCLUDED], !isIncluded); shape.classed(CLASS.INCLUDED, !isIncluded);
// TODO: included/unincluded callback here // TODO: included/unincluded callback here
shape.classed(CLASS[_SELECTED], !isSelected); shape.classed(CLASS.SELECTED, !isSelected);
toggle.call($$, !isSelected, shape, d, i); toggle.call($$, !isSelected, shape, d, i);
} }
}); });
@ -61,8 +61,8 @@ c3_chart_internal_fn.dragstart = function (mouse) {
if ($$.hasArcType()) { return; } if ($$.hasArcType()) { return; }
if (! config.data_selection_enabled) { return; } // do nothing if not selectable if (! config.data_selection_enabled) { return; } // do nothing if not selectable
$$.dragStart = mouse; $$.dragStart = mouse;
$$.main.select('.' + CLASS[_chart]).append('rect') $$.main.select('.' + CLASS.chart).append('rect')
.attr('class', CLASS[_dragarea]) .attr('class', CLASS.dragarea)
.style('opacity', 0.1); .style('opacity', 0.1);
$$.dragging = true; $$.dragging = true;
$$.config.data_ondragstart(); $$.config.data_ondragstart();
@ -72,12 +72,12 @@ c3_chart_internal_fn.dragend = function () {
var $$ = this, config = $$.config; var $$ = this, config = $$.config;
if ($$.hasArcType()) { return; } if ($$.hasArcType()) { return; }
if (! config.data_selection_enabled) { return; } // do nothing if not selectable if (! config.data_selection_enabled) { return; } // do nothing if not selectable
$$.main.select('.' + CLASS[_dragarea]) $$.main.select('.' + CLASS.dragarea)
.transition().duration(100) .transition().duration(100)
.style('opacity', 0) .style('opacity', 0)
.remove(); .remove();
$$.main.selectAll('.' + CLASS[_shape]) $$.main.selectAll('.' + CLASS.shape)
.classed(CLASS[_INCLUDED], false); .classed(CLASS.INCLUDED, false);
$$.dragging = false; $$.dragging = false;
$$.config.data_ondragend(); $$.config.data_ondragend();
}; };

52
src/grid.js
Unescape View File

@ -1,28 +1,28 @@
c3_chart_internal_fn.initGrid = function () { c3_chart_internal_fn.initGrid = function () {
var $$ = this, config = $$.config, CLASS = $$.CLASS, d3 = $$.d3; var $$ = this, config = $$.config, d3 = $$.d3;
$$.grid = $$.main.append('g') $$.grid = $$.main.append('g')
.attr("clip-path", $$.clipPath) .attr("clip-path", $$.clipPath)
.attr('class', CLASS[_grid]); .attr('class', CLASS.grid);
if (config.grid_x_show) { if (config.grid_x_show) {
$$.grid.append("g").attr("class", CLASS[_xgrids]); $$.grid.append("g").attr("class", CLASS.xgrids);
} }
if (config.grid_y_show) { if (config.grid_y_show) {
$$.grid.append('g').attr('class', CLASS[_ygrids]); $$.grid.append('g').attr('class', CLASS.ygrids);
} }
$$.grid.append('g').attr("class", CLASS[_xgridLines]); $$.grid.append('g').attr("class", CLASS.xgridLines);
$$.grid.append('g').attr('class', CLASS[_ygridLines]); $$.grid.append('g').attr('class', CLASS.ygridLines);
if (config.grid_focus_show) { if (config.grid_focus_show) {
$$.grid.append('g') $$.grid.append('g')
.attr("class", CLASS[_xgridFocus]) .attr("class", CLASS.xgridFocus)
.append('line') .append('line')
.attr('class', CLASS[_xgridFocus]); .attr('class', CLASS.xgridFocus);
} }
$$.xgrid = d3.selectAll([]); $$.xgrid = d3.selectAll([]);
$$.xgridLines = d3.selectAll([]); $$.xgridLines = d3.selectAll([]);
}; };
c3_chart_internal_fn.updateXGrid = function (withoutUpdate) { c3_chart_internal_fn.updateXGrid = function (withoutUpdate) {
var $$ = this, config = $$.config, CLASS = $$.CLASS, d3 = $$.d3, var $$ = this, config = $$.config, d3 = $$.d3,
xgridData = $$.generateGridData(config.grid_x_type, $$.x), xgridData = $$.generateGridData(config.grid_x_type, $$.x),
tickOffset = $$.isCategorized() ? $$.xAxis.tickOffset() : 0; tickOffset = $$.isCategorized() ? $$.xAxis.tickOffset() : 0;
@ -38,9 +38,9 @@ c3_chart_internal_fn.updateXGrid = function (withoutUpdate) {
'y2': $$.height 'y2': $$.height
}; };
$$.xgrid = $$.main.select('.' + CLASS[_xgrids]).selectAll('.' + CLASS[_xgrid]) $$.xgrid = $$.main.select('.' + CLASS.xgrids).selectAll('.' + CLASS.xgrid)
.data(xgridData); .data(xgridData);
$$.xgrid.enter().append('line').attr("class", CLASS[_xgrid]); $$.xgrid.enter().append('line').attr("class", CLASS.xgrid);
if (!withoutUpdate) { if (!withoutUpdate) {
$$.xgrid.attr($$.xgridAttr) $$.xgrid.attr($$.xgridAttr)
.style("opacity", function () { return +d3.select(this).attr(config.axis_rotated ? 'y1' : 'x1') === (config.axis_rotated ? $$.height : 0) ? 0 : 1; }); .style("opacity", function () { return +d3.select(this).attr(config.axis_rotated ? 'y1' : 'x1') === (config.axis_rotated ? $$.height : 0) ? 0 : 1; });
@ -49,11 +49,11 @@ c3_chart_internal_fn.updateXGrid = function (withoutUpdate) {
}; };
c3_chart_internal_fn.updateYGrid = function () { c3_chart_internal_fn.updateYGrid = function () {
var $$ = this, config = $$.config, CLASS = $$.CLASS; var $$ = this, config = $$.config;
$$.ygrid = $$.main.select('.' + CLASS[_ygrids]).selectAll('.' + CLASS[_ygrid]) $$.ygrid = $$.main.select('.' + CLASS.ygrids).selectAll('.' + CLASS.ygrid)
.data($$.y.ticks(config.grid_y_ticks)); .data($$.y.ticks(config.grid_y_ticks));
$$.ygrid.enter().append('line') $$.ygrid.enter().append('line')
.attr('class', CLASS[_ygrid]); .attr('class', CLASS.ygrid);
$$.ygrid.attr("x1", config.axis_rotated ? $$.y : 0) $$.ygrid.attr("x1", config.axis_rotated ? $$.y : 0)
.attr("x2", config.axis_rotated ? $$.y : $$.width) .attr("x2", config.axis_rotated ? $$.y : $$.width)
.attr("y1", config.axis_rotated ? 0 : $$.y) .attr("y1", config.axis_rotated ? 0 : $$.y)
@ -64,17 +64,17 @@ c3_chart_internal_fn.updateYGrid = function () {
c3_chart_internal_fn.redrawGrid = function (duration, withY) { c3_chart_internal_fn.redrawGrid = function (duration, withY) {
var $$ = this, main = $$.main, config = $$.config, CLASS = $$.CLASS, var $$ = this, main = $$.main, config = $$.config,
xgridLine, ygridLine, yv; xgridLine, ygridLine, yv;
main.select('line.' + CLASS[_xgridFocus]).style("visibility", "hidden"); main.select('line.' + CLASS.xgridFocus).style("visibility", "hidden");
if (config.grid_x_show) { if (config.grid_x_show) {
$$.updateXGrid(); $$.updateXGrid();
} }
$$.xgridLines = main.select('.' + CLASS[_xgridLines]).selectAll('.' + CLASS[_xgridLine]) $$.xgridLines = main.select('.' + CLASS.xgridLines).selectAll('.' + CLASS.xgridLine)
.data(config.grid_x_lines); .data(config.grid_x_lines);
// enter // enter
xgridLine = $$.xgridLines.enter().append('g') xgridLine = $$.xgridLines.enter().append('g')
.attr("class", function (d) { return CLASS[_xgridLine] + (d.class ? ' ' + d.class : ''); }); .attr("class", function (d) { return CLASS.xgridLine + (d.class ? ' ' + d.class : ''); });
xgridLine.append('line') xgridLine.append('line')
.style("opacity", 0); .style("opacity", 0);
xgridLine.append('text') xgridLine.append('text')
@ -95,11 +95,11 @@ c3_chart_internal_fn.redrawGrid = function (duration, withY) {
$$.updateYGrid(); $$.updateYGrid();
} }
if (withY) { if (withY) {
$$.ygridLines = main.select('.' + CLASS[_ygridLines]).selectAll('.' + CLASS[_ygridLine]) $$.ygridLines = main.select('.' + CLASS.ygridLines).selectAll('.' + CLASS.ygridLine)
.data(config.grid_y_lines); .data(config.grid_y_lines);
// enter // enter
ygridLine = $$.ygridLines.enter().append('g') ygridLine = $$.ygridLines.enter().append('g')
.attr("class", function (d) { return CLASS[_ygridLine] + (d.class ? ' ' + d.class : ''); }); .attr("class", function (d) { return CLASS.ygridLine + (d.class ? ' ' + d.class : ''); });
ygridLine.append('line') ygridLine.append('line')
.style("opacity", 0); .style("opacity", 0);
ygridLine.append('text') ygridLine.append('text')
@ -146,7 +146,7 @@ c3_chart_internal_fn.addTransitionForGrid = function (transitions) {
c3_chart_internal_fn.showXGridFocus = function (selectedData) { c3_chart_internal_fn.showXGridFocus = function (selectedData) {
var $$ = this, config = $$.config, var $$ = this, config = $$.config,
dataToShow = selectedData.filter(function (d) { return d && isValue(d.value); }), dataToShow = selectedData.filter(function (d) { return d && isValue(d.value); }),
focusEl = $$.main.selectAll('line.' + CLASS[_xgridFocus]), focusEl = $$.main.selectAll('line.' + CLASS.xgridFocus),
xx = $$.xx.bind($$); xx = $$.xx.bind($$);
if (! config.tooltip_show) { return; } if (! config.tooltip_show) { return; }
// Hide when scatter plot exists // Hide when scatter plot exists
@ -159,11 +159,11 @@ c3_chart_internal_fn.showXGridFocus = function (selectedData) {
$$.smoothLines(focusEl, 'grid'); $$.smoothLines(focusEl, 'grid');
}; };
c3_chart_internal_fn.hideXGridFocus = function () { c3_chart_internal_fn.hideXGridFocus = function () {
this.main.select('line.' + CLASS[_xgridFocus]).style("visibility", "hidden"); this.main.select('line.' + CLASS.xgridFocus).style("visibility", "hidden");
}; };
c3_chart_internal_fn.updateXgridFocus = function () { c3_chart_internal_fn.updateXgridFocus = function () {
var $$ = this, config = $$.config; var $$ = this, config = $$.config;
$$.main.select('line.' + CLASS[_xgridFocus]) $$.main.select('line.' + CLASS.xgridFocus)
.attr("x1", config.axis_rotated ? 0 : -10) .attr("x1", config.axis_rotated ? 0 : -10)
.attr("x2", config.axis_rotated ? $$.width : -10) .attr("x2", config.axis_rotated ? $$.width : -10)
.attr("y1", config.axis_rotated ? -10 : 0) .attr("y1", config.axis_rotated ? -10 : 0)
@ -172,7 +172,7 @@ c3_chart_internal_fn.updateXgridFocus = function () {
c3_chart_internal_fn.generateGridData = function (type, scale) { c3_chart_internal_fn.generateGridData = function (type, scale) {
var $$ = this, var $$ = this,
gridData = [], xDomain, firstYear, lastYear, i, gridData = [], xDomain, firstYear, lastYear, i,
tickNum = $$.main.select("." + CLASS[_axisX]).selectAll('.tick').size(); tickNum = $$.main.select("." + CLASS.axisX).selectAll('.tick').size();
if (type === 'year') { if (type === 'year') {
xDomain = $$.getXDomain(); xDomain = $$.getXDomain();
firstYear = xDomain[0].getFullYear(); firstYear = xDomain[0].getFullYear();
@ -203,8 +203,8 @@ c3_chart_internal_fn.removeGridLines = function (params, forX) {
var $$ = this, config = $$.config, var $$ = this, config = $$.config,
toRemove = $$.getGridFilterToRemove(params), toRemove = $$.getGridFilterToRemove(params),
toShow = function (line) { return !toRemove(line); }, toShow = function (line) { return !toRemove(line); },
classLines = forX ? CLASS[_xgridLines] : CLASS[_ygridLines], classLines = forX ? CLASS.xgridLines : CLASS.ygridLines,
classLine = forX ? CLASS[_xgridLine] : CLASS.ygridLine; classLine = forX ? CLASS.xgridLine : CLASS.ygridLine;
$$.main.select('.' + classLines).selectAll('.' + classLine).filter(toRemove) $$.main.select('.' + classLines).selectAll('.' + classLine).filter(toRemove)
.transition().duration(config.transition_duration) .transition().duration(config.transition_duration)
.style('opacity', 0).remove(); .style('opacity', 0).remove();

40
src/interaction.js
Unescape View File

@ -1,25 +1,25 @@
c3_chart_internal_fn.initEventRect = function () { c3_chart_internal_fn.initEventRect = function () {
var $$ = this, CLASS = $$.CLASS; var $$ = this;
$$.main.select('.' + CLASS[_chart]).append("g") $$.main.select('.' + CLASS.chart).append("g")
.attr("class", CLASS[_eventRects]) .attr("class", CLASS.eventRects)
.style('fill-opacity', 0); .style('fill-opacity', 0);
}; };
c3_chart_internal_fn.redrawEventRect = function () { c3_chart_internal_fn.redrawEventRect = function () {
var $$ = this, config = $$.config, CLASS = $$.CLASS, var $$ = this, config = $$.config,
eventRectUpdate, maxDataCountTarget, eventRectUpdate, maxDataCountTarget,
isMultipleX = $$.isMultipleX(); isMultipleX = $$.isMultipleX();
// rects for mouseover // rects for mouseover
var eventRects = $$.main.select('.' + CLASS[_eventRects]) var eventRects = $$.main.select('.' + CLASS.eventRects)
.style('cursor', config.zoom_enabled ? config.axis_rotated ? 'ns-resize' : 'ew-resize' : null) .style('cursor', config.zoom_enabled ? config.axis_rotated ? 'ns-resize' : 'ew-resize' : null)
.classed(CLASS[_eventRectsMultiple], isMultipleX) .classed(CLASS.eventRectsMultiple, isMultipleX)
.classed(CLASS[_eventRectsSingle], !isMultipleX); .classed(CLASS.eventRectsSingle, !isMultipleX);
// clear old rects // clear old rects
eventRects.selectAll('.' + CLASS[_eventRect]).remove(); eventRects.selectAll('.' + CLASS.eventRect).remove();
// open as public variable // open as public variable
$$.eventRect = eventRects.selectAll('.' + CLASS[_eventRect]); $$.eventRect = eventRects.selectAll('.' + CLASS.eventRect);
if (isMultipleX) { if (isMultipleX) {
eventRectUpdate = $$.eventRect.data([0]); eventRectUpdate = $$.eventRect.data([0]);
@ -33,7 +33,7 @@ c3_chart_internal_fn.redrawEventRect = function () {
// Set data and update $$.eventRect // Set data and update $$.eventRect
maxDataCountTarget = $$.getMaxDataCountTarget($$.data.targets); maxDataCountTarget = $$.getMaxDataCountTarget($$.data.targets);
eventRects.datum(maxDataCountTarget ? maxDataCountTarget.values : []); eventRects.datum(maxDataCountTarget ? maxDataCountTarget.values : []);
$$.eventRect = eventRects.selectAll('.' + CLASS[_eventRect]); $$.eventRect = eventRects.selectAll('.' + CLASS.eventRect);
eventRectUpdate = $$.eventRect.data(function (d) { return d; }); eventRectUpdate = $$.eventRect.data(function (d) { return d; });
// enter // enter
$$.generateEventRectsForSingleX(eventRectUpdate.enter()); $$.generateEventRectsForSingleX(eventRectUpdate.enter());
@ -120,7 +120,7 @@ c3_chart_internal_fn.generateEventRectsForSingleX = function (eventRectEnter) {
$$.expandBars(index); $$.expandBars(index);
// Call event handler // Call event handler
$$.main.selectAll('.' + CLASS[_shape] + '-' + index).each(function (d) { $$.main.selectAll('.' + CLASS.shape + '-' + index).each(function (d) {
config.data_onmouseover.call($$, d); config.data_onmouseover.call($$, d);
}); });
}) })
@ -133,13 +133,13 @@ c3_chart_internal_fn.generateEventRectsForSingleX = function (eventRectEnter) {
$$.unexpandCircles(index); $$.unexpandCircles(index);
$$.unexpandBars(); $$.unexpandBars();
// Call event handler // Call event handler
$$.main.selectAll('.' + CLASS[_shape] + '-' + index).each(function (d) { $$.main.selectAll('.' + CLASS.shape + '-' + index).each(function (d) {
config.data_onmouseout.call($$, d); config.data_onmouseout.call($$, d);
}); });
}) })
.on('mousemove', function (d) { .on('mousemove', function (d) {
var selectedData, index = d.index, var selectedData, index = d.index,
eventRect = $$.svg.select('.' + CLASS[_eventRect] + '-' + index); eventRect = $$.svg.select('.' + CLASS.eventRect + '-' + index);
if ($$.dragging) { return; } // do nothing when dragging if ($$.dragging) { return; } // do nothing when dragging
if ($$.hasArcType()) { return; } if ($$.hasArcType()) { return; }
@ -158,9 +158,9 @@ c3_chart_internal_fn.generateEventRectsForSingleX = function (eventRectEnter) {
return; return;
} }
$$.main.selectAll('.' + CLASS[_shape] + '-' + index) $$.main.selectAll('.' + CLASS.shape + '-' + index)
.each(function () { .each(function () {
d3.select(this).classed(CLASS[_EXPANDED], true); d3.select(this).classed(CLASS.EXPANDED, true);
if (config.data_selection_enabled) { if (config.data_selection_enabled) {
eventRect.style('cursor', config.data_selection_grouped ? 'pointer' : null); eventRect.style('cursor', config.data_selection_grouped ? 'pointer' : null);
} }
@ -200,7 +200,7 @@ c3_chart_internal_fn.generateEventRectsForSingleX = function (eventRectEnter) {
$$.cancelClick = false; $$.cancelClick = false;
return; return;
} }
$$.main.selectAll('.' + CLASS[_shape] + '-' + index).each(function (d) { $$.main.selectAll('.' + CLASS.shape + '-' + index).each(function (d) {
$$.toggleShape(this, d, index); $$.toggleShape(this, d, index);
}); });
}) })
@ -220,7 +220,7 @@ c3_chart_internal_fn.generateEventRectsForMultipleXs = function (eventRectEnter)
.attr('y', 0) .attr('y', 0)
.attr('width', $$.width) .attr('width', $$.width)
.attr('height', $$.height) .attr('height', $$.height)
.attr('class', CLASS[_eventRect]) .attr('class', CLASS.eventRect)
.on('mouseout', function () { .on('mouseout', function () {
if ($$.hasArcType()) { return; } if ($$.hasArcType()) { return; }
$$.hideXGridFocus(); $$.hideXGridFocus();
@ -262,13 +262,13 @@ c3_chart_internal_fn.generateEventRectsForMultipleXs = function (eventRectEnter)
// Show cursor as pointer if point is close to mouse position // Show cursor as pointer if point is close to mouse position
if ($$.dist(closest, mouse) < 100) { if ($$.dist(closest, mouse) < 100) {
$$.svg.select('.' + CLASS[_eventRect]).style('cursor', 'pointer'); $$.svg.select('.' + CLASS.eventRect).style('cursor', 'pointer');
if (!$$.mouseover) { if (!$$.mouseover) {
config.data_onmouseover.call($$, closest); config.data_onmouseover.call($$, closest);
$$.mouseover = true; $$.mouseover = true;
} }
} else if ($$.mouseover) { } else if ($$.mouseover) {
$$.svg.select('.' + CLASS[_eventRect]).style('cursor', null); $$.svg.select('.' + CLASS.eventRect).style('cursor', null);
config.data_onmouseout.call($$, closest); config.data_onmouseout.call($$, closest);
$$.mouseover = false; $$.mouseover = false;
} }
@ -286,7 +286,7 @@ c3_chart_internal_fn.generateEventRectsForMultipleXs = function (eventRectEnter)
// select if selection enabled // select if selection enabled
if ($$.dist(closest, mouse) < 100 && $$.toggleShape) { if ($$.dist(closest, mouse) < 100 && $$.toggleShape) {
$$.main.select('.' + CLASS[_circles] + $$.getTargetSelectorSuffix(closest.id)).select('.' + CLASS[_circle] + '-' + closest.index).each(function () { $$.main.select('.' + CLASS.circles + $$.getTargetSelectorSuffix(closest.id)).select('.' + CLASS.circle + '-' + closest.index).each(function () {
$$.toggleShape(this, closest, closest.index); $$.toggleShape(this, closest, closest.index);
}); });
} }

38
src/legend.js
Unescape View File

@ -53,15 +53,15 @@ c3_chart_internal_fn.getLegendHeight = function () {
}; };
c3_chart_internal_fn.opacityForLegend = function (legendItem) { c3_chart_internal_fn.opacityForLegend = function (legendItem) {
var $$ = this; var $$ = this;
return legendItem.classed(CLASS[_legendItemHidden]) ? $$.legendOpacityForHidden : 1; return legendItem.classed(CLASS.legendItemHidden) ? $$.legendOpacityForHidden : 1;
}; };
c3_chart_internal_fn.opacityForUnfocusedLegend = function (legendItem) { c3_chart_internal_fn.opacityForUnfocusedLegend = function (legendItem) {
var $$ = this; var $$ = this;
return legendItem.classed(CLASS[_legendItemHidden]) ? $$.legendOpacityForHidden : 0.3; return legendItem.classed(CLASS.legendItemHidden) ? $$.legendOpacityForHidden : 0.3;
}; };
c3_chart_internal_fn.toggleFocusLegend = function (id, focus) { c3_chart_internal_fn.toggleFocusLegend = function (id, focus) {
var $$ = this; var $$ = this;
$$.legend.selectAll('.' + CLASS[_legendItem]) $$.legend.selectAll('.' + CLASS.legendItem)
.transition().duration(100) .transition().duration(100)
.style('opacity', function (_id) { .style('opacity', function (_id) {
var This = $$.d3.select(this); var This = $$.d3.select(this);
@ -74,7 +74,7 @@ c3_chart_internal_fn.toggleFocusLegend = function (id, focus) {
}; };
c3_chart_internal_fn.revertLegend = function () { c3_chart_internal_fn.revertLegend = function () {
var $$ = this, d3 = $$.d3; var $$ = this, d3 = $$.d3;
$$.legend.selectAll('.' + CLASS[_legendItem]) $$.legend.selectAll('.' + CLASS.legendItem)
.transition().duration(100) .transition().duration(100)
.style('opacity', function () { return $$.opacityForLegend(d3.select(this)); }); .style('opacity', function () { return $$.opacityForLegend(d3.select(this)); });
}; };
@ -107,7 +107,7 @@ c3_chart_internal_fn.updateLegend = function (targetIds, options, transitions) {
var paddingTop = 4, paddingRight = 36, maxWidth = 0, maxHeight = 0, posMin = 10; var paddingTop = 4, paddingRight = 36, maxWidth = 0, maxHeight = 0, posMin = 10;
var l, totalLength = 0, offsets = {}, widths = {}, heights = {}, margins = [0], steps = {}, step = 0; var l, totalLength = 0, offsets = {}, widths = {}, heights = {}, margins = [0], steps = {}, step = 0;
var withTransition, withTransitionForTransform; var withTransition, withTransitionForTransform;
var hasFocused = $$.legend.selectAll('.' + CLASS[_legendItemFocused]).size(); var hasFocused = $$.legend.selectAll('.' + CLASS.legendItemFocused).size();
var texts, rects, tiles; var texts, rects, tiles;
options = options || {}; options = options || {};
@ -115,7 +115,7 @@ c3_chart_internal_fn.updateLegend = function (targetIds, options, transitions) {
withTransitionForTransform = getOption(options, "withTransitionForTransform", true); withTransitionForTransform = getOption(options, "withTransitionForTransform", true);
function updatePositions(textElement, id, reset) { function updatePositions(textElement, id, reset) {
var box = $$.getTextRect(textElement.textContent, CLASS[_legendItem]), var box = $$.getTextRect(textElement.textContent, CLASS.legendItem),
itemWidth = Math.ceil((box.width + paddingRight) / 10) * 10, itemWidth = Math.ceil((box.width + paddingRight) / 10) * 10,
itemHeight = Math.ceil((box.height + paddingTop) / 10) * 10, itemHeight = Math.ceil((box.height + paddingTop) / 10) * 10,
itemLength = $$.isLegendRight || $$.isLegendInset ? itemHeight : itemWidth, itemLength = $$.isLegendRight || $$.isLegendInset ? itemHeight : itemWidth,
@ -190,17 +190,17 @@ c3_chart_internal_fn.updateLegend = function (targetIds, options, transitions) {
yForLegendRect = function (id, i) { return yForLegend(id, i) - 7; }; yForLegendRect = function (id, i) { return yForLegend(id, i) - 7; };
// Define g for legend area // Define g for legend area
l = $$.legend.selectAll('.' + CLASS[_legendItem]) l = $$.legend.selectAll('.' + CLASS.legendItem)
.data(targetIds) .data(targetIds)
.enter().append('g') .enter().append('g')
.attr('class', function (id) { return $$.generateClass(CLASS[_legendItem], id); }) .attr('class', function (id) { return $$.generateClass(CLASS.legendItem, id); })
.style('visibility', function (id) { return $$.isLegendToShow(id) ? 'visible' : 'hidden'; }) .style('visibility', function (id) { return $$.isLegendToShow(id) ? 'visible' : 'hidden'; })
.style('cursor', 'pointer') .style('cursor', 'pointer')
.on('click', function (id) { .on('click', function (id) {
config.legend_item_onclick ? config.legend_item_onclick.call($$, id) : $$.api.toggle(id); config.legend_item_onclick ? config.legend_item_onclick.call($$, id) : $$.api.toggle(id);
}) })
.on('mouseover', function (id) { .on('mouseover', function (id) {
$$.d3.select(this).classed(CLASS[_legendItemFocused], true); $$.d3.select(this).classed(CLASS.legendItemFocused, true);
if (!$$.transiting) { if (!$$.transiting) {
$$.api.focus(id); $$.api.focus(id);
} }
@ -209,7 +209,7 @@ c3_chart_internal_fn.updateLegend = function (targetIds, options, transitions) {
} }
}) })
.on('mouseout', function (id) { .on('mouseout', function (id) {
$$.d3.select(this).classed(CLASS[_legendItemFocused], false); $$.d3.select(this).classed(CLASS.legendItemFocused, false);
if (!$$.transiting) { if (!$$.transiting) {
$$.api.revert(); $$.api.revert();
} }
@ -224,12 +224,12 @@ c3_chart_internal_fn.updateLegend = function (targetIds, options, transitions) {
.attr('x', $$.isLegendRight || $$.isLegendInset ? xForLegendText : -200) .attr('x', $$.isLegendRight || $$.isLegendInset ? xForLegendText : -200)
.attr('y', $$.isLegendRight || $$.isLegendInset ? -200 : yForLegendText); .attr('y', $$.isLegendRight || $$.isLegendInset ? -200 : yForLegendText);
l.append('rect') l.append('rect')
.attr("class", CLASS[_legendItemEvent]) .attr("class", CLASS.legendItemEvent)
.style('fill-opacity', 0) .style('fill-opacity', 0)
.attr('x', $$.isLegendRight || $$.isLegendInset ? xForLegendRect : -200) .attr('x', $$.isLegendRight || $$.isLegendInset ? xForLegendRect : -200)
.attr('y', $$.isLegendRight || $$.isLegendInset ? -200 : yForLegendRect); .attr('y', $$.isLegendRight || $$.isLegendInset ? -200 : yForLegendRect);
l.append('rect') l.append('rect')
.attr("class", CLASS[_legendItemTile]) .attr("class", CLASS.legendItemTile)
.style("pointer-events", "none") .style("pointer-events", "none")
.style('fill', $$.color) .style('fill', $$.color)
.attr('x', $$.isLegendRight || $$.isLegendInset ? xForLegendText : -200) .attr('x', $$.isLegendRight || $$.isLegendInset ? xForLegendText : -200)
@ -238,8 +238,8 @@ c3_chart_internal_fn.updateLegend = function (targetIds, options, transitions) {
.attr('height', 10); .attr('height', 10);
// Set background for inset legend // Set background for inset legend
if ($$.isLegendInset && maxWidth !== 0) { if ($$.isLegendInset && maxWidth !== 0) {
$$.legend.insert('g', '.' + CLASS[_legendItem]) $$.legend.insert('g', '.' + CLASS.legendItem)
.attr("class", CLASS[_legendBackground]) .attr("class", CLASS.legendBackground)
.append('rect') .append('rect')
.attr('height', $$.getLegendHeight() - 10) .attr('height', $$.getLegendHeight() - 10)
.attr('width', maxWidth * (step + 1) + 10); .attr('width', maxWidth * (step + 1) + 10);
@ -253,7 +253,7 @@ c3_chart_internal_fn.updateLegend = function (targetIds, options, transitions) {
.attr('x', xForLegendText) .attr('x', xForLegendText)
.attr('y', yForLegendText); .attr('y', yForLegendText);
rects = $$.legend.selectAll('rect.' + CLASS[_legendItemEvent]) rects = $$.legend.selectAll('rect.' + CLASS.legendItemEvent)
.data(targetIds); .data(targetIds);
(withTransition ? rects.transition() : rects) (withTransition ? rects.transition() : rects)
.attr('width', function (id) { return widths[id]; }) .attr('width', function (id) { return widths[id]; })
@ -261,7 +261,7 @@ c3_chart_internal_fn.updateLegend = function (targetIds, options, transitions) {
.attr('x', xForLegendRect) .attr('x', xForLegendRect)
.attr('y', yForLegendRect); .attr('y', yForLegendRect);
tiles = $$.legend.selectAll('rect.' + CLASS[_legendItemTile]) tiles = $$.legend.selectAll('rect.' + CLASS.legendItemTile)
.data(targetIds); .data(targetIds);
(withTransition ? tiles.transition() : tiles) (withTransition ? tiles.transition() : tiles)
.style('fill', $$.color) .style('fill', $$.color)
@ -269,13 +269,13 @@ c3_chart_internal_fn.updateLegend = function (targetIds, options, transitions) {
.attr('y', yForLegend); .attr('y', yForLegend);
// toggle legend state // toggle legend state
$$.legend.selectAll('.' + CLASS[_legendItem]) $$.legend.selectAll('.' + CLASS.legendItem)
.classed(CLASS[_legendItemHidden], function (id) { return !$$.isTargetToShow(id); }) .classed(CLASS.legendItemHidden, function (id) { return !$$.isTargetToShow(id); })
.transition() .transition()
.style('opacity', function (id) { .style('opacity', function (id) {
var This = $$.d3.select(this); var This = $$.d3.select(this);
if ($$.isTargetToShow(id)) { if ($$.isTargetToShow(id)) {
return !hasFocused || This.classed(CLASS[_legendItemFocused]) ? $$.opacityForLegend(This) : $$.opacityForUnfocusedLegend(This); return !hasFocused || This.classed(CLASS.legendItemFocused) ? $$.opacityForLegend(This) : $$.opacityForUnfocusedLegend(This);
} else { } else {
return $$.legendOpacityForHidden; return $$.legendOpacityForHidden;
} }

8
src/region.js
Unescape View File

@ -1,12 +1,12 @@
c3_chart_internal_fn.initRegion = function () { c3_chart_internal_fn.initRegion = function () {
var $$ = this, CLASS = $$.CLASS; var $$ = this;
$$.main.append('g') $$.main.append('g')
.attr("clip-path", $$.clipPath) .attr("clip-path", $$.clipPath)
.attr("class", CLASS[_regions]); .attr("class", CLASS.regions);
}; };
c3_chart_internal_fn.redrawRegion = function (duration) { c3_chart_internal_fn.redrawRegion = function (duration) {
var $$ = this, config = $$.config, CLASS = $$.CLASS; var $$ = this, config = $$.config;
$$.mainRegion = $$.main.select('.' + CLASS[_regions]).selectAll('.' + CLASS[_region]) $$.mainRegion = $$.main.select('.' + CLASS.regions).selectAll('.' + CLASS.region)
.data(config.regions); .data(config.regions);
$$.mainRegion.enter().append('g') $$.mainRegion.enter().append('g')
.attr('class', $$.classRegion.bind($$)) .attr('class', $$.classRegion.bind($$))

18
src/selection.js
Unescape View File

@ -5,10 +5,10 @@ c3_chart_internal_fn.selectPoint = function (target, d, i) {
r = $$.pointSelectR.bind($$); r = $$.pointSelectR.bind($$);
config.data_onselected.call($$.api, d, target.node()); config.data_onselected.call($$.api, d, target.node());
// add selected-circle on low layer g // add selected-circle on low layer g
$$.main.select('.' + CLASS[_selectedCircles] + $$.getTargetSelectorSuffix(d.id)).selectAll('.' + CLASS[_selectedCircle] + '-' + i) $$.main.select('.' + CLASS.selectedCircles + $$.getTargetSelectorSuffix(d.id)).selectAll('.' + CLASS.selectedCircle + '-' + i)
.data([d]) .data([d])
.enter().append('circle') .enter().append('circle')
.attr("class", function () { return $$.generateClass(CLASS[_selectedCircle], i); }) .attr("class", function () { return $$.generateClass(CLASS.selectedCircle, i); })
.attr("cx", cx) .attr("cx", cx)
.attr("cy", cy) .attr("cy", cy)
.attr("stroke", function () { return $$.color(d); }) .attr("stroke", function () { return $$.color(d); })
@ -20,7 +20,7 @@ c3_chart_internal_fn.unselectPoint = function (target, d, i) {
var $$ = this; var $$ = this;
$$.config.data_onunselected(d, target.node()); $$.config.data_onunselected(d, target.node());
// remove selected-circle from low layer g // remove selected-circle from low layer g
$$.main.select('.' + CLASS[_selectedCircles] + $$.getTargetSelectorSuffix(d.id)).selectAll('.' + CLASS[_selectedCircle] + '-' + i) $$.main.select('.' + CLASS.selectedCircles + $$.getTargetSelectorSuffix(d.id)).selectAll('.' + CLASS.selectedCircle + '-' + i)
.transition().duration(100).attr('r', 0) .transition().duration(100).attr('r', 0)
.remove(); .remove();
}; };
@ -48,17 +48,17 @@ c3_chart_internal_fn.toggleArc = function (selected, target, d, i) {
c3_chart_internal_fn.getToggle = function (that) { c3_chart_internal_fn.getToggle = function (that) {
var $$ = this; var $$ = this;
// path selection not supported yet // path selection not supported yet
return that.nodeName === 'circle' ? $$.togglePoint : ($$.d3.select(that).classed(CLASS[_bar]) ? $$.toggleBar : $$.toggleArc); return that.nodeName === 'circle' ? $$.togglePoint : ($$.d3.select(that).classed(CLASS.bar) ? $$.toggleBar : $$.toggleArc);
}; };
c3_chart_internal_fn.toggleShape = function (that, d, i) { c3_chart_internal_fn.toggleShape = function (that, d, i) {
var $$ = this, d3 = $$.d3, config = $$.config, var $$ = this, d3 = $$.d3, config = $$.config,
shape = d3.select(that), isSelected = shape.classed(CLASS[_SELECTED]), isWithin, toggle; shape = d3.select(that), isSelected = shape.classed(CLASS.SELECTED), isWithin, toggle;
if (that.nodeName === 'circle') { if (that.nodeName === 'circle') {
isWithin = $$.isWithinCircle(that, $$.pointSelectR(d) * 1.5); isWithin = $$.isWithinCircle(that, $$.pointSelectR(d) * 1.5);
toggle = $$.togglePoint; toggle = $$.togglePoint;
} }
else if (that.nodeName === 'path') { else if (that.nodeName === 'path') {
if (shape.classed(CLASS[_bar])) { if (shape.classed(CLASS.bar)) {
isWithin = $$.isWithinBar(that); isWithin = $$.isWithinBar(that);
toggle = $$.toggleBar; toggle = $$.toggleBar;
} else { // would be arc } else { // would be arc
@ -69,12 +69,12 @@ c3_chart_internal_fn.toggleShape = function (that, d, i) {
if (config.data_selection_grouped || isWithin) { if (config.data_selection_grouped || isWithin) {
if (config.data_selection_enabled && config.data_selection_isselectable(d)) { if (config.data_selection_enabled && config.data_selection_isselectable(d)) {
if (!config.data_selection_multiple) { if (!config.data_selection_multiple) {
$$.main.selectAll('.' + CLASS[_shapes] + (config.data_selection_grouped ? $$.getTargetSelectorSuffix(d.id) : "")).selectAll('.' + CLASS[_shape]).each(function (d, i) { $$.main.selectAll('.' + CLASS.shapes + (config.data_selection_grouped ? $$.getTargetSelectorSuffix(d.id) : "")).selectAll('.' + CLASS.shape).each(function (d, i) {
var shape = d3.select(this); var shape = d3.select(this);
if (shape.classed(CLASS[_SELECTED])) { toggle.call($$, false, shape.classed(CLASS[_SELECTED], false), d, i); } if (shape.classed(CLASS.SELECTED)) { toggle.call($$, false, shape.classed(CLASS.SELECTED, false), d, i); }
}); });
} }
shape.classed(CLASS[_SELECTED], !isSelected); shape.classed(CLASS.SELECTED, !isSelected);
toggle.call($$, !isSelected, shape, d, i); toggle.call($$, !isSelected, shape, d, i);
} }
$$.config.data_onclick.call($$.api, d, that); $$.config.data_onclick.call($$.api, d, that);

20
src/shape.bar.js
Unescape View File

@ -1,14 +1,14 @@
c3_chart_internal_fn.initBar = function () { c3_chart_internal_fn.initBar = function () {
var $$ = this, CLASS = $$.CLASS; var $$ = this;
$$.main.select('.' + CLASS[_chart]).append("g") $$.main.select('.' + CLASS.chart).append("g")
.attr("class", CLASS[_chartBars]); .attr("class", CLASS.chartBars);
}; };
c3_chart_internal_fn.updateTargetsForBar = function (targets) { c3_chart_internal_fn.updateTargetsForBar = function (targets) {
var $$ = this, config = $$.config, CLASS = $$.CLASS, var $$ = this, config = $$.config,
mainBarUpdate, mainBarEnter, mainBarUpdate, mainBarEnter,
classChartBar = $$.classChartBar.bind($$), classChartBar = $$.classChartBar.bind($$),
classBars = $$.classBars.bind($$); classBars = $$.classBars.bind($$);
mainBarUpdate = $$.main.select('.' + CLASS[_chartBars]).selectAll('.' + CLASS[_chartBar]) mainBarUpdate = $$.main.select('.' + CLASS.chartBars).selectAll('.' + CLASS.chartBar)
.data(targets) .data(targets)
.attr('class', classChartBar); .attr('class', classChartBar);
mainBarEnter = mainBarUpdate.enter().append('g') mainBarEnter = mainBarUpdate.enter().append('g')
@ -22,12 +22,12 @@ c3_chart_internal_fn.updateTargetsForBar = function (targets) {
}; };
c3_chart_internal_fn.redrawBar = function (durationForExit) { c3_chart_internal_fn.redrawBar = function (durationForExit) {
var $$ = this, CLASS = $$.CLASS, var $$ = this,
barData = $$.barData.bind($$), barData = $$.barData.bind($$),
classBar = $$.classBar.bind($$), classBar = $$.classBar.bind($$),
initialOpacity = $$.initialOpacity.bind($$), initialOpacity = $$.initialOpacity.bind($$),
color = function (d) { return $$.color(d.id); }; color = function (d) { return $$.color(d.id); };
$$.mainBar = $$.main.selectAll('.' + CLASS[_bars]).selectAll('.' + CLASS[_bar]) $$.mainBar = $$.main.selectAll('.' + CLASS.bars).selectAll('.' + CLASS.bar)
.data(barData); .data(barData);
$$.mainBar.enter().append('path') $$.mainBar.enter().append('path')
.attr("class", classBar) .attr("class", classBar)
@ -53,15 +53,15 @@ c3_chart_internal_fn.getBarW = function (axis, barTargetsNum) {
}; };
c3_chart_internal_fn.getBars = function (i) { c3_chart_internal_fn.getBars = function (i) {
var $$ = this; var $$ = this;
return $$.main.selectAll('.' + CLASS[_bar] + (isValue(i) ? '-' + i : '')); return $$.main.selectAll('.' + CLASS.bar + (isValue(i) ? '-' + i : ''));
}; };
c3_chart_internal_fn.expandBars = function (i) { c3_chart_internal_fn.expandBars = function (i) {
var $$ = this; var $$ = this;
$$.getBars(i).classed(CLASS[_EXPANDED], true); $$.getBars(i).classed(CLASS.EXPANDED, true);
}; };
c3_chart_internal_fn.unexpandBars = function (i) { c3_chart_internal_fn.unexpandBars = function (i) {
var $$ = this; var $$ = this;
$$.getBars(i).classed(CLASS[_EXPANDED], false); $$.getBars(i).classed(CLASS.EXPANDED, false);
}; };
c3_chart_internal_fn.generateDrawBar = function (barIndices, isSub) { c3_chart_internal_fn.generateDrawBar = function (barIndices, isSub) {
var $$ = this, config = $$.config, var $$ = this, config = $$.config,

36
src/shape.line.js
Unescape View File

@ -1,16 +1,16 @@
c3_chart_internal_fn.initLine = function () { c3_chart_internal_fn.initLine = function () {
var $$ = this, CLASS = $$.CLASS; var $$ = this;
$$.main.select('.' + CLASS[_chart]).append("g") $$.main.select('.' + CLASS.chart).append("g")
.attr("class", CLASS[_chartLines]); .attr("class", CLASS.chartLines);
}; };
c3_chart_internal_fn.updateTargetsForLine = function (targets) { c3_chart_internal_fn.updateTargetsForLine = function (targets) {
var $$ = this, config = $$.config, CLASS = $$.CLASS, var $$ = this, config = $$.config,
mainLineUpdate, mainLineEnter, mainLineUpdate, mainLineEnter,
classChartLine = $$.classChartLine.bind($$), classChartLine = $$.classChartLine.bind($$),
classLines = $$.classLines.bind($$), classLines = $$.classLines.bind($$),
classAreas = $$.classAreas.bind($$), classAreas = $$.classAreas.bind($$),
classCircles = $$.classCircles.bind($$); classCircles = $$.classCircles.bind($$);
mainLineUpdate = $$.main.select('.' + CLASS[_chartLines]).selectAll('.' + CLASS[_chartLine]) mainLineUpdate = $$.main.select('.' + CLASS.chartLines).selectAll('.' + CLASS.chartLine)
.data(targets) .data(targets)
.attr('class', classChartLine); .attr('class', classChartLine);
mainLineEnter = mainLineUpdate.enter().append('g') mainLineEnter = mainLineUpdate.enter().append('g')
@ -25,13 +25,13 @@ c3_chart_internal_fn.updateTargetsForLine = function (targets) {
.attr('class', classAreas); .attr('class', classAreas);
// Circles for each data point on lines // Circles for each data point on lines
mainLineEnter.append('g') mainLineEnter.append('g')
.attr("class", function (d) { return $$.generateClass(CLASS[_selectedCircles], d.id); }); .attr("class", function (d) { return $$.generateClass(CLASS.selectedCircles, d.id); });
mainLineEnter.append('g') mainLineEnter.append('g')
.attr("class", classCircles) .attr("class", classCircles)
.style("cursor", function (d) { return config.data_selection_isselectable(d) ? "pointer" : null; }); .style("cursor", function (d) { return config.data_selection_isselectable(d) ? "pointer" : null; });
// Update date for selected circles // Update date for selected circles
targets.forEach(function (t) { targets.forEach(function (t) {
$$.main.selectAll('.' + CLASS[_selectedCircles] + $$.getTargetSelectorSuffix(t.id)).selectAll('.' + CLASS[_selectedCircle]).each(function (d) { $$.main.selectAll('.' + CLASS.selectedCircles + $$.getTargetSelectorSuffix(t.id)).selectAll('.' + CLASS.selectedCircle).each(function (d) {
d.value = t.values[d.index].value; d.value = t.values[d.index].value;
}); });
}); });
@ -39,8 +39,8 @@ c3_chart_internal_fn.updateTargetsForLine = function (targets) {
//mainLineUpdate.exit().remove(); //mainLineUpdate.exit().remove();
}; };
c3_chart_internal_fn.redrawLine = function (durationForExit) { c3_chart_internal_fn.redrawLine = function (durationForExit) {
var $$ = this, CLASS = $$.CLASS; var $$ = this;
$$.mainLine = $$.main.selectAll('.' + CLASS[_lines]).selectAll('.' + CLASS[_line]) $$.mainLine = $$.main.selectAll('.' + CLASS.lines).selectAll('.' + CLASS.line)
.data($$.lineData.bind($$)); .data($$.lineData.bind($$));
$$.mainLine.enter().append('path') $$.mainLine.enter().append('path')
.attr('class', $$.classLine.bind($$)) .attr('class', $$.classLine.bind($$))
@ -194,8 +194,8 @@ c3_chart_internal_fn.lineWithRegions = function (d, x, y, _regions) {
c3_chart_internal_fn.redrawArea = function (durationForExit) { c3_chart_internal_fn.redrawArea = function (durationForExit) {
var $$ = this, CLASS = $$.CLASS, d3 = $$.d3; var $$ = this, d3 = $$.d3;
$$.mainArea = $$.main.selectAll('.' + CLASS[_areas]).selectAll('.' + CLASS[_area]) $$.mainArea = $$.main.selectAll('.' + CLASS.areas).selectAll('.' + CLASS.area)
.data($$.lineData.bind($$)); .data($$.lineData.bind($$));
$$.mainArea.enter().append('path') $$.mainArea.enter().append('path')
.attr("class", $$.classArea.bind($$)) .attr("class", $$.classArea.bind($$))
@ -271,8 +271,8 @@ c3_chart_internal_fn.generateGetAreaPoint = function (areaIndices, isSub) { // p
c3_chart_internal_fn.redrawCircle = function () { c3_chart_internal_fn.redrawCircle = function () {
var $$ = this, CLASS = $$.CLASS; var $$ = this;
$$.mainCircle = $$.main.selectAll('.' + CLASS[_circles]).selectAll('.' + CLASS[_circle]) $$.mainCircle = $$.main.selectAll('.' + CLASS.circles).selectAll('.' + CLASS.circle)
.data($$.lineOrScatterData.bind($$)); .data($$.lineOrScatterData.bind($$));
$$.mainCircle.enter().append("circle") $$.mainCircle.enter().append("circle")
.attr("class", $$.classCircle.bind($$)) .attr("class", $$.classCircle.bind($$))
@ -289,7 +289,7 @@ c3_chart_internal_fn.addTransitionForCircle = function (transitions, cx, cy) {
.style("fill", $$.color) .style("fill", $$.color)
.attr("cx", cx) .attr("cx", cx)
.attr("cy", cy)); .attr("cy", cy));
transitions.push($$.main.selectAll('.' + CLASS[_selectedCircle]).transition() transitions.push($$.main.selectAll('.' + CLASS.selectedCircle).transition()
.attr("cx", cx) .attr("cx", cx)
.attr("cy", cy)); .attr("cy", cy));
}; };
@ -303,21 +303,21 @@ c3_chart_internal_fn.circleY = function (d, i) {
}; };
c3_chart_internal_fn.getCircles = function (i, id) { c3_chart_internal_fn.getCircles = function (i, id) {
var $$ = this; var $$ = this;
return (id ? $$.main.selectAll('.' + CLASS[_circles] + $$.getTargetSelectorSuffix(id)) : $$.main).selectAll('.' + CLASS[_circle] + (isValue(i) ? '-' + i : '')); return (id ? $$.main.selectAll('.' + CLASS.circles + $$.getTargetSelectorSuffix(id)) : $$.main).selectAll('.' + CLASS.circle + (isValue(i) ? '-' + i : ''));
}; };
c3_chart_internal_fn.expandCircles = function (i, id) { c3_chart_internal_fn.expandCircles = function (i, id) {
var $$ = this, var $$ = this,
r = $$.pointExpandedR.bind($$); r = $$.pointExpandedR.bind($$);
$$.getCircles(i, id) $$.getCircles(i, id)
.classed(CLASS[_EXPANDED], true) .classed(CLASS.EXPANDED, true)
.attr('r', r); .attr('r', r);
}; };
c3_chart_internal_fn.unexpandCircles = function (i) { c3_chart_internal_fn.unexpandCircles = function (i) {
var $$ = this, var $$ = this,
r = $$.pointR.bind($$); r = $$.pointR.bind($$);
$$.getCircles(i) $$.getCircles(i)
.filter(function () { return $$.d3.select(this).classed(CLASS[_EXPANDED]); }) .filter(function () { return $$.d3.select(this).classed(CLASS.EXPANDED); })
.classed(CLASS[_EXPANDED], false) .classed(CLASS.EXPANDED, false)
.attr('r', r); .attr('r', r);
}; };
c3_chart_internal_fn.pointR = function (d) { c3_chart_internal_fn.pointR = function (d) {

2
src/size.js
Unescape View File

@ -59,7 +59,7 @@ c3_chart_internal_fn.getParentHeight = function () {
c3_chart_internal_fn.getSvgLeft = function () { c3_chart_internal_fn.getSvgLeft = function () {
var $$ = this, config = $$.config, var $$ = this, config = $$.config,
leftAxisClass = config.axis_rotated ? CLASS[_axisX] : CLASS[_axisY], leftAxisClass = config.axis_rotated ? CLASS.axisX : CLASS.axisY,
leftAxis = $$.main.select('.' + leftAxisClass).node(), leftAxis = $$.main.select('.' + leftAxisClass).node(),
svgRect = leftAxis ? leftAxis.getBoundingClientRect() : {right: 0}, svgRect = leftAxis ? leftAxis.getBoundingClientRect() : {right: 0},
chartRect = $$.selectChart.node().getBoundingClientRect(), chartRect = $$.selectChart.node().getBoundingClientRect(),

28
src/subchart.js
Unescape View File

@ -2,7 +2,7 @@ c3_chart_internal_fn.initBrush = function () {
var $$ = this, d3 = $$.d3; var $$ = this, d3 = $$.d3;
$$.brush = d3.svg.brush().on("brush", function () { $$.redrawForBrush(); }); $$.brush = d3.svg.brush().on("brush", function () { $$.redrawForBrush(); });
$$.brush.update = function () { $$.brush.update = function () {
if ($$.context) { $$.context.select('.' + $$.CLASS[_brush]).call(this); } if ($$.context) { $$.context.select('.' + CLASS.brush).call(this); }
return this; return this;
}; };
$$.brush.scale = function (scale) { $$.brush.scale = function (scale) {
@ -20,20 +20,20 @@ c3_chart_internal_fn.initSubchart = function () {
// Define g for chart area // Define g for chart area
context.append('g') context.append('g')
.attr("clip-path", $$.clipPath) .attr("clip-path", $$.clipPath)
.attr('class', CLASS[_chart]); .attr('class', CLASS.chart);
// Define g for bar chart area // Define g for bar chart area
context.select('.' + CLASS[_chart]).append("g") context.select('.' + CLASS.chart).append("g")
.attr("class", CLASS[_chartBars]); .attr("class", CLASS.chartBars);
// Define g for line chart area // Define g for line chart area
context.select('.' + CLASS[_chart]).append("g") context.select('.' + CLASS.chart).append("g")
.attr("class", CLASS[_chartLines]); .attr("class", CLASS.chartLines);
// Add extent rect for Brush // Add extent rect for Brush
context.append("g") context.append("g")
.attr("clip-path", $$.clipPath) .attr("clip-path", $$.clipPath)
.attr("class", CLASS[_brush]) .attr("class", CLASS.brush)
.call($$.brush) .call($$.brush)
.selectAll("rect") .selectAll("rect")
.attr(config.axis_rotated ? "width" : "height", config.axis_rotated ? $$.width2 : $$.height2); .attr(config.axis_rotated ? "width" : "height", config.axis_rotated ? $$.width2 : $$.height2);
@ -41,7 +41,7 @@ c3_chart_internal_fn.initSubchart = function () {
// ATTENTION: This must be called AFTER chart added // ATTENTION: This must be called AFTER chart added
// Add Axis // Add Axis
$$.axes.subx = context.append("g") $$.axes.subx = context.append("g")
.attr("class", CLASS[_axisX]) .attr("class", CLASS.axisX)
.attr("transform", $$.getTranslate('subx')) .attr("transform", $$.getTranslate('subx'))
.attr("clip-path", config.axis_rotated ? "" : $$.clipPathForXAxis); .attr("clip-path", config.axis_rotated ? "" : $$.clipPathForXAxis);
}; };
@ -55,7 +55,7 @@ c3_chart_internal_fn.updateTargetsForSubchart = function (targets) {
classAreas = $$.classAreas.bind($$); classAreas = $$.classAreas.bind($$);
if (config.subchart_show) { if (config.subchart_show) {
contextBarUpdate = context.select('.' + CLASS[_chartBars]).selectAll('.' + CLASS[_chartBar]) contextBarUpdate = context.select('.' + CLASS.chartBars).selectAll('.' + CLASS.chartBar)
.data(targets) .data(targets)
.attr('class', classChartBar); .attr('class', classChartBar);
contextBarEnter = contextBarUpdate.enter().append('g') contextBarEnter = contextBarUpdate.enter().append('g')
@ -66,7 +66,7 @@ c3_chart_internal_fn.updateTargetsForSubchart = function (targets) {
.attr("class", classBars); .attr("class", classBars);
//-- Line --// //-- Line --//
contextLineUpdate = context.select('.' + CLASS[_chartLines]).selectAll('.' + CLASS[_chartLine]) contextLineUpdate = context.select('.' + CLASS.chartLines).selectAll('.' + CLASS.chartLine)
.data(targets) .data(targets)
.attr('class', classChartLine); .attr('class', classChartLine);
contextLineEnter = contextLineUpdate.enter().append('g') contextLineEnter = contextLineUpdate.enter().append('g')
@ -113,7 +113,7 @@ c3_chart_internal_fn.redrawSubchart = function (withSubchart, transitions, durat
drawBarOnSub = $$.generateDrawBar(barIndices, true); drawBarOnSub = $$.generateDrawBar(barIndices, true);
drawLineOnSub = $$.generateDrawLine(lineIndices, true); drawLineOnSub = $$.generateDrawLine(lineIndices, true);
// bars // bars
contextBar = context.selectAll('.' + CLASS[_bars]).selectAll('.' + CLASS[_bar]) contextBar = context.selectAll('.' + CLASS.bars).selectAll('.' + CLASS.bar)
.data(barData); .data(barData);
contextBar.enter().append('path') contextBar.enter().append('path')
.attr("class", classBar) .attr("class", classBar)
@ -128,7 +128,7 @@ c3_chart_internal_fn.redrawSubchart = function (withSubchart, transitions, durat
.style('opacity', 0) .style('opacity', 0)
.remove(); .remove();
// lines // lines
contextLine = context.selectAll('.' + CLASS[_lines]).selectAll('.' + CLASS[_line]) contextLine = context.selectAll('.' + CLASS.lines).selectAll('.' + CLASS.line)
.data(lineData); .data(lineData);
contextLine.enter().append('path') contextLine.enter().append('path')
.attr('class', classLine) .attr('class', classLine)
@ -142,7 +142,7 @@ c3_chart_internal_fn.redrawSubchart = function (withSubchart, transitions, durat
.style('opacity', 0) .style('opacity', 0)
.remove(); .remove();
// area // area
contextArea = context.selectAll('.' + CLASS[_areas]).selectAll('.' + CLASS[_area]) contextArea = context.selectAll('.' + CLASS.areas).selectAll('.' + CLASS.area)
.data(lineData); .data(lineData);
contextArea.enter().append('path') contextArea.enter().append('path')
.attr("class", classArea) .attr("class", classArea)
@ -175,7 +175,7 @@ c3_chart_internal_fn.transformContext = function (withTransition, transitions) {
if (transitions && transitions.axisSubX) { if (transitions && transitions.axisSubX) {
subXAxis = transitions.axisSubX; subXAxis = transitions.axisSubX;
} else { } else {
subXAxis = $$.context.select('.' + CLASS[_axisX]); subXAxis = $$.context.select('.' + CLASS.axisX);
if (withTransition) { subXAxis = subXAxis.transition(); } if (withTransition) { subXAxis = subXAxis.transition(); }
} }
$$.context.attr("transform", $$.getTranslate('context')); $$.context.attr("transform", $$.getTranslate('context'));

14
src/text.js
Unescape View File

@ -1,14 +1,14 @@
c3_chart_internal_fn.initText = function () { c3_chart_internal_fn.initText = function () {
var $$ = this, CLASS = $$.CLASS; var $$ = this;
$$.main.select('.' + CLASS[_chart]).append("g") $$.main.select('.' + CLASS.chart).append("g")
.attr("class", CLASS[_chartTexts]); .attr("class", CLASS.chartTexts);
$$.mainText = $$.d3.selectAll([]); $$.mainText = $$.d3.selectAll([]);
}; };
c3_chart_internal_fn.updateTargetsForText = function (targets) { c3_chart_internal_fn.updateTargetsForText = function (targets) {
var $$ = this, CLASS = $$.CLASS, mainTextUpdate, mainTextEnter, var $$ = this, mainTextUpdate, mainTextEnter,
classChartText = $$.classChartText.bind($$), classChartText = $$.classChartText.bind($$),
classTexts = $$.classTexts.bind($$); classTexts = $$.classTexts.bind($$);
mainTextUpdate = $$.main.select('.' + CLASS[_chartTexts]).selectAll('.' + CLASS[_chartText]) mainTextUpdate = $$.main.select('.' + CLASS.chartTexts).selectAll('.' + CLASS.chartText)
.data(targets) .data(targets)
.attr('class', classChartText); .attr('class', classChartText);
mainTextEnter = mainTextUpdate.enter().append('g') mainTextEnter = mainTextUpdate.enter().append('g')
@ -19,10 +19,10 @@ c3_chart_internal_fn.updateTargetsForText = function (targets) {
.attr('class', classTexts); .attr('class', classTexts);
}; };
c3_chart_internal_fn.redrawText = function (durationForExit) { c3_chart_internal_fn.redrawText = function (durationForExit) {
var $$ = this, config = $$.config, CLASS = $$.CLASS, var $$ = this, config = $$.config,
barOrLineData = $$.barOrLineData.bind($$), barOrLineData = $$.barOrLineData.bind($$),
classText = $$.classText.bind($$); classText = $$.classText.bind($$);
$$.mainText = $$.main.selectAll('.' + CLASS[_texts]).selectAll('.' + CLASS[_text]) $$.mainText = $$.main.selectAll('.' + CLASS.texts).selectAll('.' + CLASS.text)
.data(barOrLineData); .data(barOrLineData);
$$.mainText.enter().append('text') $$.mainText.enter().append('text')
.attr("class", classText) .attr("class", classText)

4
src/tooltip.js
Unescape View File

@ -35,14 +35,14 @@ c3_chart_internal_fn.getTooltipContent = function (d, defaultTitleFormat, defaul
if (! text) { if (! text) {
title = titleFormat ? titleFormat(d[i].x) : d[i].x; title = titleFormat ? titleFormat(d[i].x) : d[i].x;
text = "<table class='" + CLASS[_tooltip] + "'>" + (title || title === 0 ? "<tr><th colspan='2'>" + title + "</th></tr>" : ""); text = "<table class='" + CLASS.tooltip + "'>" + (title || title === 0 ? "<tr><th colspan='2'>" + title + "</th></tr>" : "");
} }
name = nameFormat(d[i].name); name = nameFormat(d[i].name);
value = valueFormat(d[i].value, d[i].ratio, d[i].id, d[i].index); value = valueFormat(d[i].value, d[i].ratio, d[i].id, d[i].index);
bgcolor = $$.levelColor ? $$.levelColor(d[i].value) : color(d[i].id); bgcolor = $$.levelColor ? $$.levelColor(d[i].value) : color(d[i].id);
text += "<tr class='" + CLASS[_tooltipName] + "-" + d[i].id + "'>"; text += "<tr class='" + CLASS.tooltipName + "-" + d[i].id + "'>";
text += "<td class='name'><span style='background-color:" + bgcolor + "'></span>" + name + "</td>"; text += "<td class='name'><span style='background-color:" + bgcolor + "'></span>" + name + "</td>";
text += "<td class='value'>" + value + "</td>"; text += "<td class='value'>" + value + "</td>";
text += "</tr>"; text += "</tr>";

4
src/zoom.js
Unescape View File

@ -21,8 +21,8 @@ c3_chart_internal_fn.initZoom = function () {
}; };
c3_chart_internal_fn.updateZoom = function () { c3_chart_internal_fn.updateZoom = function () {
var $$ = this, z = $$.config.zoom_enabled ? $$.zoom : function () {}; var $$ = this, z = $$.config.zoom_enabled ? $$.zoom : function () {};
$$.main.select('.' + $$.CLASS[_zoomRect]).call(z); $$.main.select('.' + CLASS.zoomRect).call(z);
$$.main.selectAll('.' + $$.CLASS[_eventRect]).call(z); $$.main.selectAll('.' + CLASS.eventRect).call(z);
}; };
c3_chart_internal_fn.redrawForZoom = function () { c3_chart_internal_fn.redrawForZoom = function () {
var $$ = this, d3 = $$.d3, config = $$.config, zoom = $$.zoom, x = $$.x, orgXDomain = $$.orgXDomain; var $$ = this, d3 = $$.d3, config = $$.config, zoom = $$.zoom, x = $$.x, orgXDomain = $$.orgXDomain;

Write Preview
Loading…
Cancel
Save