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

Fixing merge conflict.

pull/837/head
Ændrew Rininsland 10 years ago
parent
99a3a65e83 c47da0dbf5
commit
f0fa4c1815
53 changed files with 1077 additions and 755 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. 10
      .editorconfig
  2. 10
      .jshintrc
  3. 3
      Gruntfile.coffee
  4. 5
      README.md
  5. 12
      bower.json
  6. 213
      c3.css
  7. 613
      c3.js
  8. 2
      c3.min.css
  9. 10
      c3.min.js
  10. 4
      component.json
  11. 8
      package.json
  12. 4
      spec/api.data-spec.js
  13. 4
      spec/api.focus-spec.js
  14. 4
      spec/api.grid-spec.js
  15. 4
      spec/api.load-spec.js
  16. 4
      spec/api.zoom-spec.js
  17. 4
      spec/arc-spec.js
  18. 13
      spec/axis-spec.js
  19. 3
      spec/c3-spec.js
  20. 4
      spec/class-spec.js
  21. 4
      spec/core-spec.js
  22. 120
      spec/data-spec.js
  23. 6
      spec/domain-spec.js
  24. 44
      spec/grid-spec.js
  25. 20
      spec/interaction-spec.js
  26. 6
      spec/legend-spec.js
  27. 4
      spec/shape.bar-spec.js
  28. 4
      spec/shape.line-spec.js
  29. 72
      spec/tooltip-spec.js
  30. 4
      spec/type-spec.js
  31. 4
      spec/zoom-spec.js
  32. 13
      src/api.chart.js
  33. 4
      src/api.show.js
  34. 1
      src/api.transform.js
  35. 2
      src/arc.js
  36. 34
      src/axis.js
  37. 3
      src/c3.axis.js
  38. 2
      src/color.js
  39. 7
      src/config.js
  40. 139
      src/core.js
  41. 4
      src/data.js
  42. 24
      src/domain.js
  43. 3
      src/drag.js
  44. 12
      src/format.js
  45. 34
      src/grid.js
  46. 16
      src/interaction.js
  47. 7
      src/polyfill.js
  48. 19
      src/region.js
  49. 15
      src/shape.bar.js
  50. 60
      src/shape.line.js
  51. 135
      src/subchart.js
  52. 20
      src/text.js
  53. 56
      src/tooltip.js

10
.editorconfig
Unescape View File

@ -0,0 +1,10 @@
# editorconfig.org
root = true
[*]
indent_style = space
indent_size = 4
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true

10
.jshintrc
Unescape View File

@ -16,5 +16,13 @@
"loopfunc": true, "loopfunc": true,
"bitwise": false, "bitwise": false,
"browser": true "browser": true,
"globals": {
"describe": false,
"beforeEach": false,
"it": false,
"expect": false
}
} }

3
Gruntfile.coffee
Unescape View File

@ -1,5 +1,5 @@
module.exports = (grunt) -> module.exports = (grunt) ->
require('load-grunt-tasks') grunt, pattern: 'grunt-contrib-*' require('load-grunt-tasks') grunt, pattern: ['grunt-contrib-*', 'grunt-sass']
grunt.initConfig grunt.initConfig
watch: watch:
@ -72,6 +72,7 @@ module.exports = (grunt) ->
'src/api.chart.js', 'src/api.chart.js',
'src/api.tooltip.js', 'src/api.tooltip.js',
'src/c3.axis.js', 'src/c3.axis.js',
'src/polyfill.js',
'src/tail.js' 'src/tail.js'
] ]
dest: 'c3.js' dest: 'c3.js'

5
README.md
Unescape View File

@ -1,4 +1,4 @@
c3 [![Build Status](https://travis-ci.org/masayuki0812/c3.svg?branch=master)](https://travis-ci.org/masayuki0812/c3) c3 [![Build Status](https://travis-ci.org/masayuki0812/c3.svg?branch=master)](https://travis-ci.org/masayuki0812/c3) [![Dependency Status](https://david-dm.org/masayuki0812/c3.svg)](https://david-dm.org/masayuki0812/c3) [![devDependency Status](https://david-dm.org/masayuki0812/c3/dev-status.svg)](https://david-dm.org/masayuki0812/c3#info=devDependencies) [![license](http://img.shields.io/badge/license-MIT-brightgreen.svg?style=flat)](https://github.com/masayuki0812/c3/blob/master/LICENSE)
== ==
c3 is a D3-based reusable chart library that enables deeper integration of charts into web applications. c3 is a D3-based reusable chart library that enables deeper integration of charts into web applications.
@ -42,6 +42,9 @@ If you choose to submit a pull request, please do not bump the version number un
Please fork this fiddle: Please fork this fiddle:
+ [http://jsfiddle.net/masayuki0812/7kYJu/](http://jsfiddle.net/masayuki0812/7kYJu/) + [http://jsfiddle.net/masayuki0812/7kYJu/](http://jsfiddle.net/masayuki0812/7kYJu/)
## Dependency
+ [D3.js](https://github.com/mbostock/d3) `<=3.5.0`
## License ## License
MIT MIT

12
bower.json
Unescape View File

@ -4,7 +4,7 @@
"c3.css", "c3.css",
"c3.js" "c3.js"
], ],
"version": "0.4.8", "version": "0.4.9",
"homepage": "https://github.com/masayuki0812/c3", "homepage": "https://github.com/masayuki0812/c3",
"authors": [ "authors": [
"Masayuki Tanaka <masayuki0812@mac.com>" "Masayuki Tanaka <masayuki0812@mac.com>"
@ -19,10 +19,14 @@
"**/.*", "**/.*",
"node_modules", "node_modules",
"bower_components", "bower_components",
"test", "htdocs",
"tests" "spec",
"src",
"package.json",
"component.json",
"Gruntfile.*"
], ],
"dependencies": { "dependencies": {
"d3": "~3.4.4" "d3": "<=3.5.0"
} }
} }

213
c3.css
Unescape View File

@ -1,217 +1,158 @@
/*-- Chart --*/ /*-- Chart --*/
.c3 svg { .c3 svg {
font: 10px sans-serif; font: 10px sans-serif; }
}
.c3 path, .c3 line { .c3 path, .c3 line {
fill: none; fill: none;
stroke: #000; stroke: #000; }
}
.c3 text { .c3 text {
-webkit-user-select: none; -webkit-user-select: none;
-moz-user-select: none; -moz-user-select: none;
user-select: none; user-select: none; }
}
.c3-legend-item-tile, .c3-xgrid-focus, .c3-ygrid, .c3-event-rect, .c3-bars path {
.c3-legend-item-tile, shape-rendering: crispEdges; }
.c3-xgrid-focus,
.c3-ygrid,
.c3-event-rect,
.c3-bars path {
shape-rendering: crispEdges;
}
.c3-chart-arc path { .c3-chart-arc path {
stroke: #fff; stroke: #fff; }
}
.c3-chart-arc text { .c3-chart-arc text {
fill: #fff; fill: #fff;
font-size: 13px; font-size: 13px; }
}
/*-- Axis --*/ /*-- Axis --*/
.c3-axis-x .tick {
}
.c3-axis-x-label {
}
.c3-axis-y .tick {
}
.c3-axis-y-label {
}
.c3-axis-y2 .tick {
}
.c3-axis-y2-label {
}
/*-- Grid --*/ /*-- Grid --*/
.c3-grid line { .c3-grid line {
stroke: #aaa; stroke: #aaa; }
}
.c3-grid text { .c3-grid text {
fill: #aaa; fill: #aaa; }
}
.c3-xgrid, .c3-ygrid { .c3-xgrid, .c3-ygrid {
stroke-dasharray: 3 3; stroke-dasharray: 3 3; }
}
.c3-xgrid-focus {
}
/*-- Text on Chart --*/ /*-- Text on Chart --*/
.c3-text {
}
.c3-text.c3-empty { .c3-text.c3-empty {
fill: #808080; fill: #808080;
font-size: 2em; font-size: 2em; }
}
/*-- Line --*/ /*-- Line --*/
.c3-line { .c3-line {
stroke-width: 1px; stroke-width: 1px; }
}
/*-- Point --*/
/*-- Point --*/
.c3-circle._expanded_ { .c3-circle._expanded_ {
stroke-width: 1px; stroke-width: 1px;
stroke: white; stroke: white; }
}
.c3-selected-circle { .c3-selected-circle {
fill: white; fill: white;
stroke-width: 2px; stroke-width: 2px; }
}
/*-- Bar --*/ /*-- Bar --*/
.c3-bar { .c3-bar {
stroke-width: 0; stroke-width: 0; }
}
.c3-bar._expanded_ {
fill-opacity: 0.75;
}
/*-- Arc --*/
.c3-chart-arcs-title { .c3-bar._expanded_ {
dominant-baseline: middle; fill-opacity: 0.75; }
font-size: 1.3em;
}
/*-- Focus --*/ /*-- Focus --*/
.c3-target.c3-focused { .c3-target.c3-focused {
opacity: 1; opacity: 1; }
}
.c3-target.c3-focused path.c3-line, .c3-target.c3-focused path.c3-step { .c3-target.c3-focused path.c3-line, .c3-target.c3-focused path.c3-step {
stroke-width: 2px; stroke-width: 2px; }
}
.c3-target.c3-defocused {
opacity: 0.3 !important;
}
.c3-target.c3-defocused {
opacity: 0.3 !important; }
/*-- Region --*/ /*-- Region --*/
.c3-region { .c3-region {
fill: steelblue; fill: steelblue;
fill-opacity: .1; fill-opacity: 0.1; }
}
/*-- Brush --*/ /*-- Brush --*/
.c3-brush .extent { .c3-brush .extent {
fill-opacity: .1; fill-opacity: 0.1; }
}
/*-- Select - Drag --*/ /*-- Select - Drag --*/
.c3-dragarea {
}
/*-- Legend --*/ /*-- Legend --*/
.c3-legend-item { .c3-legend-item {
font-size: 12px; font-size: 12px; }
}
.c3-legend-item-hidden { .c3-legend-item-hidden {
opacity: 0.15; opacity: 0.15; }
}
.c3-legend-background { .c3-legend-background {
opacity: 0.75; opacity: 0.75;
fill: white; fill: white;
stroke: lightgray; stroke: lightgray;
stroke-width: 1 stroke-width: 1; }
}
/*-- Tooltip --*/ /*-- Tooltip --*/
.c3-tooltip-container { .c3-tooltip-container {
z-index: 10; z-index: 10; }
}
.c3-tooltip { .c3-tooltip {
border-collapse:collapse; border-collapse: collapse;
border-spacing:0; border-spacing: 0;
background-color:#fff; background-color: #fff;
empty-cells:show; empty-cells: show;
-webkit-box-shadow: 7px 7px 12px -9px rgb(119,119,119); -webkit-box-shadow: 7px 7px 12px -9px #777777;
-moz-box-shadow: 7px 7px 12px -9px rgb(119,119,119); -moz-box-shadow: 7px 7px 12px -9px #777777;
box-shadow: 7px 7px 12px -9px rgb(119,119,119); box-shadow: 7px 7px 12px -9px #777777;
opacity: 0.9; opacity: 0.9; }
}
.c3-tooltip tr { .c3-tooltip tr {
border:1px solid #CCC; border: 1px solid #CCC; }
}
.c3-tooltip th { .c3-tooltip th {
background-color: #aaa; background-color: #aaa;
font-size:14px; font-size: 14px;
padding:2px 5px; padding: 2px 5px;
text-align:left; text-align: left;
color:#FFF; color: #FFF; }
}
.c3-tooltip td { .c3-tooltip td {
font-size:13px; font-size: 13px;
padding: 3px 6px; padding: 3px 6px;
background-color:#fff; background-color: #fff;
border-left:1px dotted #999; border-left: 1px dotted #999; }
}
.c3-tooltip td > span { .c3-tooltip td > span {
display: inline-block; display: inline-block;
width: 10px; width: 10px;
height: 10px; height: 10px;
margin-right: 6px; margin-right: 6px; }
}
.c3-tooltip td.value{ .c3-tooltip td.value {
text-align: right; text-align: right; }
}
/*-- Area --*/
.c3-area { .c3-area {
stroke-width: 0; stroke-width: 0;
opacity: 0.2; opacity: 0.2; }
}
/*-- Arc --*/
.c3-chart-arcs-title {
dominant-baseline: middle;
font-size: 1.3em; }
.c3-chart-arcs .c3-chart-arcs-background { .c3-chart-arcs .c3-chart-arcs-background {
fill: #e0e0e0; fill: #e0e0e0;
stroke: none; stroke: none; }
}
.c3-chart-arcs .c3-chart-arcs-gauge-unit { .c3-chart-arcs .c3-chart-arcs-gauge-unit {
fill: #000; fill: #000;
font-size: 16px; font-size: 16px; }
}
.c3-chart-arcs .c3-chart-arcs-gauge-max { .c3-chart-arcs .c3-chart-arcs-gauge-max {
fill: #777; fill: #777; }
}
.c3-chart-arcs .c3-chart-arcs-gauge-min { .c3-chart-arcs .c3-chart-arcs-gauge-min {
fill: #777; fill: #777; }
}
.c3-chart-arc .c3-gauge-value { .c3-chart-arc .c3-gauge-value {
fill: #000; fill: #000;
/* font-size: 28px !important;*/ /* font-size: 28px !important;*/ }
}

613
c3.js
View File

File diff suppressed because it is too large Load Diff

2
c3.min.css vendored
Unescape View File

@ -1 +1 @@
.c3 svg{font:10px sans-serif}.c3 line,.c3 path{fill:none;stroke:#000}.c3 text{-webkit-user-select:none;-moz-user-select:none;user-select:none}.c3-bars path,.c3-event-rect,.c3-legend-item-tile,.c3-xgrid-focus,.c3-ygrid{shape-rendering:crispEdges}.c3-chart-arc path{stroke:#fff}.c3-chart-arc text{fill:#fff;font-size:13px}.c3-grid line{stroke:#aaa}.c3-grid text{fill:#aaa}.c3-xgrid,.c3-ygrid{stroke-dasharray:3 3}.c3-text.c3-empty{fill:gray;font-size:2em}.c3-line{stroke-width:1px}.c3-circle._expanded_{stroke-width:1px;stroke:#fff}.c3-selected-circle{fill:#fff;stroke-width:2px}.c3-bar{stroke-width:0}.c3-bar._expanded_{fill-opacity:.75}.c3-chart-arcs-title{dominant-baseline:middle;font-size:1.3em}.c3-target.c3-focused{opacity:1}.c3-target.c3-focused path.c3-line,.c3-target.c3-focused path.c3-step{stroke-width:2px}.c3-target.c3-defocused{opacity:.3!important}.c3-region{fill:#4682b4;fill-opacity:.1}.c3-brush .extent{fill-opacity:.1}.c3-legend-item{font-size:12px}.c3-legend-item-hidden{opacity:.15}.c3-legend-background{opacity:.75;fill:#fff;stroke:#d3d3d3;stroke-width:1}.c3-tooltip-container{z-index:10}.c3-tooltip{border-collapse:collapse;border-spacing:0;background-color:#fff;empty-cells:show;-webkit-box-shadow:7px 7px 12px -9px #777;-moz-box-shadow:7px 7px 12px -9px #777;box-shadow:7px 7px 12px -9px #777;opacity:.9}.c3-tooltip tr{border:1px solid #CCC}.c3-tooltip th{background-color:#aaa;font-size:14px;padding:2px 5px;text-align:left;color:#FFF}.c3-tooltip td{font-size:13px;padding:3px 6px;background-color:#fff;border-left:1px dotted #999}.c3-tooltip td>span{display:inline-block;width:10px;height:10px;margin-right:6px}.c3-tooltip td.value{text-align:right}.c3-area{stroke-width:0;opacity:.2}.c3-chart-arcs .c3-chart-arcs-background{fill:#e0e0e0;stroke:none}.c3-chart-arcs .c3-chart-arcs-gauge-unit{fill:#000;font-size:16px}.c3-chart-arcs .c3-chart-arcs-gauge-max,.c3-chart-arcs .c3-chart-arcs-gauge-min{fill:#777}.c3-chart-arc .c3-gauge-value{fill:#000} .c3 svg{font:10px sans-serif}.c3 line,.c3 path{fill:none;stroke:#000}.c3 text{-webkit-user-select:none;-moz-user-select:none;user-select:none}.c3-bars path,.c3-event-rect,.c3-legend-item-tile,.c3-xgrid-focus,.c3-ygrid{shape-rendering:crispEdges}.c3-chart-arc path{stroke:#fff}.c3-chart-arc text{fill:#fff;font-size:13px}.c3-grid line{stroke:#aaa}.c3-grid text{fill:#aaa}.c3-xgrid,.c3-ygrid{stroke-dasharray:3 3}.c3-text.c3-empty{fill:gray;font-size:2em}.c3-line{stroke-width:1px}.c3-circle._expanded_{stroke-width:1px;stroke:#fff}.c3-selected-circle{fill:#fff;stroke-width:2px}.c3-bar{stroke-width:0}.c3-bar._expanded_{fill-opacity:.75}.c3-chart-arcs-title{dominant-baseline:middle;font-size:1.3em}.c3-target.c3-focused{opacity:1}.c3-target.c3-focused path.c3-line,.c3-target.c3-focused path.c3-step{stroke-width:2px}.c3-target.c3-defocused{opacity:.3!important}.c3-region{fill:#4682b4;fill-opacity:.1}.c3-brush .extent{fill-opacity:.1}.c3-legend-item{font-size:12px}.c3-legend-item-hidden{opacity:.15}.c3-legend-background{opacity:.75;fill:#fff;stroke:#d3d3d3;stroke-width:1}.c3-tooltip-container{z-index:10}.c3-tooltip{border-collapse:collapse;border-spacing:0;background-color:#fff;empty-cells:show;width:auto;-webkit-box-shadow:7px 7px 12px -9px #777;-moz-box-shadow:7px 7px 12px -9px #777;box-shadow:7px 7px 12px -9px #777;opacity:.9}.c3-tooltip tr{border:1px solid #CCC}.c3-tooltip th{background-color:#aaa;font-size:14px;padding:2px 5px;text-align:left;color:#FFF}.c3-tooltip td{font-size:13px;padding:3px 6px;background-color:#fff;border-left:1px dotted #999;color:#000}.c3-tooltip td>span{display:inline-block;width:10px;height:10px;margin-right:6px}.c3-tooltip td.value{text-align:right}.c3-area{stroke-width:0;opacity:.2}.c3-chart-arcs .c3-chart-arcs-background{fill:#e0e0e0;stroke:none}.c3-chart-arcs .c3-chart-arcs-gauge-unit{fill:#000;font-size:16px}.c3-chart-arcs .c3-chart-arcs-gauge-max,.c3-chart-arcs .c3-chart-arcs-gauge-min{fill:#777}.c3-chart-arc .c3-gauge-value{fill:#000}

10
c3.min.js vendored
View File

File diff suppressed because one or more lines are too long

4
component.json
Unescape View File

@ -2,10 +2,10 @@
"name": "c3", "name": "c3",
"repo": "masayuki0812/c3", "repo": "masayuki0812/c3",
"description": "A D3-based reusable chart library", "description": "A D3-based reusable chart library",
"version": "0.4.8", "version": "0.4.9",
"keywords": [], "keywords": [],
"dependencies": { "dependencies": {
"mbostock/d3": "v3.4.4" "mbostock/d3": "v3.5.0"
}, },
"development": {}, "development": {},
"license": "MIT", "license": "MIT",

8
package.json
Unescape View File

@ -1,6 +1,6 @@
{ {
"name": "c3", "name": "c3",
"version": "0.4.8", "version": "0.4.9",
"description": "D3-based reusable chart library", "description": "D3-based reusable chart library",
"main": "c3.js", "main": "c3.js",
"scripts": { "scripts": {
@ -20,17 +20,17 @@
"gitHead": "84e03109d9a590f9c8ef687c03d751f666080c6f", "gitHead": "84e03109d9a590f9c8ef687c03d751f666080c6f",
"readmeFilename": "README.md", "readmeFilename": "README.md",
"dependencies": { "dependencies": {
"d3": "~3.4.4" "d3": "<=3.5.0"
}, },
"devDependencies": { "devDependencies": {
"grunt": "^0.4.5", "grunt": "^0.4.5",
"grunt-contrib-concat": "~0.5.0", "grunt-contrib-concat": "~0.5.0",
"grunt-contrib-cssmin": "^0.10.0", "grunt-contrib-cssmin": "^0.10.0",
"grunt-contrib-jasmine": "~0.8.0", "grunt-contrib-jasmine": "~0.8.0",
"grunt-contrib-jshint": "~0.7.1", "grunt-contrib-jshint": "~0.10.0",
"grunt-contrib-sass": "^0.8.1",
"grunt-contrib-uglify": "~0.4.0", "grunt-contrib-uglify": "~0.4.0",
"grunt-contrib-watch": "^0.6.1", "grunt-contrib-watch": "^0.6.1",
"grunt-sass": "^0.17.0",
"load-grunt-tasks": "~0.2.0" "load-grunt-tasks": "~0.2.0"
} }
} }

4
spec/api.data-spec.js
Unescape View File

@ -1,7 +1,3 @@
var describe = window.describe,
expect = window.expect,
it = window.it,
beforeEach = window.beforeEach;
describe('c3 api data', function () { describe('c3 api data', function () {
'use strict'; 'use strict';

4
spec/api.focus-spec.js
Unescape View File

@ -1,7 +1,3 @@
var describe = window.describe,
expect = window.expect,
it = window.it,
beforeEach = window.beforeEach;
describe('c3 api load', function () { describe('c3 api load', function () {
'use strict'; 'use strict';

4
spec/api.grid-spec.js
Unescape View File

@ -1,7 +1,3 @@
var describe = window.describe,
expect = window.expect,
it = window.it,
beforeEach = window.beforeEach;
describe('c3 api grid', function () { describe('c3 api grid', function () {
'use strict'; 'use strict';

4
spec/api.load-spec.js
Unescape View File

@ -1,7 +1,3 @@
var describe = window.describe,
expect = window.expect,
it = window.it,
beforeEach = window.beforeEach;
describe('c3 api load', function () { describe('c3 api load', function () {
'use strict'; 'use strict';

4
spec/api.zoom-spec.js
Unescape View File

@ -1,7 +1,3 @@
var describe = window.describe,
expect = window.expect,
it = window.it,
beforeEach = window.beforeEach;
describe('c3 api zoom', function () { describe('c3 api zoom', function () {
'use strict'; 'use strict';

4
spec/arc-spec.js
Unescape View File

@ -1,7 +1,3 @@
var describe = window.describe,
expect = window.expect,
it = window.it,
beforeEach = window.beforeEach;
describe('c3 chart axis', function () { describe('c3 chart axis', function () {
'use strict'; 'use strict';

13
spec/axis-spec.js
Unescape View File

@ -1,7 +1,3 @@
var describe = window.describe,
expect = window.expect,
it = window.it,
beforeEach = window.beforeEach;
describe('c3 chart axis', function () { describe('c3 chart axis', function () {
'use strict'; 'use strict';
@ -380,11 +376,10 @@ describe('c3 chart axis', function () {
expectedTickTexts = [ expectedTickTexts = [
'this is a very', 'this is a very',
'long tick text', 'long tick text',
'on category', 'on category axis'
'axis',
], ],
expectedX = '0'; expectedX = '0';
expect(tspans.size()).toBe(4); expect(tspans.size()).toBe(3);
tspans.each(function (d, i) { tspans.each(function (d, i) {
var tspan = d3.select(this); var tspan = d3.select(this);
expect(tspan.text()).toBe(expectedTickTexts[i]); expect(tspan.text()).toBe(expectedTickTexts[i]);
@ -697,7 +692,7 @@ describe('c3 chart axis', function () {
it('should not have inner y axis', function () { it('should not have inner y axis', function () {
var paddingLeft = chart.internal.getCurrentPaddingLeft(), var paddingLeft = chart.internal.getCurrentPaddingLeft(),
tickTexts = chart.internal.main.selectAll('.c3-axis-y g.tick text'); tickTexts = chart.internal.main.selectAll('.c3-axis-y g.tick text');
expect(paddingLeft).toBe(50); expect(paddingLeft).toBeGreaterThan(19);
tickTexts.each(function () { tickTexts.each(function () {
expect(+d3.select(this).attr('x')).toBeLessThan(0); expect(+d3.select(this).attr('x')).toBeLessThan(0);
}); });
@ -742,7 +737,7 @@ describe('c3 chart axis', function () {
it('should not have inner y axis', function () { it('should not have inner y axis', function () {
var paddingRight = chart.internal.getCurrentPaddingRight(), var paddingRight = chart.internal.getCurrentPaddingRight(),
tickTexts = chart.internal.main.selectAll('.c3-axis-2y g.tick text'); tickTexts = chart.internal.main.selectAll('.c3-axis-2y g.tick text');
expect(paddingRight).toBeGreaterThan(39); expect(paddingRight).toBeGreaterThan(19);
tickTexts.each(function () { tickTexts.each(function () {
expect(+d3.select(this).attr('x')).toBeGreaterThan(0); expect(+d3.select(this).attr('x')).toBeGreaterThan(0);
}); });

3
spec/c3-spec.js
Unescape View File

@ -1,6 +1,3 @@
var describe = window.describe,
expect = window.expect,
it = window.it;
describe('c3', function () { describe('c3', function () {
'use strict'; 'use strict';

4
spec/class-spec.js
Unescape View File

@ -1,7 +1,3 @@
var describe = window.describe,
expect = window.expect,
it = window.it,
beforeEach = window.beforeEach;
describe('c3 chart class', function () { describe('c3 chart class', function () {
'use strict'; 'use strict';

4
spec/core-spec.js
Unescape View File

@ -1,7 +1,3 @@
var describe = window.describe,
expect = window.expect,
it = window.it,
beforeEach = window.beforeEach;
describe('c3 chart', function () { describe('c3 chart', function () {
'use strict'; 'use strict';

120
spec/data-spec.js
Unescape View File

@ -1,7 +1,3 @@
var describe = window.describe,
expect = window.expect,
it = window.it,
beforeEach = window.beforeEach;
describe('c3 chart data', function () { describe('c3 chart data', function () {
'use strict'; 'use strict';
@ -173,10 +169,10 @@ describe('c3 chart data', function () {
it('should have Date object as x', function () { it('should have Date object as x', function () {
var xs = chart.internal.data.xs; var xs = chart.internal.data.xs;
expect(+xs.data1[0]).toBe(+new Date(2014, 11, 3, 16, 1, 1, 123)); expect(+xs.data1[0]).toBe(1417622461123);
expect(+xs.data1[1]).toBe(+new Date(2014, 11, 3, 16, 2, 2, 345)); expect(+xs.data1[1]).toBe(1417622522345);
expect(+xs.data2[0]).toBe(+new Date(2014, 11, 3, 16, 1, 1, 123)); expect(+xs.data2[0]).toBe(1417622461123);
expect(+xs.data2[1]).toBe(+new Date(2014, 11, 3, 16, 2, 2, 345)); expect(+xs.data2[1]).toBe(1417622522345);
}); });
}); });
@ -213,10 +209,10 @@ describe('c3 chart data', function () {
it('should have Date object as x', function () { it('should have Date object as x', function () {
var xs = chart.internal.data.xs; var xs = chart.internal.data.xs;
expect(+xs.data1[0]).toBe(+new Date(2014, 11, 3, 16, 1, 1, 123)); expect(+xs.data1[0]).toBe(1417622461123);
expect(+xs.data1[1]).toBe(+new Date(2014, 11, 3, 16, 2, 2, 345)); expect(+xs.data1[1]).toBe(1417622522345);
expect(+xs.data2[0]).toBe(+new Date(2014, 11, 3, 16, 1, 1, 123)); expect(+xs.data2[0]).toBe(1417622461123);
expect(+xs.data2[1]).toBe(+new Date(2014, 11, 3, 16, 2, 2, 345)); expect(+xs.data2[1]).toBe(1417622522345);
}); });
}); });
@ -227,6 +223,106 @@ describe('c3 chart data', function () {
describe('data.label', function () { describe('data.label', function () {
describe('for all targets', function () {
it('should update args to show data label for all data', function () {
args = {
data: {
columns: [
['data1', 100, 200, 100, 400, 150, 250],
['data2', 10, 20, 10, 40, 15, 25],
['data3', 1000, 2000, 1000, 4000, 1500, 2500]
],
labels: true
}
};
expect(true).toBeTruthy();
});
it('should have data labels on all data', function () {
d3.selectAll('.c3-texts-data1 text').each(function (d, i) {
expect(d3.select(this).text()).toBe(args.data.columns[0][i + 1] + '');
});
d3.selectAll('.c3-texts-data2 text').each(function (d, i) {
expect(d3.select(this).text()).toBe(args.data.columns[1][i + 1] + '');
});
d3.selectAll('.c3-texts-data3 text').each(function (d, i) {
expect(d3.select(this).text()).toBe(args.data.columns[2][i + 1] + '');
});
});
});
describe('for each target', function () {
describe('as true', function () {
it('should update args to show data label for only data1', function () {
args = {
data: {
columns: [
['data1', 100, 200, 100, 400, 150, 250],
['data2', 10, 20, 10, 40, 15, 25],
['data3', 1000, 2000, 1000, 4000, 1500, 2500]
],
labels: {
format: {
data1: true
}
}
}
};
expect(true).toBeTruthy();
});
it('should have data labels on all data', function () {
d3.selectAll('.c3-texts-data1 text').each(function (d, i) {
expect(d3.select(this).text()).toBe(args.data.columns[0][i + 1] + '');
});
d3.selectAll('.c3-texts-data2 text').each(function () {
expect(d3.select(this).text()).toBe('');
});
d3.selectAll('.c3-texts-data3 text').each(function () {
expect(d3.select(this).text()).toBe('');
});
});
});
describe('as function', function () {
it('should update args to show data label for only data1', function () {
args = {
data: {
columns: [
['data1', 100, 200, 100, 400, 150, 250],
['data2', 10, 20, 10, 40, 15, 25],
['data3', 1000, 2000, 1000, 4000, 1500, 2500]
],
labels: {
format: {
data1: d3.format('$')
}
}
}
};
expect(true).toBeTruthy();
});
it('should have data labels on all data', function () {
d3.selectAll('.c3-texts-data1 text').each(function (d, i) {
expect(d3.select(this).text()).toBe('$' + args.data.columns[0][i + 1]);
});
d3.selectAll('.c3-texts-data2 text').each(function () {
expect(d3.select(this).text()).toBe('');
});
d3.selectAll('.c3-texts-data3 text').each(function () {
expect(d3.select(this).text()).toBe('');
});
});
});
});
describe('with small values', function () { describe('with small values', function () {
it('should update args to show data label', function () { it('should update args to show data label', function () {

6
spec/domain-spec.js
Unescape View File

@ -1,9 +1,5 @@
var describe = window.describe,
expect = window.expect,
it = window.it,
beforeEach = window.beforeEach;
describe('c3 chart axis', function () { describe('c3 chart domain', function () {
'use strict'; 'use strict';
var chart, d3; var chart, d3;

44
spec/grid-spec.js
Unescape View File

@ -1,7 +1,3 @@
var describe = window.describe,
expect = window.expect,
it = window.it,
beforeEach = window.beforeEach;
describe('c3 chart grid', function () { describe('c3 chart grid', function () {
'use strict'; 'use strict';
@ -83,6 +79,44 @@ describe('c3 chart grid', function () {
describe('x grid lines', function () { describe('x grid lines', function () {
describe('with padding.top', function () {
it('should have correct height', function () {
args = {
data: {
columns: [
['data1', 30, 200, 100, 400],
]
},
grid: {
x: {
lines: [
{value: 3, text: 'Label 3'}
]
}
},
padding: {
top: 50
}
};
expect(true).toBeTruthy();
});
it('should show x grid lines', function () {
var lines = chart.internal.main.select('.c3-xgrid-lines .c3-xgrid-line'),
expectedX1 = 593,
expectedText = ['Label 3'];
lines.each(function (id, i) {
var line = d3.select(this),
l = line.select('line'),
t = line.select('text');
expect(+l.attr('x1')).toBeCloseTo(expectedX1, -2);
expect(t.text()).toBe(expectedText[i]);
});
});
});
describe('on category axis', function () { describe('on category axis', function () {
it('should update args', function () { it('should update args', function () {
@ -119,7 +153,7 @@ describe('c3 chart grid', function () {
var line = d3.select(this), var line = d3.select(this),
l = line.select('line'), l = line.select('line'),
t = line.select('text'); t = line.select('text');
expect(+l.attr('x1')).toBeCloseTo(expectedX1[i], -1); expect(+l.attr('x1')).toBeCloseTo(expectedX1[i], -2);
expect(t.text()).toBe(expectedText[i]); expect(t.text()).toBe(expectedText[i]);
}); });
}); });

20
spec/interaction-spec.js
Unescape View File

@ -1,7 +1,3 @@
var describe = window.describe,
expect = window.expect,
it = window.it,
beforeEach = window.beforeEach;
describe('c3 chart interaction', function () { describe('c3 chart interaction', function () {
'use strict'; 'use strict';
@ -46,8 +42,8 @@ describe('c3 chart interaction', function () {
widths = [60, 67.5, 202, 194]; widths = [60, 67.5, 202, 194];
d3.selectAll('.c3-event-rect').each(function (d, i) { d3.selectAll('.c3-event-rect').each(function (d, i) {
var box = d3.select(this).node().getBoundingClientRect(); var box = d3.select(this).node().getBoundingClientRect();
expect(box.left).toBe(lefts[i]); expect(box.left).toBeCloseTo(lefts[i], -2);
expect(box.width).toBe(widths[i]); expect(box.width).toBeCloseTo(widths[i], -2);
}); });
}); });
@ -70,8 +66,8 @@ describe('c3 chart interaction', function () {
expect(eventRects.size()).toBe(1); expect(eventRects.size()).toBe(1);
eventRects.each(function () { eventRects.each(function () {
var box = d3.select(this).node().getBoundingClientRect(); var box = d3.select(this).node().getBoundingClientRect();
expect(box.left).toBe(40.5); expect(box.left).toBeCloseTo(40.5, -2);
expect(box.width).toBe(598); expect(box.width).toBeCloseTo(598, -2);
}); });
}); });
}); });
@ -96,8 +92,8 @@ describe('c3 chart interaction', function () {
widths = [149.5, 160, 147, 136]; widths = [149.5, 160, 147, 136];
d3.selectAll('.c3-event-rect').each(function (d, i) { d3.selectAll('.c3-event-rect').each(function (d, i) {
var box = d3.select(this).node().getBoundingClientRect(); var box = d3.select(this).node().getBoundingClientRect();
expect(box.left).toBe(lefts[i]); expect(box.left).toBeCloseTo(lefts[i], -2);
expect(box.width).toBe(widths[i]); expect(box.width).toBeCloseTo(widths[i], -2);
}); });
}); });
@ -120,8 +116,8 @@ describe('c3 chart interaction', function () {
expect(eventRects.size()).toBe(1); expect(eventRects.size()).toBe(1);
eventRects.each(function () { eventRects.each(function () {
var box = d3.select(this).node().getBoundingClientRect(); var box = d3.select(this).node().getBoundingClientRect();
expect(box.left).toBe(40.5); expect(box.left).toBeCloseTo(40.5, -2);
expect(box.width).toBe(598); expect(box.width).toBeCloseTo(598, -2);
}); });
}); });

6
spec/legend-spec.js
Unescape View File

@ -1,7 +1,3 @@
var describe = window.describe,
expect = window.expect,
it = window.it,
beforeEach = window.beforeEach;
describe('c3 chart legend', function () { describe('c3 chart legend', function () {
'use strict'; 'use strict';
@ -56,7 +52,7 @@ describe('c3 chart legend', function () {
it('should be positioned properly', function () { it('should be positioned properly', function () {
var box = d3.select('.c3-legend-background').node().getBoundingClientRect(); var box = d3.select('.c3-legend-background').node().getBoundingClientRect();
expect(box.top).toBe(5.5); expect(box.top).toBe(5.5);
expect(box.left).toBe(60.5); expect(box.left).toBeGreaterThan(30);
}); });
it('should have automatically calculated height', function () { it('should have automatically calculated height', function () {

4
spec/shape.bar-spec.js
Unescape View File

@ -1,7 +1,3 @@
var describe = window.describe,
expect = window.expect,
it = window.it,
beforeEach = window.beforeEach;
var setMouseEvent = window.setMouseEvent; var setMouseEvent = window.setMouseEvent;

4
spec/shape.line-spec.js
Unescape View File

@ -1,7 +1,3 @@
var describe = window.describe,
expect = window.expect,
it = window.it,
beforeEach = window.beforeEach;
describe('c3 chart shape line', function () { describe('c3 chart shape line', function () {
'use strict'; 'use strict';

72
spec/tooltip-spec.js
Unescape View File

@ -1,29 +1,34 @@
var describe = window.describe, var jasmine = window.jasmine,
expect = window.expect, beforeAll = window.beforeAll;
it = window.it,
beforeEach = window.beforeEach;
describe('c3 chart tooltip', function () { describe('c3 chart tooltip', function () {
'use strict'; 'use strict';
var chart, d3; var chart, d3;
var tooltipConfiguration;
var args = {
data: { var args = function () {
columns: [ return {
['data1', 30, 200, 100, 400, 150, 250], data: {
['data2', 50, 20, 10, 40, 15, 25], columns: [
['data3', 150, 120, 110, 140, 115, 125] ['data1', 30, 200, 100, 400, 150, 250],
] ['data2', 50, 20, 10, 40, 15, 25],
} ['data3', 150, 120, 110, 140, 115, 125]
],
},
tooltip: tooltipConfiguration
};
}; };
beforeEach(function (done) { beforeEach(function (done) {
chart = window.initChart(chart, args, done); chart = window.initChart(chart, args(), done);
d3 = chart.internal.d3; d3 = chart.internal.d3;
}); });
describe('tooltip position', function () { describe('tooltip position', function () {
beforeAll(function () {
tooltipConfiguration = {};
});
describe('without left margin', function () { describe('without left margin', function () {
@ -35,9 +40,9 @@ describe('c3 chart tooltip', function () {
top = Math.floor(+tooltipContainer.style('top').replace(/px/, '')), top = Math.floor(+tooltipContainer.style('top').replace(/px/, '')),
left = Math.floor(+tooltipContainer.style('left').replace(/px/, '')), left = Math.floor(+tooltipContainer.style('left').replace(/px/, '')),
topExpected = 115, topExpected = 115,
leftExpected = 307; leftExpected = 280;
expect(top).toBe(topExpected); expect(top).toBe(topExpected);
expect(left).toBe(leftExpected); expect(left).toBeGreaterThan(leftExpected);
}); });
}); });
@ -57,13 +62,44 @@ describe('c3 chart tooltip', function () {
top = Math.floor(+tooltipContainer.style('top').replace(/px/, '')), top = Math.floor(+tooltipContainer.style('top').replace(/px/, '')),
left = Math.floor(+tooltipContainer.style('left').replace(/px/, '')), left = Math.floor(+tooltipContainer.style('left').replace(/px/, '')),
topExpected = 115, topExpected = 115,
leftExpected = 307; leftExpected = 280;
expect(top).toBe(topExpected); expect(top).toBe(topExpected);
expect(left).toBe(leftExpected); expect(left).toBeGreaterThan(leftExpected);
}); });
}); });
}); });
describe('tooltip positionFunction', function () {
var topExpected = 37, leftExpected = 79;
beforeAll(function () {
tooltipConfiguration = {
position: function (data, width, height, element) {
expect(data.length).toBe(args().data.columns.length);
expect(data[0]).toEqual(jasmine.objectContaining({
index: 2,
value: 100,
id: 'data1'
}));
expect(width).toBeGreaterThan(0);
expect(height).toBeGreaterThan(0);
expect(element).toBe(d3.select('.c3-event-rect-2').node());
return {top: topExpected, left: leftExpected};
}
};
});
it('should be set to the coordinate where the function returned', function () {
var eventRect = d3.select('.c3-event-rect-2').node();
window.setMouseEvent(chart, 'mousemove', 100, 100, eventRect);
var tooltipContainer = d3.select('.c3-tooltip-container'),
top = Math.floor(+tooltipContainer.style('top').replace(/px/, '')),
left = Math.floor(+tooltipContainer.style('left').replace(/px/, ''));
expect(top).toBe(topExpected);
expect(left).toBe(leftExpected);
});
});
}); });

4
spec/type-spec.js
Unescape View File

@ -1,7 +1,3 @@
var describe = window.describe,
expect = window.expect,
it = window.it,
beforeEach = window.beforeEach;
describe('c3 chart types', function () { describe('c3 chart types', function () {
'use strict'; 'use strict';

4
spec/zoom-spec.js
Unescape View File

@ -1,7 +1,3 @@
var describe = window.describe,
expect = window.expect,
it = window.it,
beforeEach = window.beforeEach;
describe('c3 chart zoom', function () { describe('c3 chart zoom', function () {
'use strict'; 'use strict';

13
src/api.chart.js
Unescape View File

@ -12,9 +12,16 @@ c3_chart_fn.flush = function () {
c3_chart_fn.destroy = function () { c3_chart_fn.destroy = function () {
var $$ = this.internal; var $$ = this.internal;
$$.data.targets = undefined;
$$.data.xs = {};
$$.selectChart.classed('c3', false).html("");
window.clearInterval($$.intervalForObserveInserted); window.clearInterval($$.intervalForObserveInserted);
window.onresize = null; window.onresize = null;
$$.selectChart.classed('c3', false).html("");
// MEMO: this is needed because the reference of some elements will not be released, then memory leak will happen.
Object.keys($$).forEach(function (key) {
$$[key] = null;
});
return null;
}; };

4
src/api.show.js
Unescape View File

@ -42,9 +42,9 @@ c3_chart_fn.hide = function (targetIds, options) {
$$.redraw({withUpdateOrgXDomain: true, withUpdateXDomain: true, withLegend: true}); $$.redraw({withUpdateOrgXDomain: true, withUpdateXDomain: true, withLegend: true});
}; };
c3_chart_fn.toggle = function (targetIds) { c3_chart_fn.toggle = function (targetIds, options) {
var that = this, $$ = this.internal; var that = this, $$ = this.internal;
$$.mapToTargetIds(targetIds).forEach(function (targetId) { $$.mapToTargetIds(targetIds).forEach(function (targetId) {
$$.isTargetToShow(targetId) ? that.hide(targetId) : that.show(targetId); $$.isTargetToShow(targetId) ? that.hide(targetId, options) : that.show(targetId, options);
}); });
}; };

1
src/api.transform.js
Unescape View File

@ -11,5 +11,6 @@ c3_chart_internal_fn.transformTo = function (targetIds, type, optionsForRedraw)
options.withTransitionForTransform = false; options.withTransitionForTransform = false;
$$.transiting = false; $$.transiting = false;
$$.setTargetType(targetIds, type); $$.setTargetType(targetIds, type);
$$.updateTargets($$.data.targets); // this is needed when transforming to arc
$$.updateAndRedraw(options); $$.updateAndRedraw(options);
}; };

2
src/arc.js
Unescape View File

@ -273,7 +273,7 @@ c3_chart_internal_fn.redrawArc = function (duration, durationForExit, withTransf
var updated = $$.updateAngle(d), var updated = $$.updateAngle(d),
arcData = $$.convertToArcData(updated), arcData = $$.convertToArcData(updated),
selectedData = [arcData]; selectedData = [arcData];
$$.showTooltip(selectedData, d3.mouse(this)); $$.showTooltip(selectedData, this);
} : null) } : null)
.on('mouseout', config.interaction_enabled ? function (d) { .on('mouseout', config.interaction_enabled ? function (d) {
var updated, arcData; var updated, arcData;

34
src/axis.js
Unescape View File

@ -30,13 +30,14 @@ c3_chart_internal_fn.initAxis = function () {
.attr("transform", config.axis_rotated ? "" : "rotate(-90)") .attr("transform", config.axis_rotated ? "" : "rotate(-90)")
.style("text-anchor", $$.textAnchorForY2AxisLabel.bind($$)); .style("text-anchor", $$.textAnchorForY2AxisLabel.bind($$));
}; };
c3_chart_internal_fn.getXAxis = function (scale, orient, tickFormat, tickValues, withOuterTick) { c3_chart_internal_fn.getXAxis = function (scale, orient, tickFormat, tickValues, withOuterTick, withoutTransition) {
var $$ = this, config = $$.config, var $$ = this, config = $$.config,
axisParams = { axisParams = {
isCategory: $$.isCategorized(), isCategory: $$.isCategorized(),
withOuterTick: withOuterTick, withOuterTick: withOuterTick,
tickMultiline: config.axis_x_tick_multiline, tickMultiline: config.axis_x_tick_multiline,
tickWidth: config.axis_x_tick_width tickWidth: config.axis_x_tick_width,
withoutTransition: withoutTransition,
}, },
axis = c3_axis($$.d3, axisParams).scale(scale).orient(orient); axis = c3_axis($$.d3, axisParams).scale(scale).orient(orient);
@ -63,6 +64,19 @@ c3_chart_internal_fn.getXAxis = function (scale, orient, tickFormat, tickValues,
return axis; return axis;
}; };
c3_chart_internal_fn.updateXAxisTickValues = function (targets, axis) {
var $$ = this, config = $$.config, tickValues;
if (config.axis_x_tick_fit || config.axis_x_tick_count) {
tickValues = $$.generateTickValues($$.mapTargetsToUniqueXs(targets), config.axis_x_tick_count, $$.isTimeSeries());
}
if (axis) {
axis.tickValues(tickValues);
} else {
$$.xAxis.tickValues(tickValues);
$$.subXAxis.tickValues(tickValues);
}
return tickValues;
};
c3_chart_internal_fn.getYAxis = function (scale, orient, tickFormat, tickValues, withOuterTick) { c3_chart_internal_fn.getYAxis = function (scale, orient, tickFormat, tickValues, withOuterTick) {
var axisParams = {withOuterTick: withOuterTick}, var axisParams = {withOuterTick: withOuterTick},
axis = c3_axis(this.d3, axisParams).scale(scale).orient(orient).tickFormat(tickFormat); axis = c3_axis(this.d3, axisParams).scale(scale).orient(orient).tickFormat(tickFormat);
@ -266,7 +280,7 @@ c3_chart_internal_fn.rotateTickText = function (axis, transition, rotate) {
c3_chart_internal_fn.getMaxTickWidth = function (id, withoutRecompute) { c3_chart_internal_fn.getMaxTickWidth = function (id, withoutRecompute) {
var $$ = this, config = $$.config, var $$ = this, config = $$.config,
maxWidth = 0, targetsToShow, scale, axis; maxWidth = 0, targetsToShow, scale, axis, body, svg;
if (withoutRecompute && $$.currentMaxTickWidths[id]) { if (withoutRecompute && $$.currentMaxTickWidths[id]) {
return $$.currentMaxTickWidths[id]; return $$.currentMaxTickWidths[id];
} }
@ -281,13 +295,21 @@ c3_chart_internal_fn.getMaxTickWidth = function (id, withoutRecompute) {
} else { } else {
scale = $$.x.copy().domain($$.getXDomain(targetsToShow)); scale = $$.x.copy().domain($$.getXDomain(targetsToShow));
axis = $$.getXAxis(scale, $$.xOrient, $$.xAxisTickFormat, $$.xAxisTickValues); axis = $$.getXAxis(scale, $$.xOrient, $$.xAxisTickFormat, $$.xAxisTickValues);
$$.updateXAxisTickValues(targetsToShow, axis);
} }
$$.d3.select('body').append("g").style('visibility', 'hidden').call(axis).each(function () { body = this.d3.select('body').classed('c3', true);
svg = body.append('svg').style('visibility', 'hidden');
svg.append('g').call(axis).each(function () {
$$.d3.select(this).selectAll('text tspan').each(function () { $$.d3.select(this).selectAll('text tspan').each(function () {
var box = this.getBoundingClientRect(); var box = this.getBoundingClientRect();
if (box.left > 0 && maxWidth < box.width) { maxWidth = box.width; } if (box.left >= 0 && maxWidth < box.width) { maxWidth = box.width; }
}); });
}).remove(); });
// TODO: time lag to get maxWidth
window.setTimeout(function () {
svg.remove();
}, 100);
body.classed('c3', false);
} }
$$.currentMaxTickWidths[id] = maxWidth <= 0 ? $$.currentMaxTickWidths[id] : maxWidth; $$.currentMaxTickWidths[id] = maxWidth <= 0 ? $$.currentMaxTickWidths[id] : maxWidth;
return $$.currentMaxTickWidths[id]; return $$.currentMaxTickWidths[id];

3
src/c3.axis.js
Unescape View File

@ -48,7 +48,8 @@ function c3_axis(d3, params) {
return newScale; return newScale;
} }
function textFormatted(v) { function textFormatted(v) {
return tickFormat ? tickFormat(v) : v; var formatted = tickFormat ? tickFormat(v) : v;
return typeof formatted !== 'undefined' ? formatted : '';
} }
function getSizeFor1Char(tick) { function getSizeFor1Char(tick) {
if (tickTextCharSize) { if (tickTextCharSize) {

2
src/color.js
Unescape View File

@ -6,7 +6,7 @@ c3_chart_internal_fn.generateColor = function () {
ids = []; ids = [];
return function (d) { return function (d) {
var id = d.id || d, color; var id = d.id || (d.data && d.data.id) || d, color;
// if callback function is provided // if callback function is provided
if (colors[id] instanceof Function) { if (colors[id] instanceof Function) {

7
src/config.js
Unescape View File

@ -20,6 +20,7 @@ c3_chart_internal_fn.getDefaultConfig = function () {
onresize: function () {}, onresize: function () {},
onresized: function () {}, onresized: function () {},
oninit: function () {}, oninit: function () {},
onrendered: function () {},
transition_duration: 350, transition_duration: 350,
data_x: undefined, data_x: undefined,
data_xs: {}, data_xs: {},
@ -44,13 +45,12 @@ c3_chart_internal_fn.getDefaultConfig = function () {
data_selection_grouped: false, data_selection_grouped: false,
data_selection_isselectable: function () { return true; }, data_selection_isselectable: function () { return true; },
data_selection_multiple: true, data_selection_multiple: true,
data_selection_draggable: false,
data_onclick: function () {}, data_onclick: function () {},
data_onmouseover: function () {}, data_onmouseover: function () {},
data_onmouseout: function () {}, data_onmouseout: function () {},
data_onselected: function () {}, data_onselected: function () {},
data_onunselected: function () {}, data_onunselected: function () {},
data_ondragstart: function () {},
data_ondragend: function () {},
data_url: undefined, data_url: undefined,
data_json: undefined, data_json: undefined,
data_rows: undefined, data_rows: undefined,
@ -105,6 +105,7 @@ c3_chart_internal_fn.getDefaultConfig = function () {
axis_y_type: undefined, axis_y_type: undefined,
axis_y_max: undefined, axis_y_max: undefined,
axis_y_min: undefined, axis_y_min: undefined,
axis_y_inverted: false,
axis_y_center: undefined, axis_y_center: undefined,
axis_y_inner: undefined, axis_y_inner: undefined,
axis_y_label: {}, axis_y_label: {},
@ -119,6 +120,7 @@ c3_chart_internal_fn.getDefaultConfig = function () {
axis_y2_show: false, axis_y2_show: false,
axis_y2_max: undefined, axis_y2_max: undefined,
axis_y2_min: undefined, axis_y2_min: undefined,
axis_y2_inverted: false,
axis_y2_center: undefined, axis_y2_center: undefined,
axis_y2_inner: undefined, axis_y2_inner: undefined,
axis_y2_label: {}, axis_y2_label: {},
@ -183,6 +185,7 @@ c3_chart_internal_fn.getDefaultConfig = function () {
tooltip_format_title: undefined, tooltip_format_title: undefined,
tooltip_format_name: undefined, tooltip_format_name: undefined,
tooltip_format_value: undefined, tooltip_format_value: undefined,
tooltip_position: undefined,
tooltip_contents: function (d, defaultTitleFormat, defaultValueFormat, color) { tooltip_contents: function (d, defaultTitleFormat, defaultValueFormat, color) {
return this.getTooltipContent ? this.getTooltipContent(d, defaultTitleFormat, defaultValueFormat, color) : ''; return this.getTooltipContent ? this.getTooltipContent(d, defaultTitleFormat, defaultValueFormat, color) : '';
}, },

139
src/core.js
Unescape View File

@ -1,4 +1,4 @@
var c3 = { version: "0.4.8" }; var c3 = { version: "0.4.9" };
var c3_chart_fn, c3_chart_internal_fn; var c3_chart_fn, c3_chart_internal_fn;
@ -394,7 +394,7 @@ c3_chart_internal_fn.updateSizes = function () {
}; };
c3_chart_internal_fn.updateTargets = function (targets) { c3_chart_internal_fn.updateTargets = function (targets) {
var $$ = this, config = $$.config; var $$ = this;
/*-- Main --*/ /*-- Main --*/
@ -408,14 +408,19 @@ c3_chart_internal_fn.updateTargets = function (targets) {
$$.updateTargetsForLine(targets); $$.updateTargetsForLine(targets);
//-- Arc --// //-- Arc --//
if ($$.updateTargetsForArc) { $$.updateTargetsForArc(targets); } if ($$.hasArcType() && $$.updateTargetsForArc) { $$.updateTargetsForArc(targets); }
if ($$.updateTargetsForSubchart) { $$.updateTargetsForSubchart(targets); }
/*-- Show --*/ /*-- Sub --*/
if ($$.updateTargetsForSubchart) { $$.updateTargetsForSubchart(targets); }
// Fade-in each chart // Fade-in each chart
$$.showTargets();
};
c3_chart_internal_fn.showTargets = function () {
var $$ = this;
$$.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,13 +475,7 @@ c3_chart_internal_fn.redraw = function (options, transitions) {
if (targetsToShow.length) { if (targetsToShow.length) {
$$.updateXDomain(targetsToShow, withUpdateXDomain, withUpdateOrgXDomain, withTrimXDomain); $$.updateXDomain(targetsToShow, withUpdateXDomain, withUpdateOrgXDomain, withTrimXDomain);
if (!config.axis_x_tick_values) { if (!config.axis_x_tick_values) {
if (config.axis_x_tick_fit || config.axis_x_tick_count) { tickValues = $$.updateXAxisTickValues(targetsToShow);
tickValues = $$.generateTickValues($$.mapTargetsToUniqueXs(targetsToShow), config.axis_x_tick_count, $$.isTimeSeries());
} else {
tickValues = undefined;
}
$$.xAxis.tickValues(tickValues);
$$.subXAxis.tickValues(tickValues);
} }
} else { } else {
$$.xAxis.tickValues([]); $$.xAxis.tickValues([]);
@ -551,22 +550,22 @@ c3_chart_internal_fn.redraw = function (options, transitions) {
.style('opacity', targetsToShow.length ? 0 : 1); .style('opacity', targetsToShow.length ? 0 : 1);
// grid // grid
$$.redrawGrid(duration); $$.updateGrid(duration);
// rect for regions // rect for regions
$$.redrawRegion(duration); $$.updateRegion(duration);
// bars // bars
$$.redrawBar(durationForExit); $$.updateBar(durationForExit);
// lines, areas and cricles // lines, areas and cricles
$$.redrawLine(durationForExit); $$.updateLine(durationForExit);
$$.redrawArea(durationForExit); $$.updateArea(durationForExit);
$$.redrawCircle(); $$.updateCircle();
// text // text
if ($$.hasDataLabel()) { if ($$.hasDataLabel()) {
$$.redrawText(durationForExit); $$.updateText(durationForExit);
} }
// arc // arc
@ -596,40 +595,69 @@ c3_chart_internal_fn.redraw = function (options, transitions) {
cx = ($$.config.axis_rotated ? $$.circleY : $$.circleX).bind($$); cx = ($$.config.axis_rotated ? $$.circleY : $$.circleX).bind($$);
cy = ($$.config.axis_rotated ? $$.circleX : $$.circleY).bind($$); cy = ($$.config.axis_rotated ? $$.circleX : $$.circleY).bind($$);
// transition should be derived from one transition if (options.flow) {
d3.transition().duration(duration).each(function () { flow = $$.generateFlow({
var transitions = []; targets: targetsToShow,
flow: options.flow,
duration: duration,
drawBar: drawBar,
drawLine: drawLine,
drawArea: drawArea,
cx: cx,
cy: cy,
xv: xv,
xForText: xForText,
yForText: yForText
});
}
$$.addTransitionForBar(transitions, drawBar); if (duration && $$.isTabVisible()) { // Only use transition if tab visible. See #938.
$$.addTransitionForLine(transitions, drawLine); // transition should be derived from one transition
$$.addTransitionForArea(transitions, drawArea); d3.transition().duration(duration).each(function () {
$$.addTransitionForCircle(transitions, cx, cy); var transitionsToWait = [];
$$.addTransitionForText(transitions, xForText, yForText, options.flow);
$$.addTransitionForRegion(transitions); // redraw and gather transitions
$$.addTransitionForGrid(transitions); [
$$.redrawBar(drawBar, true),
$$.redrawLine(drawLine, true),
$$.redrawArea(drawArea, true),
$$.redrawCircle(cx, cy, true),
$$.redrawText(xForText, yForText, options.flow, true),
$$.redrawRegion(true),
$$.redrawGrid(true),
].forEach(function (transitions) {
transitions.forEach(function (transition) {
transitionsToWait.push(transition);
});
});
// Wait for end of transitions if called from flow API // Wait for end of transitions to call flow and onrendered callback
if (options.flow) {
waitForDraw = $$.generateWait(); waitForDraw = $$.generateWait();
transitions.forEach(function (t) { transitionsToWait.forEach(function (t) {
waitForDraw.add(t); waitForDraw.add(t);
}); });
flow = $$.generateFlow({ })
targets: targetsToShow, .call(waitForDraw, function () {
flow: options.flow, if (flow) {
duration: duration, flow();
drawBar: drawBar, }
drawLine: drawLine, if (config.onrendered) {
drawArea: drawArea, config.onrendered.call($$);
cx: cx, }
cy: cy, });
xv: xv, }
xForText: xForText, else {
yForText: yForText $$.redrawBar(drawBar);
}); $$.redrawLine(drawLine);
$$.redrawArea(drawArea);
$$.redrawCircle(cx, cy);
$$.redrawText(xForText, yForText, options.flow);
$$.redrawRegion();
$$.redrawGrid();
if (config.onrendered) {
config.onrendered.call($$);
} }
}) }
.call(waitForDraw || function () {}, flow || function () {});
// update fadein condition // update fadein condition
$$.mapToIds($$.data.targets).forEach(function (id) { $$.mapToIds($$.data.targets).forEach(function (id) {
@ -923,3 +951,18 @@ c3_chart_internal_fn.parseDate = function (date) {
} }
return parsedDate; return parsedDate;
}; };
c3_chart_internal_fn.isTabVisible = function () {
var hidden;
if (typeof document.hidden !== "undefined") { // Opera 12.10 and Firefox 18 and later support
hidden = "hidden";
} else if (typeof document.mozHidden !== "undefined") {
hidden = "mozHidden";
} else if (typeof document.msHidden !== "undefined") {
hidden = "msHidden";
} else if (typeof document.webkitHidden !== "undefined") {
hidden = "webkitHidden";
}
return document[hidden] ? false : true;
};

4
src/data.js
Unescape View File

@ -261,13 +261,13 @@ c3_chart_internal_fn.hasDataLabel = function () {
} }
return false; return false;
}; };
c3_chart_internal_fn.getDataLabelLength = function (min, max, axisId, key) { c3_chart_internal_fn.getDataLabelLength = function (min, max, key) {
var $$ = this, var $$ = this,
lengths = [0, 0], paddingCoef = 1.3; lengths = [0, 0], paddingCoef = 1.3;
$$.selectChart.select('svg').selectAll('.dummy') $$.selectChart.select('svg').selectAll('.dummy')
.data([min, max]) .data([min, max])
.enter().append('text') .enter().append('text')
.text(function (d) { return $$.formatByAxisId(axisId)(d); }) .text(function (d) { return $$.dataLabelFormat(d.id)(d); })
.each(function (d, i) { .each(function (d, i) {
lengths[i] = this.getBoundingClientRect()[key] * paddingCoef; lengths[i] = this.getBoundingClientRect()[key] * paddingCoef;
}) })

24
src/domain.js
Unescape View File

@ -66,22 +66,19 @@ c3_chart_internal_fn.getYDomain = function (targets, axisId, xDomain) {
yTargets = xDomain ? $$.filterByXDomain(targetsByAxisId, xDomain) : targetsByAxisId, yTargets = xDomain ? $$.filterByXDomain(targetsByAxisId, xDomain) : targetsByAxisId,
yMin = axisId === 'y2' ? config.axis_y2_min : config.axis_y_min, yMin = axisId === 'y2' ? config.axis_y2_min : config.axis_y_min,
yMax = axisId === 'y2' ? config.axis_y2_max : config.axis_y_max, yMax = axisId === 'y2' ? config.axis_y2_max : config.axis_y_max,
yDomainMin = isValue(yMin) ? yMin : $$.getYDomainMin(yTargets), yDomainMin = $$.getYDomainMin(yTargets),
yDomainMax = isValue(yMax) ? yMax : $$.getYDomainMax(yTargets), yDomainMax = $$.getYDomainMax(yTargets),
domainLength, padding, padding_top, padding_bottom, domain, domainLength, padding, padding_top, padding_bottom,
center = axisId === 'y2' ? config.axis_y2_center : config.axis_y_center, center = axisId === 'y2' ? config.axis_y2_center : config.axis_y_center,
yDomainAbs, lengths, diff, ratio, isAllPositive, isAllNegative, yDomainAbs, lengths, diff, ratio, isAllPositive, isAllNegative,
isZeroBased = ($$.hasType('bar', yTargets) && config.bar_zerobased) || ($$.hasType('area', yTargets) && config.area_zerobased), isZeroBased = ($$.hasType('bar', yTargets) && config.bar_zerobased) || ($$.hasType('area', yTargets) && config.area_zerobased),
isInverted = axisId === 'y2' ? config.axis_y2_inverted : config.axis_y_inverted,
showHorizontalDataLabel = $$.hasDataLabel() && config.axis_rotated, showHorizontalDataLabel = $$.hasDataLabel() && config.axis_rotated,
showVerticalDataLabel = $$.hasDataLabel() && !config.axis_rotated; showVerticalDataLabel = $$.hasDataLabel() && !config.axis_rotated;
if (yDomainMax < yDomainMin) { // MEMO: avoid inverting domain unexpectedly
if (isValue(yMin)) { yDomainMin = isValue(yMin) ? yMin : isValue(yMax) ? (yDomainMin < yMax ? yDomainMin : yMax - 10) : yDomainMin;
yDomainMax = yDomainMin + 10; // TODO: introduce axis.y.maxMin yDomainMax = isValue(yMax) ? yMax : isValue(yMin) ? (yMin < yDomainMax ? yDomainMax : yMin + 10) : yDomainMax;
} else {
yDomainMin = yDomainMax - 10; // TODO: introduce axis.y.minMax
}
}
if (yTargets.length === 0) { // use current domain if target of axisId is none if (yTargets.length === 0) { // use current domain if target of axisId is none
return axisId === 'y2' ? $$.y2.domain() : $$.y.domain(); return axisId === 'y2' ? $$.y2.domain() : $$.y.domain();
@ -119,13 +116,13 @@ c3_chart_internal_fn.getYDomain = function (targets, axisId, xDomain) {
} }
// add padding for data label // add padding for data label
if (showHorizontalDataLabel) { if (showHorizontalDataLabel) {
lengths = $$.getDataLabelLength(yDomainMin, yDomainMax, axisId, 'width'); lengths = $$.getDataLabelLength(yDomainMin, yDomainMax, 'width');
diff = diffDomain($$.y.range()); diff = diffDomain($$.y.range());
ratio = [lengths[0] / diff, lengths[1] / diff]; ratio = [lengths[0] / diff, lengths[1] / diff];
padding_top += domainLength * (ratio[1] / (1 - ratio[0] - ratio[1])); padding_top += domainLength * (ratio[1] / (1 - ratio[0] - ratio[1]));
padding_bottom += domainLength * (ratio[0] / (1 - ratio[0] - ratio[1])); padding_bottom += domainLength * (ratio[0] / (1 - ratio[0] - ratio[1]));
} else if (showVerticalDataLabel) { } else if (showVerticalDataLabel) {
lengths = $$.getDataLabelLength(yDomainMin, yDomainMax, axisId, 'height'); lengths = $$.getDataLabelLength(yDomainMin, yDomainMax, 'height');
padding_top += this.convertPixelsToAxisPadding(lengths[1], domainLength); padding_top += this.convertPixelsToAxisPadding(lengths[1], domainLength);
padding_bottom += this.convertPixelsToAxisPadding(lengths[0], domainLength); padding_bottom += this.convertPixelsToAxisPadding(lengths[0], domainLength);
} }
@ -142,7 +139,8 @@ c3_chart_internal_fn.getYDomain = function (targets, axisId, xDomain) {
if (isAllPositive) { padding_bottom = yDomainMin; } if (isAllPositive) { padding_bottom = yDomainMin; }
if (isAllNegative) { padding_top = -yDomainMax; } if (isAllNegative) { padding_top = -yDomainMax; }
} }
return [yDomainMin - padding_bottom, yDomainMax + padding_top]; domain = [yDomainMin - padding_bottom, yDomainMax + padding_top];
return isInverted ? domain.reverse() : domain;
}; };
c3_chart_internal_fn.getXDomainMin = function (targets) { c3_chart_internal_fn.getXDomainMin = function (targets) {
var $$ = this, config = $$.config; var $$ = this, config = $$.config;

3
src/drag.js
Unescape View File

@ -65,7 +65,6 @@ c3_chart_internal_fn.dragstart = function (mouse) {
.attr('class', CLASS.dragarea) .attr('class', CLASS.dragarea)
.style('opacity', 0.1); .style('opacity', 0.1);
$$.dragging = true; $$.dragging = true;
$$.config.data_ondragstart.call($$.api);
}; };
c3_chart_internal_fn.dragend = function () { c3_chart_internal_fn.dragend = function () {
@ -79,6 +78,4 @@ c3_chart_internal_fn.dragend = function () {
$$.main.selectAll('.' + CLASS.shape) $$.main.selectAll('.' + CLASS.shape)
.classed(CLASS.INCLUDED, false); .classed(CLASS.INCLUDED, false);
$$.dragging = false; $$.dragging = false;
$$.config.data_ondragend.call($$.api);
}; };

12
src/format.js
Unescape View File

@ -23,16 +23,20 @@ c3_chart_internal_fn.defaultValueFormat = function (v) {
c3_chart_internal_fn.defaultArcValueFormat = function (v, ratio) { c3_chart_internal_fn.defaultArcValueFormat = function (v, ratio) {
return (ratio * 100).toFixed(1) + '%'; return (ratio * 100).toFixed(1) + '%';
}; };
c3_chart_internal_fn.formatByAxisId = function (axisId) { c3_chart_internal_fn.dataLabelFormat = function (targetId) {
var $$ = this, data_labels = $$.config.data_labels, var $$ = this, data_labels = $$.config.data_labels,
format = function (v) { return isValue(v) ? +v : ""; }; format, defaultFormat = function (v) { return isValue(v) ? +v : ""; };
// find format according to axis id // find format according to axis id
if (typeof data_labels.format === 'function') { if (typeof data_labels.format === 'function') {
format = data_labels.format; format = data_labels.format;
} else if (typeof data_labels.format === 'object') { } else if (typeof data_labels.format === 'object') {
if (data_labels.format[axisId]) { if (data_labels.format[targetId]) {
format = data_labels.format[axisId]; format = data_labels.format[targetId] === true ? defaultFormat : data_labels.format[targetId];
} else {
format = function () { return ''; };
} }
} else {
format = defaultFormat;
} }
return format; return format;
}; };

34
src/grid.js
Unescape View File

@ -70,7 +70,7 @@ c3_chart_internal_fn.updateYGrid = function () {
}; };
c3_chart_internal_fn.redrawGrid = function (duration) { c3_chart_internal_fn.updateGrid = function (duration) {
var $$ = this, main = $$.main, config = $$.config, var $$ = this, main = $$.main, config = $$.config,
xgridLine, ygridLine, yv; xgridLine, ygridLine, yv;
@ -91,7 +91,7 @@ c3_chart_internal_fn.redrawGrid = function (duration) {
xgridLine.append('text') xgridLine.append('text')
.attr("text-anchor", "end") .attr("text-anchor", "end")
.attr("transform", config.axis_rotated ? "" : "rotate(-90)") .attr("transform", config.axis_rotated ? "" : "rotate(-90)")
.attr('dx', config.axis_rotated ? 0 : -$$.margin.top) .attr('dx', -4)
.attr('dy', -5) .attr('dy', -5)
.style("opacity", 0); .style("opacity", 0);
// udpate // udpate
@ -138,19 +138,23 @@ c3_chart_internal_fn.redrawGrid = function (duration) {
.style("opacity", 0) .style("opacity", 0)
.remove(); .remove();
}; };
c3_chart_internal_fn.addTransitionForGrid = function (transitions) { c3_chart_internal_fn.redrawGrid = function (withTransition) {
var $$ = this, config = $$.config, xv = $$.xv.bind($$); var $$ = this, config = $$.config, xv = $$.xv.bind($$),
transitions.push($$.xgridLines.select('line').transition() lines = $$.xgridLines.select('line'),
.attr("x1", config.axis_rotated ? 0 : xv) texts = $$.xgridLines.select('text');
.attr("x2", config.axis_rotated ? $$.width : xv) return [
.attr("y1", config.axis_rotated ? xv : $$.margin.top) (withTransition ? lines.transition() : lines)
.attr("y2", config.axis_rotated ? xv : $$.height) .attr("x1", config.axis_rotated ? 0 : xv)
.style("opacity", 1)); .attr("x2", config.axis_rotated ? $$.width : xv)
transitions.push($$.xgridLines.select('text').transition() .attr("y1", config.axis_rotated ? xv : 0)
.attr("x", config.axis_rotated ? $$.width : 0) .attr("y2", config.axis_rotated ? xv : $$.height)
.attr("y", xv) .style("opacity", 1),
.text(function (d) { return d.text; }) (withTransition ? texts.transition() : texts)
.style("opacity", 1)); .attr("x", config.axis_rotated ? $$.width : 0)
.attr("y", xv)
.text(function (d) { return d.text; })
.style("opacity", 1)
];
}; };
c3_chart_internal_fn.showXGridFocus = function (selectedData) { c3_chart_internal_fn.showXGridFocus = function (selectedData) {
var $$ = this, config = $$.config, var $$ = this, config = $$.config,

16
src/interaction.js
Unescape View File

@ -175,7 +175,7 @@ c3_chart_internal_fn.generateEventRectsForSingleX = function (eventRectEnter) {
}); });
if (config.tooltip_grouped) { if (config.tooltip_grouped) {
$$.showTooltip(selectedData, d3.mouse(this)); $$.showTooltip(selectedData, this);
$$.showXGridFocus(selectedData); $$.showXGridFocus(selectedData);
} }
@ -206,7 +206,7 @@ c3_chart_internal_fn.generateEventRectsForSingleX = function (eventRectEnter) {
eventRect.style('cursor', 'pointer'); eventRect.style('cursor', 'pointer');
} }
if (!config.tooltip_grouped) { if (!config.tooltip_grouped) {
$$.showTooltip([d], d3.mouse(this)); $$.showTooltip([d], this);
$$.showXGridFocus([d]); $$.showXGridFocus([d]);
if (config.point_focus_expand_enabled) { $$.expandCircles(index, d.id, true); } if (config.point_focus_expand_enabled) { $$.expandCircles(index, d.id, true); }
$$.expandBars(index, d.id, true); $$.expandBars(index, d.id, true);
@ -231,10 +231,12 @@ c3_chart_internal_fn.generateEventRectsForSingleX = function (eventRectEnter) {
}); });
}) })
.call( .call(
d3.behavior.drag().origin(Object) config.data_selection_draggable && $$.drag ? (
.on('drag', function () { $$.drag(d3.mouse(this)); }) d3.behavior.drag().origin(Object)
.on('dragstart', function () { $$.dragstart(d3.mouse(this)); }) .on('drag', function () { $$.drag(d3.mouse(this)); })
.on('dragend', function () { $$.dragend(); }) .on('dragstart', function () { $$.dragstart(d3.mouse(this)); })
.on('dragend', function () { $$.dragend(); })
) : function () {}
); );
}; };
@ -289,7 +291,7 @@ c3_chart_internal_fn.generateEventRectsForMultipleXs = function (eventRectEnter)
selectedData = sameXData.map(function (d) { selectedData = sameXData.map(function (d) {
return $$.addName(d); return $$.addName(d);
}); });
$$.showTooltip(selectedData, mouse); $$.showTooltip(selectedData, this);
// expand points // expand points
if (config.point_focus_expand_enabled) { if (config.point_focus_expand_enabled) {

7
src/polyfill.js
Unescape View File

@ -0,0 +1,7 @@
// fix problems using c3 with phantomjs #578
Function.prototype.bind = Function.prototype.bind || function (thisp) {
var fn = this;
return function () {
return fn.apply(thisp, arguments);
};
};

19
src/region.js
Unescape View File

@ -4,7 +4,7 @@ c3_chart_internal_fn.initRegion = function () {
.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.updateRegion = function (duration) {
var $$ = this, config = $$.config; var $$ = this, config = $$.config;
// hide if arc type // hide if arc type
@ -20,18 +20,21 @@ c3_chart_internal_fn.redrawRegion = function (duration) {
.style("opacity", 0) .style("opacity", 0)
.remove(); .remove();
}; };
c3_chart_internal_fn.addTransitionForRegion = function (transitions) { c3_chart_internal_fn.redrawRegion = function (withTransition) {
var $$ = this, var $$ = this,
regions = $$.mainRegion.selectAll('rect'),
x = $$.regionX.bind($$), x = $$.regionX.bind($$),
y = $$.regionY.bind($$), y = $$.regionY.bind($$),
w = $$.regionWidth.bind($$), w = $$.regionWidth.bind($$),
h = $$.regionHeight.bind($$); h = $$.regionHeight.bind($$);
transitions.push($$.mainRegion.selectAll('rect').transition() return [
.attr("x", x) (withTransition ? regions.transition() : regions)
.attr("y", y) .attr("x", x)
.attr("width", w) .attr("y", y)
.attr("height", h) .attr("width", w)
.style("fill-opacity", function (d) { return isValue(d.opacity) ? d.opacity : 0.1; })); .attr("height", h)
.style("fill-opacity", function (d) { return isValue(d.opacity) ? d.opacity : 0.1; })
];
}; };
c3_chart_internal_fn.regionX = function (d) { c3_chart_internal_fn.regionX = function (d) {
var $$ = this, config = $$.config, var $$ = this, config = $$.config,

15
src/shape.bar.js
Unescape View File

@ -22,7 +22,7 @@ c3_chart_internal_fn.updateTargetsForBar = function (targets) {
.style("cursor", function (d) { return config.data_selection_isselectable(d) ? "pointer" : null; }); .style("cursor", function (d) { return config.data_selection_isselectable(d) ? "pointer" : null; });
}; };
c3_chart_internal_fn.redrawBar = function (durationForExit) { c3_chart_internal_fn.updateBar = function (durationForExit) {
var $$ = this, var $$ = this,
barData = $$.barData.bind($$), barData = $$.barData.bind($$),
classBar = $$.classBar.bind($$), classBar = $$.classBar.bind($$),
@ -40,12 +40,13 @@ c3_chart_internal_fn.redrawBar = function (durationForExit) {
.style('opacity', 0) .style('opacity', 0)
.remove(); .remove();
}; };
c3_chart_internal_fn.addTransitionForBar = function (transitions, drawBar) { c3_chart_internal_fn.redrawBar = function (drawBar, withTransition) {
var $$ = this; return [
transitions.push($$.mainBar.transition() (withTransition ? this.mainBar.transition() : this.mainBar)
.attr('d', drawBar) .attr('d', drawBar)
.style("fill", $$.color) .style("fill", this.color)
.style("opacity", 1)); .style("opacity", 1)
];
}; };
c3_chart_internal_fn.getBarW = function (axis, barTargetsNum) { c3_chart_internal_fn.getBarW = function (axis, barTargetsNum) {
var $$ = this, config = $$.config, var $$ = this, config = $$.config,

60
src/shape.line.js
Unescape View File

@ -39,7 +39,7 @@ c3_chart_internal_fn.updateTargetsForLine = function (targets) {
// MEMO: can not keep same color... // MEMO: can not keep same color...
//mainLineUpdate.exit().remove(); //mainLineUpdate.exit().remove();
}; };
c3_chart_internal_fn.redrawLine = function (durationForExit) { c3_chart_internal_fn.updateLine = function (durationForExit) {
var $$ = this; var $$ = this;
$$.mainLine = $$.main.selectAll('.' + CLASS.lines).selectAll('.' + CLASS.line) $$.mainLine = $$.main.selectAll('.' + CLASS.lines).selectAll('.' + CLASS.line)
.data($$.lineData.bind($$)); .data($$.lineData.bind($$));
@ -54,12 +54,13 @@ c3_chart_internal_fn.redrawLine = function (durationForExit) {
.style('opacity', 0) .style('opacity', 0)
.remove(); .remove();
}; };
c3_chart_internal_fn.addTransitionForLine = function (transitions, drawLine) { c3_chart_internal_fn.redrawLine = function (drawLine, withTransition) {
var $$ = this; return [
transitions.push($$.mainLine.transition() (withTransition ? this.mainLine.transition() : this.mainLine)
.attr("d", drawLine) .attr("d", drawLine)
.style("stroke", $$.color) .style("stroke", this.color)
.style("opacity", 1)); .style("opacity", 1)
];
}; };
c3_chart_internal_fn.generateDrawLine = function (lineIndices, isSub) { c3_chart_internal_fn.generateDrawLine = function (lineIndices, isSub) {
var $$ = this, config = $$.config, var $$ = this, config = $$.config,
@ -199,7 +200,7 @@ c3_chart_internal_fn.lineWithRegions = function (d, x, y, _regions) {
}; };
c3_chart_internal_fn.redrawArea = function (durationForExit) { c3_chart_internal_fn.updateArea = function (durationForExit) {
var $$ = this, 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($$));
@ -213,12 +214,13 @@ c3_chart_internal_fn.redrawArea = function (durationForExit) {
.style('opacity', 0) .style('opacity', 0)
.remove(); .remove();
}; };
c3_chart_internal_fn.addTransitionForArea = function (transitions, drawArea) { c3_chart_internal_fn.redrawArea = function (drawArea, withTransition) {
var $$ = this; return [
transitions.push($$.mainArea.transition() (withTransition ? this.mainArea.transition() : this.mainArea)
.attr("d", drawArea) .attr("d", drawArea)
.style("fill", $$.color) .style("fill", this.color)
.style("opacity", $$.orgAreaOpacity)); .style("opacity", this.orgAreaOpacity)
];
}; };
c3_chart_internal_fn.generateDrawArea = function (areaIndices, isSub) { c3_chart_internal_fn.generateDrawArea = function (areaIndices, isSub) {
var $$ = this, config = $$.config, area = $$.d3.svg.area(), var $$ = this, config = $$.config, area = $$.d3.svg.area(),
@ -226,7 +228,7 @@ c3_chart_internal_fn.generateDrawArea = function (areaIndices, isSub) {
yScaleGetter = isSub ? $$.getSubYScale : $$.getYScale, yScaleGetter = isSub ? $$.getSubYScale : $$.getYScale,
xValue = function (d) { return (isSub ? $$.subxx : $$.xx).call($$, d); }, xValue = function (d) { return (isSub ? $$.subxx : $$.xx).call($$, d); },
value0 = function (d, i) { value0 = function (d, i) {
return config.data_groups.length > 0 ? getPoints(d, i)[0][1] : yScaleGetter.call($$, d.id)(0); return config.data_groups.length > 0 ? getPoints(d, i)[0][1] : yScaleGetter.call($$, d.id)($$.getAreaBaseValue(d.id));
}, },
value1 = function (d, i) { value1 = function (d, i) {
return config.data_groups.length > 0 ? getPoints(d, i)[1][1] : yScaleGetter.call($$, d.id)(d.value); return config.data_groups.length > 0 ? getPoints(d, i)[1][1] : yScaleGetter.call($$, d.id)(d.value);
@ -253,7 +255,9 @@ c3_chart_internal_fn.generateDrawArea = function (areaIndices, isSub) {
return path ? path : "M 0 0"; return path ? path : "M 0 0";
}; };
}; };
c3_chart_internal_fn.getAreaBaseValue = function () {
return 0;
};
c3_chart_internal_fn.generateGetAreaPoints = function (areaIndices, isSub) { // partial duplication of generateGetBarPoints c3_chart_internal_fn.generateGetAreaPoints = function (areaIndices, isSub) { // partial duplication of generateGetBarPoints
var $$ = this, config = $$.config, var $$ = this, config = $$.config,
areaTargetsNum = areaIndices.__max__ + 1, areaTargetsNum = areaIndices.__max__ + 1,
@ -280,7 +284,7 @@ c3_chart_internal_fn.generateGetAreaPoints = function (areaIndices, isSub) { //
}; };
c3_chart_internal_fn.redrawCircle = function () { c3_chart_internal_fn.updateCircle = function () {
var $$ = this; var $$ = this;
$$.mainCircle = $$.main.selectAll('.' + CLASS.circles).selectAll('.' + CLASS.circle) $$.mainCircle = $$.main.selectAll('.' + CLASS.circles).selectAll('.' + CLASS.circle)
.data($$.lineOrScatterData.bind($$)); .data($$.lineOrScatterData.bind($$));
@ -292,16 +296,18 @@ c3_chart_internal_fn.redrawCircle = function () {
.style("opacity", $$.initialOpacityForCircle.bind($$)); .style("opacity", $$.initialOpacityForCircle.bind($$));
$$.mainCircle.exit().remove(); $$.mainCircle.exit().remove();
}; };
c3_chart_internal_fn.addTransitionForCircle = function (transitions, cx, cy) { c3_chart_internal_fn.redrawCircle = function (cx, cy, withTransition) {
var $$ = this; var selectedCircles = this.main.selectAll('.' + CLASS.selectedCircle);
transitions.push($$.mainCircle.transition() return [
.style('opacity', $$.opacityForCircle.bind($$)) (withTransition ? this.mainCircle.transition() : this.mainCircle)
.style("fill", $$.color) .style('opacity', this.opacityForCircle.bind(this))
.attr("cx", cx) .style("fill", this.color)
.attr("cy", cy)); .attr("cx", cx)
transitions.push($$.main.selectAll('.' + CLASS.selectedCircle).transition() .attr("cy", cy),
.attr("cx", cx) (withTransition ? selectedCircles.transition() : selectedCircles)
.attr("cy", cy)); .attr("cx", cx)
.attr("cy", cy)
];
}; };
c3_chart_internal_fn.circleX = function (d) { c3_chart_internal_fn.circleX = function (d) {
return d.x || d.x === 0 ? this.x(d.x) : null; return d.x || d.x === 0 ? this.x(d.x) : null;

135
src/subchart.js
Unescape View File

@ -13,9 +13,7 @@ c3_chart_internal_fn.initSubchart = function () {
var $$ = this, config = $$.config, var $$ = this, config = $$.config,
context = $$.context = $$.svg.append("g").attr("transform", $$.getTranslate('context')); context = $$.context = $$.svg.append("g").attr("transform", $$.getTranslate('context'));
if (!config.subchart_show) { context.style('visibility', config.subchart_show ? 'visible' : 'hidden');
context.style('visibility', 'hidden');
}
// Define g for chart area // Define g for chart area
context.append('g') context.append('g')
@ -34,9 +32,7 @@ c3_chart_internal_fn.initSubchart = function () {
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")
.attr(config.axis_rotated ? "width" : "height", config.axis_rotated ? $$.width2 : $$.height2);
// ATTENTION: This must be called AFTER chart added // ATTENTION: This must be called AFTER chart added
// Add Axis // Add Axis
@ -55,6 +51,7 @@ c3_chart_internal_fn.updateTargetsForSubchart = function (targets) {
classAreas = $$.classAreas.bind($$); classAreas = $$.classAreas.bind($$);
if (config.subchart_show) { if (config.subchart_show) {
//-- Bar --//
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);
@ -78,17 +75,74 @@ c3_chart_internal_fn.updateTargetsForSubchart = function (targets) {
// Area // Area
contextLineEnter.append("g") contextLineEnter.append("g")
.attr("class", classAreas); .attr("class", classAreas);
//-- Brush --//
context.selectAll('.' + CLASS.brush + ' rect')
.attr(config.axis_rotated ? "width" : "height", config.axis_rotated ? $$.width2 : $$.height2);
} }
}; };
c3_chart_internal_fn.updateBarForSubchart = function (durationForExit) {
var $$ = this;
$$.contextBar = $$.context.selectAll('.' + CLASS.bars).selectAll('.' + CLASS.bar)
.data($$.barData.bind($$));
$$.contextBar.enter().append('path')
.attr("class", $$.classBar.bind($$))
.style("stroke", 'none')
.style("fill", $$.color);
$$.contextBar
.style("opacity", $$.initialOpacity.bind($$));
$$.contextBar.exit().transition().duration(durationForExit)
.style('opacity', 0)
.remove();
};
c3_chart_internal_fn.redrawBarForSubchart = function (drawBarOnSub, withTransition, duration) {
(withTransition ? this.contextBar.transition().duration(duration) : this.contextBar)
.attr('d', drawBarOnSub)
.style('opacity', 1);
};
c3_chart_internal_fn.updateLineForSubchart = function (durationForExit) {
var $$ = this;
$$.contextLine = $$.context.selectAll('.' + CLASS.lines).selectAll('.' + CLASS.line)
.data($$.lineData.bind($$));
$$.contextLine.enter().append('path')
.attr('class', $$.classLine.bind($$))
.style('stroke', $$.color);
$$.contextLine
.style("opacity", $$.initialOpacity.bind($$));
$$.contextLine.exit().transition().duration(durationForExit)
.style('opacity', 0)
.remove();
};
c3_chart_internal_fn.redrawLineForSubchart = function (drawLineOnSub, withTransition, duration) {
(withTransition ? this.contextLine.transition().duration(duration) : this.contextLine)
.attr("d", drawLineOnSub)
.style('opacity', 1);
};
c3_chart_internal_fn.updateAreaForSubchart = function (durationForExit) {
var $$ = this, d3 = $$.d3;
$$.contextArea = $$.context.selectAll('.' + CLASS.areas).selectAll('.' + CLASS.area)
.data($$.lineData.bind($$));
$$.contextArea.enter().append('path')
.attr("class", $$.classArea.bind($$))
.style("fill", $$.color)
.style("opacity", function () { $$.orgAreaOpacity = +d3.select(this).style('opacity'); return 0; });
$$.contextArea
.style("opacity", 0);
$$.contextArea.exit().transition().duration(durationForExit)
.style('opacity', 0)
.remove();
};
c3_chart_internal_fn.redrawAreaForSubchart = function (drawAreaOnSub, withTransition, duration) {
(withTransition ? this.contextArea.transition().duration(duration) : this.contextArea)
.attr("d", drawAreaOnSub)
.style("fill", this.color)
.style("opacity", this.orgAreaOpacity);
};
c3_chart_internal_fn.redrawSubchart = function (withSubchart, transitions, duration, durationForExit, areaIndices, barIndices, lineIndices) { c3_chart_internal_fn.redrawSubchart = function (withSubchart, transitions, duration, durationForExit, areaIndices, barIndices, lineIndices) {
var $$ = this, d3 = $$.d3, context = $$.context, config = $$.config, var $$ = this, d3 = $$.d3, config = $$.config,
contextLine, contextArea, contextBar, drawAreaOnSub, drawBarOnSub, drawLineOnSub, drawAreaOnSub, drawBarOnSub, drawLineOnSub;
barData = $$.barData.bind($$),
lineData = $$.lineData.bind($$), $$.context.style('visibility', config.subchart_show ? 'visible' : 'hidden');
classBar = $$.classBar.bind($$),
classLine = $$.classLine.bind($$),
classArea = $$.classArea.bind($$),
initialOpacity = $$.initialOpacity.bind($$);
// subchart // subchart
if (config.subchart_show) { if (config.subchart_show) {
@ -107,51 +161,14 @@ c3_chart_internal_fn.redrawSubchart = function (withSubchart, transitions, durat
drawAreaOnSub = $$.generateDrawArea(areaIndices, true); drawAreaOnSub = $$.generateDrawArea(areaIndices, true);
drawBarOnSub = $$.generateDrawBar(barIndices, true); drawBarOnSub = $$.generateDrawBar(barIndices, true);
drawLineOnSub = $$.generateDrawLine(lineIndices, true); drawLineOnSub = $$.generateDrawLine(lineIndices, true);
// bars
contextBar = context.selectAll('.' + CLASS.bars).selectAll('.' + CLASS.bar) $$.updateBarForSubchart(duration);
.data(barData); $$.updateLineForSubchart(duration);
contextBar.enter().append('path') $$.updateAreaForSubchart(duration);
.attr("class", classBar)
.style("stroke", 'none') $$.redrawBarForSubchart(drawBarOnSub, duration, duration);
.style("fill", $$.color); $$.redrawLineForSubchart(drawLineOnSub, duration, duration);
contextBar $$.redrawAreaForSubchart(drawAreaOnSub, duration, duration);
.style("opacity", initialOpacity)
.transition().duration(duration)
.attr('d', drawBarOnSub)
.style('opacity', 1);
contextBar.exit().transition().duration(duration)
.style('opacity', 0)
.remove();
// lines
contextLine = context.selectAll('.' + CLASS.lines).selectAll('.' + CLASS.line)
.data(lineData);
contextLine.enter().append('path')
.attr('class', classLine)
.style('stroke', $$.color);
contextLine
.style("opacity", initialOpacity)
.transition().duration(duration)
.attr("d", drawLineOnSub)
.style('opacity', 1);
contextLine.exit().transition().duration(duration)
.style('opacity', 0)
.remove();
// area
contextArea = context.selectAll('.' + CLASS.areas).selectAll('.' + CLASS.area)
.data(lineData);
contextArea.enter().append('path')
.attr("class", classArea)
.style("fill", $$.color)
.style("opacity", function () { $$.orgAreaOpacity = +d3.select(this).style('opacity'); return 0; });
contextArea
.style("opacity", 0)
.transition().duration(duration)
.attr("d", drawAreaOnSub)
.style("fill", $$.color)
.style("opacity", $$.orgAreaOpacity);
contextArea.exit().transition().duration(durationForExit)
.style('opacity', 0)
.remove();
} }
} }
}; };

20
src/text.js
Unescape View File

@ -19,7 +19,7 @@ c3_chart_internal_fn.updateTargetsForText = function (targets) {
mainTextEnter.append('g') mainTextEnter.append('g')
.attr('class', classTexts); .attr('class', classTexts);
}; };
c3_chart_internal_fn.redrawText = function (durationForExit) { c3_chart_internal_fn.updateText = function (durationForExit) {
var $$ = this, config = $$.config, var $$ = this, config = $$.config,
barOrLineData = $$.barOrLineData.bind($$), barOrLineData = $$.barOrLineData.bind($$),
classText = $$.classText.bind($$); classText = $$.classText.bind($$);
@ -32,20 +32,20 @@ c3_chart_internal_fn.redrawText = function (durationForExit) {
.style("fill", function (d) { return $$.color(d); }) .style("fill", function (d) { return $$.color(d); })
.style("fill-opacity", 0); .style("fill-opacity", 0);
$$.mainText $$.mainText
.text(function (d, i, j) { return $$.formatByAxisId($$.getAxisId(d.id))(d.value, d.id, i, j); }); .text(function (d, i, j) { return $$.dataLabelFormat(d.id)(d.value, d.id, i, j); });
$$.mainText.exit() $$.mainText.exit()
.transition().duration(durationForExit) .transition().duration(durationForExit)
.style('fill-opacity', 0) .style('fill-opacity', 0)
.remove(); .remove();
}; };
c3_chart_internal_fn.addTransitionForText = function (transitions, xForText, yForText, forFlow) { c3_chart_internal_fn.redrawText = function (xForText, yForText, forFlow, withTransition) {
var $$ = this, return [
opacityForText = forFlow ? 0 : $$.opacityForText.bind($$); (withTransition ? this.mainText.transition() : this.mainText)
transitions.push($$.mainText.transition() .attr('x', xForText)
.attr('x', xForText) .attr('y', yForText)
.attr('y', yForText) .style("fill", this.color)
.style("fill", $$.color) .style("fill-opacity", forFlow ? 0 : this.opacityForText.bind(this))
.style("fill-opacity", opacityForText)); ];
}; };
c3_chart_internal_fn.getTextRect = function (text, cls) { c3_chart_internal_fn.getTextRect = function (text, cls) {
var body = this.d3.select('body').classed('c3', true), var body = this.d3.select('body').classed('c3', true),

56
src/tooltip.js
Unescape View File

@ -38,33 +38,27 @@ c3_chart_internal_fn.getTooltipContent = function (d, defaultTitleFormat, defaul
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, d[i].ratio, d[i].id, d[i].index);
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); if (value !== undefined) {
name = nameFormat(d[i].name, d[i].ratio, d[i].id, d[i].index);
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>";
}
} }
return text + "</table>"; return text + "</table>";
}; };
c3_chart_internal_fn.showTooltip = function (selectedData, mouse) { c3_chart_internal_fn.tooltipPosition = function (dataToShow, tWidth, tHeight, element) {
var $$ = this, config = $$.config; var $$ = this, config = $$.config, d3 = $$.d3;
var tWidth, tHeight, svgLeft, tooltipLeft, tooltipRight, tooltipTop, chartRight; var svgLeft, tooltipLeft, tooltipRight, tooltipTop, chartRight;
var forArc = $$.hasArcType(), var forArc = $$.hasArcType(),
dataToShow = selectedData.filter(function (d) { return d && isValue(d.value); }); mouse = d3.mouse(element);
if (dataToShow.length === 0 || !config.tooltip_show) { // Determin tooltip position
return;
}
$$.tooltip.html(config.tooltip_contents.call($$, selectedData, $$.getXAxisTickFormat(), $$.getYFormat(forArc), $$.color)).style("display", "block");
// Get tooltip dimensions
tWidth = $$.tooltip.property('offsetWidth');
tHeight = $$.tooltip.property('offsetHeight');
// Determin tooltip position
if (forArc) { if (forArc) {
tooltipLeft = ($$.width / 2) + mouse[0]; tooltipLeft = (($$.width - ($$.isLegendRight ? $$.getLegendWidth() : 0)) / 2) + mouse[0];
tooltipTop = ($$.height / 2) + mouse[1] + 20; tooltipTop = ($$.height / 2) + mouse[1] + 20;
} else { } else {
svgLeft = $$.getSvgLeft(true); svgLeft = $$.getSvgLeft(true);
@ -90,10 +84,28 @@ c3_chart_internal_fn.showTooltip = function (selectedData, mouse) {
if (tooltipTop < 0) { if (tooltipTop < 0) {
tooltipTop = 0; tooltipTop = 0;
} }
return {top: tooltipTop, left: tooltipLeft};
};
c3_chart_internal_fn.showTooltip = function (selectedData, element) {
var $$ = this, config = $$.config;
var tWidth, tHeight, position;
var forArc = $$.hasArcType(),
dataToShow = selectedData.filter(function (d) { return d && isValue(d.value); }),
positionFunction = config.tooltip_position || c3_chart_internal_fn.tooltipPosition;
if (dataToShow.length === 0 || !config.tooltip_show) {
return;
}
$$.tooltip.html(config.tooltip_contents.call($$, selectedData, $$.getXAxisTickFormat(), $$.getYFormat(forArc), $$.color)).style("display", "block");
// Get tooltip dimensions
tWidth = $$.tooltip.property('offsetWidth');
tHeight = $$.tooltip.property('offsetHeight');
position = positionFunction.call(this, dataToShow, tWidth, tHeight, element);
// Set tooltip // Set tooltip
$$.tooltip $$.tooltip
.style("top", tooltipTop + "px") .style("top", position.top + "px")
.style("left", tooltipLeft + 'px'); .style("left", position.left + 'px');
}; };
c3_chart_internal_fn.hideTooltip = function () { c3_chart_internal_fn.hideTooltip = function () {
this.tooltip.style("display", "none"); this.tooltip.style("display", "none");

Write Preview
Loading…
Cancel
Save