@ -8,15 +8,26 @@
var c3 _chart _fn , c3 _chart _internal _fn ;
function Chart ( config ) {
var $$ = this . internal = new ChartInternal ( config , this ) ;
var $$ = this . internal = new ChartInternal ( this ) ;
$$ . loadConfig ( config ) ;
$$ . init ( ) ;
// bind "this" to nested API
( function bindThis ( fn , target , argThis ) {
for ( var key in fn ) {
target [ key ] = fn [ key ] . bind ( argThis ) ;
if ( Object . keys ( fn [ key ] ) . length > 0 ) {
bindThis ( fn [ key ] , target [ key ] , argThis ) ;
}
}
} ) ( c3 _chart _fn , this , this ) ;
}
function ChartInternal ( config , api ) {
function ChartInternal ( api ) {
var $$ = this ;
$$ . d3 = window . d3 ? window . d3 : typeof require !== 'undefined' ? require ( "d3" ) : undefined ;
$$ . api = api ;
$$ . config = $$ . getDefaultConfig ( ) ;
$$ . data = { } ;
$$ . cache = { } ;
$$ . axes = { } ;
@ -59,7 +70,7 @@
} ;
c3 _chart _internal _fn . initParams = function ( ) {
var $$ = this , d3 = $$ . d3 ;
var $$ = this , d3 = $$ . d3 , config = $$ . config ;
// MEMO: clipId needs to be unique because it conflicts when multiple charts exist
$$ . clipId = "c3-" + ( + new Date ( ) ) + '-clip' ,
@ -78,7 +89,7 @@
$$ . color = $$ . generateColor ( ) ;
$$ . levelColor = $$ . generateLevelColor ( ) ;
$$ . dataTimeFormat = config [ _ _data _x _l ocaltime] ? d3 . time . format : d3 . time . format . utc ;
$$ . dataTimeFormat = config [ _ _data _xL ocaltime ] ? d3 . time . format : d3 . time . format . utc ;
$$ . axisTimeFormat = config [ _ _axis _x _localtime ] ? d3 . time . format : d3 . time . format . utc ;
$$ . defaultAxisTimeFormat = $$ . axisTimeFormat . multi ( [
[ ".%L" , function ( d ) { return d . getMilliseconds ( ) ; } ] ,
@ -505,6 +516,7 @@
var drawArea , drawBar , drawLine , xForText , yForText ;
var duration , durationForExit , durationForAxis , waitForDraw ;
var targetsToShow = $$ . filterTargetsToShow ( $$ . data . targets ) , tickValues , i , intervalForCulling ;
var xv , cx , cy ;
xgrid = xgridLines = mainCircle = mainText = d3 . selectAll ( [ ] ) ;
@ -870,13 +882,13 @@
}
}
var xv _ = generateCall ( $$ . xv , $$ ) ;
xv = generateCall ( $$ . xv , $$ ) ;
cx = generateCall ( $$ . config [ _ _axis _rotated ] ? $$ . circleY : $$ . circleX , $$ ) ;
cy = generateCall ( $$ . config [ _ _axis _rotated ] ? $$ . circleX : $$ . circleY , $$ ) ;
// transition should be derived from one transition
d3 . transition ( ) . duration ( duration ) . each ( function ( ) {
var transitions = [ ] ,
cx = generateCall ( $$ . config [ _ _axis _rotated ] ? $$ . circleY : $$ . circleX , $$ ) ,
cy = generateCall ( $$ . config [ _ _axis _rotated ] ? $$ . circleX : $$ . circleY , $$ ) ;
var transitions = [ ] ;
transitions . push ( mainBar . transition ( )
. attr ( 'd' , drawBar )
@ -904,20 +916,20 @@
. style ( "fill" , $$ . color )
. style ( "fill-opacity" , options . flow ? 0 : generateCall ( $$ . opacityForText , $$ ) ) ) ;
transitions . push ( mainRegion . selectAll ( 'rect' ) . transition ( )
. attr ( "x" , $$ . regionX )
. attr ( "y" , $$ . regionY )
. attr ( "width" , $$ . regionWidth )
. attr ( "height" , $$ . regionHeight )
. attr ( "x" , generateCall ( $$ . regionX , $$ ) )
. attr ( "y" , generateCall ( $$ . regionY , $$ ) )
. attr ( "width" , generateCall ( $$ . regionWidth , $$ ) )
. attr ( "height" , generateCall ( $$ . regionHeight , $$ ) )
. style ( "fill-opacity" , function ( d ) { return isValue ( d . opacity ) ? d . opacity : 0.1 ; } ) ) ;
transitions . push ( xgridLines . select ( 'line' ) . transition ( )
. attr ( "x1" , config [ _ _axis _rotated ] ? 0 : xv _ )
. attr ( "x2" , config [ _ _axis _rotated ] ? $$ . width : xv _ )
. attr ( "y1" , config [ _ _axis _rotated ] ? xv _ : $$ . margin . top )
. attr ( "y2" , config [ _ _axis _rotated ] ? xv _ : $$ . height )
. attr ( "x1" , config [ _ _axis _rotated ] ? 0 : xv )
. attr ( "x2" , config [ _ _axis _rotated ] ? $$ . width : xv )
. attr ( "y1" , config [ _ _axis _rotated ] ? xv : $$ . margin . top )
. attr ( "y2" , config [ _ _axis _rotated ] ? xv : $$ . height )
. style ( "opacity" , 1 ) ) ;
transitions . push ( xgridLines . select ( 'text' ) . transition ( )
. attr ( "x" , config [ _ _axis _rotated ] ? $$ . width : 0 )
. attr ( "y" , xv _ )
. attr ( "y" , xv )
. text ( function ( d ) { return d . text ; } )
. style ( "opacity" , 1 ) ) ;
// Wait for end of transitions if called from flow API
@ -1008,11 +1020,11 @@
xgridLines
. attr ( 'transform' , null ) ;
xgridLines . select ( 'line' )
. attr ( "x1" , config [ _ _axis _rotated ] ? 0 : xv _ )
. attr ( "x2" , config [ _ _axis _rotated ] ? $$ . width : xv _ ) ;
. attr ( "x1" , config [ _ _axis _rotated ] ? 0 : xv )
. attr ( "x2" , config [ _ _axis _rotated ] ? $$ . width : xv ) ;
xgridLines . select ( 'text' )
. attr ( "x" , config [ _ _axis _rotated ] ? $$ . width : 0 )
. attr ( "y" , xv _ ) ;
. attr ( "y" , xv ) ;
mainBar
. attr ( 'transform' , null )
. attr ( "d" , drawBar ) ;
@ -1024,8 +1036,8 @@
. attr ( "d" , drawArea ) ;
mainCircle
. attr ( 'transform' , null )
. attr ( "cx" , config [ _ _axis _rotated ] ? $$ . circleY : $$ . circleX )
. attr ( "cy" , config [ _ _axis _rotated ] ? $$ . circleX : $$ . circleY ) ;
. attr ( "cx" , cx )
. attr ( "cy" , cy ) ;
mainText
. attr ( 'transform' , null )
. attr ( 'x' , xForText )
@ -1034,8 +1046,8 @@
mainRegion
. attr ( 'transform' , null ) ;
mainRegion . select ( 'rect' ) . filter ( $$ . isRegionOnX )
. attr ( "x" , $$ . regionX )
. attr ( "width" , $$ . regionWidth ) ;
. attr ( "x" , generateCall ( $$ . regionX , $$ ) )
. attr ( "width" , generateCall ( $$ . regionWidth , $$ ) ) ;
eventRectUpdate
. attr ( "x" , config [ _ _axis _rotated ] ? 0 : rectX )
. attr ( "y" , config [ _ _axis _rotated ] ? rectX : 0 )
@ -1391,7 +1403,7 @@
c3 _chart _internal _fn . transformAll = function ( withTransition , transitions ) {
var $$ = this ;
$$ . transformMain ( withTransition , transitions ) ;
if ( config [ _ _subchart _show ] ) { $$ . transformContext ( withTransition , transitions ) ; }
if ( $$ . config [ _ _subchart _show ] ) { $$ . transformContext ( withTransition , transitions ) ; }
if ( $$ . legend ) { $$ . transformLegend ( withTransition ) ; }
} ;
@ -1538,7 +1550,7 @@
} else if ( typeof date === 'number' ) {
parsedDate = new Date ( date ) ;
} else {
parsedDate = $$ . dataTimeFormat ( config [ _ _data _x _f ormat] ) . parse ( date ) ;
parsedDate = $$ . dataTimeFormat ( $$ . config [ _ _data _xF ormat ] ) . parse ( date ) ;
}
if ( ! parsedDate || isNaN ( + parsedDate ) ) {
window . console . error ( "Failed to parse x '" + date + "' to Date object" ) ;
@ -1565,9 +1577,9 @@
_ _transition _duration = 'transition_duration' ,
_ _data _x = 'data_x' ,
_ _data _xs = 'data_xs' ,
_ _data _x _format = 'data_x_f ormat',
_ _data _x _localtime = 'data_x_l ocaltime',
_ _data _id _converter = 'data_id_c onverter',
_ _data _xFormat = 'data_xF ormat' ,
_ _data _xLocaltime = 'data_xL ocaltime' ,
_ _data _idConverter = 'data_idC onverter' ,
_ _data _names = 'data_names' ,
_ _data _classes = 'data_classes' ,
_ _data _groups = 'data_groups' ,
@ -1700,185 +1712,189 @@
_ _tooltip _init _x = 'tooltip_init_x' ,
_ _tooltip _init _position = 'tooltip_init_position' ;
var config = c3 _chart _internal _fn . config = { } ;
config [ _ _bindto ] = '#chart' ;
config [ _ _size _width ] = undefined ;
config [ _ _size _height ] = undefined ;
config [ _ _padding _left ] = undefined ;
config [ _ _padding _right ] = undefined ;
config [ _ _padding _top ] = undefined ;
config [ _ _padding _bottom ] = undefined ;
config [ _ _zoom _enabled ] = false ;
config [ _ _zoom _extent ] = undefined ;
config [ _ _zoom _privileged ] = false ;
config [ _ _zoom _onzoom ] = function ( ) { } ;
config [ _ _interaction _enabled ] = true ;
config [ _ _onmouseover ] = function ( ) { } ;
config [ _ _onmouseout ] = function ( ) { } ;
config [ _ _onresize ] = function ( ) { } ;
config [ _ _onresized ] = function ( ) { } ;
config [ _ _transition _duration ] = 350 ;
config [ _ _data _x ] = undefined ;
config [ _ _data _xs ] = { } ;
config [ _ _data _x _format ] = '%Y-%m-%d' ;
config [ _ _data _x _localtime ] = true ;
config [ _ _data _id _converter ] = function ( id ) { return id ; } ;
config [ _ _data _names ] = { } ;
config [ _ _data _classes ] = { } ;
config [ _ _data _groups ] = [ ] ;
config [ _ _data _axes ] = { } ;
config [ _ _data _type ] = undefined ;
config [ _ _data _types ] = { } ;
config [ _ _data _labels ] = { } ;
config [ _ _data _order ] = 'desc' ;
config [ _ _data _regions ] = { } ;
config [ _ _data _color ] = undefined ;
config [ _ _data _colors ] = { } ;
config [ _ _data _hide ] = false ;
config [ _ _data _filter ] = undefined ;
config [ _ _data _selection _enabled ] = false ;
config [ _ _data _selection _grouped ] = false ;
config [ _ _data _selection _isselectable ] = function ( ) { return true ; } ;
config [ _ _data _selection _multiple ] = true ;
config [ _ _data _onclick ] = function ( ) { } ;
config [ _ _data _onmouseover ] = function ( ) { } ;
config [ _ _data _onmouseout ] = function ( ) { } ;
config [ _ _data _onselected ] = function ( ) { } ;
config [ _ _data _onunselected ] = function ( ) { } ;
config [ _ _data _ondragstart ] = function ( ) { } ;
config [ _ _data _ondragend ] = function ( ) { } ;
config [ _ _data _url ] = undefined ;
config [ _ _data _json ] = undefined ;
config [ _ _data _rows ] = undefined ;
config [ _ _data _columns ] = undefined ;
config [ _ _data _mimeType ] = undefined ;
config [ _ _data _keys ] = undefined ;
// configuration for no plot-able data supplied.
config [ _ _data _empty _label _text ] = "" ;
// subchart
config [ _ _subchart _show ] = false ;
config [ _ _subchart _size _height ] = 60 ;
config [ _ _subchart _onbrush ] = function ( ) { } ;
// color
config [ _ _color _pattern ] = [ ] ;
config [ _ _color _threshold ] = { } ;
// legend
config [ _ _legend _show ] = true ;
config [ _ _legend _position ] = 'bottom' ;
config [ _ _legend _inset _anchor ] = 'top-left' ;
config [ _ _legend _inset _x ] = 10 ;
config [ _ _legend _inset _y ] = 0 ;
config [ _ _legend _inset _step ] = undefined ;
config [ _ _legend _item _onclick ] = undefined ;
config [ _ _legend _item _onmouseover ] = undefined ;
config [ _ _legend _item _onmouseout ] = undefined ;
config [ _ _legend _equally ] = false ;
// axis
config [ _ _axis _rotated ] = false ;
config [ _ _axis _x _show ] = true ;
config [ _ _axis _x _type ] = 'indexed' ;
config [ _ _axis _x _localtime ] = true ;
config [ _ _axis _x _categories ] = [ ] ;
config [ _ _axis _x _tick _centered ] = false ;
config [ _ _axis _x _tick _format ] = undefined ;
config [ _ _axis _x _tick _culling ] = { } ;
config [ _ _axis _x _tick _culling _max ] = 10 ;
config [ _ _axis _x _tick _count ] = undefined ;
config [ _ _axis _x _tick _fit ] = true ;
config [ _ _axis _x _tick _values ] = null ;
config [ _ _axis _x _tick _rotate ] = undefined ;
config [ _ _axis _x _tick _outer ] = true ;
config [ _ _axis _x _max ] = null ;
config [ _ _axis _x _min ] = null ;
config [ _ _axis _x _padding ] = { } ;
config [ _ _axis _x _height ] = undefined ;
config [ _ _axis _x _default ] = undefined ;
config [ _ _axis _x _label ] = { } ;
config [ _ _axis _y _show ] = true ;
config [ _ _axis _y _max ] = undefined ;
config [ _ _axis _y _min ] = undefined ;
config [ _ _axis _y _center ] = undefined ;
config [ _ _axis _y _label ] = { } ;
config [ _ _axis _y _tick _format ] = undefined ;
config [ _ _axis _y _tick _outer ] = true ;
config [ _ _axis _y _padding ] = undefined ;
config [ _ _axis _y _ticks ] = 10 ;
config [ _ _axis _y2 _show ] = false ;
config [ _ _axis _y2 _max ] = undefined ;
config [ _ _axis _y2 _min ] = undefined ;
config [ _ _axis _y2 _center ] = undefined ;
config [ _ _axis _y2 _label ] = { } ;
config [ _ _axis _y2 _tick _format ] = undefined ;
config [ _ _axis _y2 _tick _outer ] = true ;
config [ _ _axis _y2 _padding ] = undefined ;
config [ _ _axis _y2 _ticks ] = 10 ;
// grid
config [ _ _grid _x _show ] = false ;
config [ _ _grid _x _type ] = 'tick' ;
config [ _ _grid _x _lines ] = [ ] ;
config [ _ _grid _y _show ] = false ;
// not used
// grid_y_type: {}, 'tick'),
config [ _ _grid _y _lines ] = [ ] ;
config [ _ _grid _y _ticks ] = 10 ;
config [ _ _grid _focus _show ] = true ;
// point - point of each data
config [ _ _point _show ] = true ;
config [ _ _point _r ] = 2.5 ;
config [ _ _point _focus _expand _enabled ] = true ;
config [ _ _point _focus _expand _r ] = undefined ;
config [ _ _point _select _r ] = undefined ;
config [ _ _line _connect _null ] = false ;
// bar
config [ _ _bar _width ] = undefined ;
config [ _ _bar _width _ratio ] = 0.6 ;
config [ _ _bar _width _max ] = undefined ;
config [ _ _bar _zerobased ] = true ;
// area
config [ _ _area _zerobased ] = true ;
// pie
config [ _ _pie _label _show ] = true ;
config [ _ _pie _label _format ] = undefined ;
config [ _ _pie _label _threshold ] = 0.05 ;
config [ _ _pie _sort ] = true ;
config [ _ _pie _expand ] = true ;
// gauge
config [ _ _gauge _label _show ] = true ;
config [ _ _gauge _label _format ] = undefined ;
config [ _ _gauge _expand ] = true ;
config [ _ _gauge _min ] = 0 ;
config [ _ _gauge _max ] = 100 ;
config [ _ _gauge _units ] = undefined ;
config [ _ _gauge _width ] = undefined ;
// donut
config [ _ _donut _label _show ] = true ;
config [ _ _donut _label _format ] = undefined ;
config [ _ _donut _label _threshold ] = 0.05 ;
config [ _ _donut _width ] = undefined ;
config [ _ _donut _sort ] = true ;
config [ _ _donut _expand ] = true ;
config [ _ _donut _title ] = "" ;
// region - region to change style
config [ _ _regions ] = [ ] ;
// tooltip - show when mouseover on each data
config [ _ _tooltip _show ] = true ;
config [ _ _tooltip _grouped ] = true ;
config [ _ _tooltip _format _title ] = undefined ;
config [ _ _tooltip _format _name ] = undefined ;
config [ _ _tooltip _format _value ] = undefined ;
config [ _ _tooltip _contents ] = function ( d , defaultTitleFormat , defaultValueFormat , color ) {
return this . getTooltipContent ? this . getTooltipContent ( d , defaultValueFormat , defaultValueFormat , color ) : '' ;
} ,
config [ _ _tooltip _init _show ] = false ;
config [ _ _tooltip _init _x ] = 0 ;
config [ _ _tooltip _init _position ] = { top : '0px' , left : '50px' } ;
c3 _chart _internal _fn . getDefaultConfig = function ( ) {
var config = { } ;
config [ _ _bindto ] = '#chart' ;
config [ _ _size _width ] = undefined ;
config [ _ _size _height ] = undefined ;
config [ _ _padding _left ] = undefined ;
config [ _ _padding _right ] = undefined ;
config [ _ _padding _top ] = undefined ;
config [ _ _padding _bottom ] = undefined ;
config [ _ _zoom _enabled ] = false ;
config [ _ _zoom _extent ] = undefined ;
config [ _ _zoom _privileged ] = false ;
config [ _ _zoom _onzoom ] = function ( ) { } ;
config [ _ _interaction _enabled ] = true ;
config [ _ _onmouseover ] = function ( ) { } ;
config [ _ _onmouseout ] = function ( ) { } ;
config [ _ _onresize ] = function ( ) { } ;
config [ _ _onresized ] = function ( ) { } ;
config [ _ _transition _duration ] = 350 ;
config [ _ _data _x ] = undefined ;
config [ _ _data _xs ] = { } ;
config [ _ _data _xFormat ] = '%Y-%m-%d' ;
config [ _ _data _xLocaltime ] = true ;
config [ _ _data _idConverter ] = function ( id ) { return id ; } ;
config [ _ _data _names ] = { } ;
config [ _ _data _classes ] = { } ;
config [ _ _data _groups ] = [ ] ;
config [ _ _data _axes ] = { } ;
config [ _ _data _type ] = undefined ;
config [ _ _data _types ] = { } ;
config [ _ _data _labels ] = { } ;
config [ _ _data _order ] = 'desc' ;
config [ _ _data _regions ] = { } ;
config [ _ _data _color ] = undefined ;
config [ _ _data _colors ] = { } ;
config [ _ _data _hide ] = false ;
config [ _ _data _filter ] = undefined ;
config [ _ _data _selection _enabled ] = false ;
config [ _ _data _selection _grouped ] = false ;
config [ _ _data _selection _isselectable ] = function ( ) { return true ; } ;
config [ _ _data _selection _multiple ] = true ;
config [ _ _data _onclick ] = function ( ) { } ;
config [ _ _data _onmouseover ] = function ( ) { } ;
config [ _ _data _onmouseout ] = function ( ) { } ;
config [ _ _data _onselected ] = function ( ) { } ;
config [ _ _data _onunselected ] = function ( ) { } ;
config [ _ _data _ondragstart ] = function ( ) { } ;
config [ _ _data _ondragend ] = function ( ) { } ;
config [ _ _data _url ] = undefined ;
config [ _ _data _json ] = undefined ;
config [ _ _data _rows ] = undefined ;
config [ _ _data _columns ] = undefined ;
config [ _ _data _mimeType ] = undefined ;
config [ _ _data _keys ] = undefined ;
// configuration for no plot-able data supplied.
config [ _ _data _empty _label _text ] = "" ;
// subchart
config [ _ _subchart _show ] = false ;
config [ _ _subchart _size _height ] = 60 ;
config [ _ _subchart _onbrush ] = function ( ) { } ;
// color
config [ _ _color _pattern ] = [ ] ;
config [ _ _color _threshold ] = { } ;
// legend
config [ _ _legend _show ] = true ;
config [ _ _legend _position ] = 'bottom' ;
config [ _ _legend _inset _anchor ] = 'top-left' ;
config [ _ _legend _inset _x ] = 10 ;
config [ _ _legend _inset _y ] = 0 ;
config [ _ _legend _inset _step ] = undefined ;
config [ _ _legend _item _onclick ] = undefined ;
config [ _ _legend _item _onmouseover ] = undefined ;
config [ _ _legend _item _onmouseout ] = undefined ;
config [ _ _legend _equally ] = false ;
// axis
config [ _ _axis _rotated ] = false ;
config [ _ _axis _x _show ] = true ;
config [ _ _axis _x _type ] = 'indexed' ;
config [ _ _axis _x _localtime ] = true ;
config [ _ _axis _x _categories ] = [ ] ;
config [ _ _axis _x _tick _centered ] = false ;
config [ _ _axis _x _tick _format ] = undefined ;
config [ _ _axis _x _tick _culling ] = { } ;
config [ _ _axis _x _tick _culling _max ] = 10 ;
config [ _ _axis _x _tick _count ] = undefined ;
config [ _ _axis _x _tick _fit ] = true ;
config [ _ _axis _x _tick _values ] = null ;
config [ _ _axis _x _tick _rotate ] = undefined ;
config [ _ _axis _x _tick _outer ] = true ;
config [ _ _axis _x _max ] = null ;
config [ _ _axis _x _min ] = null ;
config [ _ _axis _x _padding ] = { } ;
config [ _ _axis _x _height ] = undefined ;
config [ _ _axis _x _default ] = undefined ;
config [ _ _axis _x _label ] = { } ;
config [ _ _axis _y _show ] = true ;
config [ _ _axis _y _max ] = undefined ;
config [ _ _axis _y _min ] = undefined ;
config [ _ _axis _y _center ] = undefined ;
config [ _ _axis _y _label ] = { } ;
config [ _ _axis _y _tick _format ] = undefined ;
config [ _ _axis _y _tick _outer ] = true ;
config [ _ _axis _y _padding ] = undefined ;
config [ _ _axis _y _ticks ] = 10 ;
config [ _ _axis _y2 _show ] = false ;
config [ _ _axis _y2 _max ] = undefined ;
config [ _ _axis _y2 _min ] = undefined ;
config [ _ _axis _y2 _center ] = undefined ;
config [ _ _axis _y2 _label ] = { } ;
config [ _ _axis _y2 _tick _format ] = undefined ;
config [ _ _axis _y2 _tick _outer ] = true ;
config [ _ _axis _y2 _padding ] = undefined ;
config [ _ _axis _y2 _ticks ] = 10 ;
// grid
config [ _ _grid _x _show ] = false ;
config [ _ _grid _x _type ] = 'tick' ;
config [ _ _grid _x _lines ] = [ ] ;
config [ _ _grid _y _show ] = false ;
// not used
// grid_y_type: {}, 'tick'),
config [ _ _grid _y _lines ] = [ ] ;
config [ _ _grid _y _ticks ] = 10 ;
config [ _ _grid _focus _show ] = true ;
// point - point of each data
config [ _ _point _show ] = true ;
config [ _ _point _r ] = 2.5 ;
config [ _ _point _focus _expand _enabled ] = true ;
config [ _ _point _focus _expand _r ] = undefined ;
config [ _ _point _select _r ] = undefined ;
config [ _ _line _connect _null ] = false ;
// bar
config [ _ _bar _width ] = undefined ;
config [ _ _bar _width _ratio ] = 0.6 ;
config [ _ _bar _width _max ] = undefined ;
config [ _ _bar _zerobased ] = true ;
// area
config [ _ _area _zerobased ] = true ;
// pie
config [ _ _pie _label _show ] = true ;
config [ _ _pie _label _format ] = undefined ;
config [ _ _pie _label _threshold ] = 0.05 ;
config [ _ _pie _sort ] = true ;
config [ _ _pie _expand ] = true ;
// gauge
config [ _ _gauge _label _show ] = true ;
config [ _ _gauge _label _format ] = undefined ;
config [ _ _gauge _expand ] = true ;
config [ _ _gauge _min ] = 0 ;
config [ _ _gauge _max ] = 100 ;
config [ _ _gauge _units ] = undefined ;
config [ _ _gauge _width ] = undefined ;
// donut
config [ _ _donut _label _show ] = true ;
config [ _ _donut _label _format ] = undefined ;
config [ _ _donut _label _threshold ] = 0.05 ;
config [ _ _donut _width ] = undefined ;
config [ _ _donut _sort ] = true ;
config [ _ _donut _expand ] = true ;
config [ _ _donut _title ] = "" ;
// region - region to change style
config [ _ _regions ] = [ ] ;
// tooltip - show when mouseover on each data
config [ _ _tooltip _show ] = true ;
config [ _ _tooltip _grouped ] = true ;
config [ _ _tooltip _format _title ] = undefined ;
config [ _ _tooltip _format _name ] = undefined ;
config [ _ _tooltip _format _value ] = undefined ;
config [ _ _tooltip _contents ] = function ( d , defaultTitleFormat , defaultValueFormat , color ) {
return this . getTooltipContent ? this . getTooltipContent ( d , defaultTitleFormat , defaultValueFormat , color ) : '' ;
} ,
config [ _ _tooltip _init _show ] = false ;
config [ _ _tooltip _init _x ] = 0 ;
config [ _ _tooltip _init _position ] = { top : '0px' , left : '50px' } ;
return config ;
} ;
c3 _chart _internal _fn . loadConfig = function ( config ) {
var this _config = this . config , target , keys , read ;
function find ( ) {
var key = keys . shift ( ) ;
// console.log("key =>", key, ", target =>", target);
if ( key && target && key in target ) {
// console.log("key =>", key, ", target =>", target);
if ( key && target && typeof target === 'object' && key in target ) {
target = target [ key ] ;
return find ( ) ;
}
@ -1893,7 +1909,7 @@
target = config ;
keys = key . split ( '_' ) ;
read = find ( ) ;
// console.log("CONFIG : ", key, read);
// console.log("CONFIG : ", key, read);
if ( isDefined ( read ) ) {
this _config [ key ] = read ;
}
@ -2519,7 +2535,7 @@
} else {
d = $$ . convertCsvToData ( data . response ) ;
}
done ( d ) ;
done . call ( $$ , d ) ;
} ) ;
} ;
c3 _chart _internal _fn . convertCsvToData = function ( csv ) {
@ -2625,6 +2641,7 @@
}
} ) ;
// check x is defined
ids . forEach ( function ( id ) {
if ( ! $$ . data . xs [ id ] ) {
@ -2634,7 +2651,7 @@
// convert to target
targets = ids . map ( function ( id , index ) {
var convertedId = config [ _ _data _id _c onverter] ( id ) ;
var convertedId = config [ _ _data _idC onverter ] ( id ) ;
return {
id : convertedId ,
id _org : id ,
@ -3108,13 +3125,13 @@
getPoints = $$ . generateGetBarPoints ( barIndices , false ) ,
getter = forX ? $$ . getXForText : $$ . getYForText ;
return function ( d , i ) {
return getter ( getPoints ( d , i ) , d , this ) ;
return getter . call ( $$ , getPoints ( d , i ) , d , this ) ;
} ;
} ;
c3 _chart _internal _fn . getXForText = function ( points , d , textElement ) {
var $$ = this ,
box = textElement . getBoundingClientRect ( ) , xPos , padding ;
if ( config [ _ _axis _rotated ] ) {
if ( $$ . config [ _ _axis _rotated ] ) {
padding = $$ . isBarType ( d ) ? 4 : 6 ;
xPos = points [ 2 ] [ 1 ] + padding * ( d . value < 0 ? - 1 : 1 ) ;
} else {
@ -3125,7 +3142,7 @@
c3 _chart _internal _fn . getYForText = function ( points , d , textElement ) {
var $$ = this ,
box = textElement . getBoundingClientRect ( ) , yPos ;
if ( config [ _ _axis _rotated ] ) {
if ( $$ . config [ _ _axis _rotated ] ) {
yPos = ( points [ 0 ] [ 0 ] + points [ 2 ] [ 0 ] + box . height * 0.6 ) / 2 ;
} else {
yPos = points [ 2 ] [ 1 ] + ( d . value < 0 ? box . height : $$ . isBarType ( d ) ? - 3 : - 6 ) ;
@ -3366,7 +3383,8 @@
} ;
c3 _chart _internal _fn . showXGridFocus = function ( selectedData ) {
var $$ = this , dataToShow = selectedData . filter ( function ( d ) { return d && isValue ( d . value ) ; } ) ;
var $$ = this , config = $$ . config ,
dataToShow = selectedData . filter ( function ( d ) { return d && isValue ( d . value ) ; } ) ;
if ( ! config [ _ _tooltip _show ] ) { return ; }
// Hide when scatter plot exists
if ( $$ . hasType ( 'scatter' ) || $$ . hasArcType ( ) ) { return ; }
@ -3537,7 +3555,7 @@
c3 _chart _internal _fn . initLegend = function ( ) {
var $$ = this ;
$$ . legend = $$ . svg . append ( "g" ) . attr ( "transform" , $$ . getTranslate ( 'legend' ) ) ;
if ( ! config [ _ _legend _show ] ) {
if ( ! $$ . config [ _ _legend _show ] ) {
$$ . legend . style ( 'visibility' , 'hidden' ) ;
$$ . hiddenLegendIds = $$ . mapToIds ( $$ . data . targets ) ;
}
@ -3546,7 +3564,7 @@
$$ . updateLegend ( $$ . mapToIds ( $$ . data . targets ) , { withTransform : false , withTransitionForTransform : false , withTransition : false } ) ;
} ;
c3 _chart _internal _fn . updateSizeForLegend = function ( legendHeight , legendWidth ) {
var $$ = this , insetLegendPosition = {
var $$ = this , config = $$ . config , insetLegendPosition = {
top : $$ . isLegendTop ? $$ . getCurrentPaddingTop ( ) + config [ _ _legend _inset _y ] + 5.5 : $$ . currentHeight - legendHeight - $$ . getCurrentPaddingBottom ( ) - config [ _ _legend _inset _y ] ,
left : $$ . isLegendLeft ? $$ . getCurrentPaddingLeft ( ) + config [ _ _legend _inset _x ] + 0.5 : $$ . currentWidth - legendWidth - $$ . getCurrentPaddingRight ( ) - config [ _ _legend _inset _x ] + 0.5
} ;
@ -3733,7 +3751,7 @@
. style ( 'visibility' , function ( id ) { return $$ . isLegendToShow ( id ) ? 'visible' : 'hidden' ; } )
. style ( 'cursor' , 'pointer' )
. on ( 'click' , function ( id ) {
isFunction ( config [ _ _legend _item _onclick ] ) ? config [ _ _legend _item _onclick ] . call ( c3 , id ) : $$ . api . toggle ( id ) ;
isFunction ( config [ _ _legend _item _onclick ] ) ? config [ _ _legend _item _onclick ] . call ( $$ , id ) : $$ . api . toggle ( id ) ;
} )
. on ( 'mouseover' , function ( id ) {
$$ . d3 . select ( this ) . classed ( CLASS [ _legendItemFocused ] , true ) ;
@ -4379,11 +4397,11 @@
} ;
c3 _chart _internal _fn . initArc = function ( ) {
var $$ = this , arcs ;
arcs = $$ . main . select ( '.' + CLASS [ _chart ] ) . append ( "g" )
var $$ = this ;
$$ . arcs = $$ . main . select ( '.' + CLASS [ _chart ] ) . append ( "g" )
. attr ( "class" , CLASS [ _chartArcs ] )
. attr ( "transform" , $$ . getTranslate ( 'arc' ) ) ;
arcs . append ( 'text' )
$$ . arcs . append ( 'text' )
. attr ( 'class' , CLASS [ _chartArcsTitle ] )
. style ( "text-anchor" , "middle" )
. text ( $$ . getArcTitle ( ) ) ;
@ -4491,7 +4509,7 @@
} ;
c3 _chart _internal _fn . initGauge = function ( ) {
var $$ = this , config = $$ . config , arcs ;
var $$ = this , config = $$ . config , arcs = $$ . arcs ;
if ( $$ . hasType ( 'gauge' ) ) {
arcs . append ( 'path' )
. attr ( "class" , CLASS [ _chartArcsBackground ] )
@ -4623,7 +4641,7 @@
shape . classed ( CLASS [ _INCLUDED ] , ! isIncluded ) ;
// TODO: included/unincluded callback here
shape . classed ( CLASS [ _SELECTED ] , ! isSelected ) ;
$$ . toggle ( ! isSelected , shape , d , i ) ;
toggle . call ( $$ , ! isSelected , shape , d , i ) ;
}
} ) ;
} ;
@ -4655,6 +4673,89 @@
} ;
c3 _chart _internal _fn . selectPoint = function ( target , d , i ) {
var $$ = this , config = $$ . config ,
cx = generateCall ( config [ _ _axis _rotated ] ? $$ . circleY : $$ . circleX , $$ ) ,
cy = generateCall ( config [ _ _axis _rotated ] ? $$ . circleX : $$ . circleY , $$ ) ;
config [ _ _data _onselected ] . call ( $$ . api , d , target . node ( ) ) ;
// add selected-circle on low layer g
$$ . main . select ( '.' + CLASS [ _selectedCircles ] + $$ . getTargetSelectorSuffix ( d . id ) ) . selectAll ( '.' + CLASS [ _selectedCircle ] + '-' + i )
. data ( [ d ] )
. enter ( ) . append ( 'circle' )
. attr ( "class" , function ( ) { return $$ . generateClass ( CLASS [ _selectedCircle ] , i ) ; } )
. attr ( "cx" , cx )
. attr ( "cy" , cy )
. attr ( "stroke" , function ( ) { return $$ . color ( d ) ; } )
. attr ( "r" , function ( d ) { return $$ . pointSelectR ( d ) * 1.4 ; } )
. transition ( ) . duration ( 100 )
. attr ( "r" , generateCall ( $$ . pointSelectR , $$ ) ) ;
} ;
c3 _chart _internal _fn . unselectPoint = function ( target , d , i ) {
var $$ = this ;
$$ . config [ _ _data _onunselected ] ( d , target . node ( ) ) ;
// remove selected-circle from low layer g
$$ . main . select ( '.' + CLASS [ _selectedCircles ] + $$ . getTargetSelectorSuffix ( d . id ) ) . selectAll ( '.' + CLASS [ _selectedCircle ] + '-' + i )
. transition ( ) . duration ( 100 ) . attr ( 'r' , 0 )
. remove ( ) ;
} ;
c3 _chart _internal _fn . togglePoint = function ( selected , target , d , i ) {
selected ? this . selectPoint ( target , d , i ) : this . unselectPoint ( target , d , i ) ;
} ;
c3 _chart _internal _fn . selectBar = function ( target , d ) {
var $$ = this ;
$$ . config [ _ _data _onselected ] . call ( $$ , d , target . node ( ) ) ;
target . transition ( ) . duration ( 100 )
. style ( "fill" , function ( ) { return $$ . d3 . rgb ( $$ . color ( d ) ) . brighter ( 0.75 ) ; } ) ;
} ;
c3 _chart _internal _fn . unselectBar = function ( target , d ) {
var $$ = this ;
$$ . config [ _ _data _onunselected ] . call ( $$ , d , target . node ( ) ) ;
target . transition ( ) . duration ( 100 )
. style ( "fill" , function ( ) { return $$ . color ( d ) ; } ) ;
} ;
c3 _chart _internal _fn . toggleBar = function ( selected , target , d , i ) {
selected ? this . selectBar ( target , d , i ) : this . unselectBar ( target , d , i ) ;
} ;
c3 _chart _internal _fn . toggleArc = function ( selected , target , d , i ) {
this . toggleBar ( selected , target , d . data , i ) ;
} ;
c3 _chart _internal _fn . getToggle = function ( that ) {
var $$ = this ;
// path selection not supported yet
return that . nodeName === 'circle' ? $$ . togglePoint : ( $$ . d3 . select ( that ) . classed ( CLASS [ _bar ] ) ? $$ . toggleBar : $$ . toggleArc ) ;
} ;
c3 _chart _internal _fn . toggleShape = function ( that , d , i ) {
var $$ = this , d3 = $$ . d3 , config = $$ . config ,
shape = d3 . select ( that ) , isSelected = shape . classed ( CLASS [ _SELECTED ] ) , isWithin , toggle ;
if ( that . nodeName === 'circle' ) {
isWithin = $$ . isWithinCircle ( that , $$ . pointSelectR ( d ) * 1.5 ) ;
toggle = $$ . togglePoint ;
}
else if ( that . nodeName === 'path' ) {
if ( shape . classed ( CLASS [ _bar ] ) ) {
isWithin = $$ . isWithinBar ( that ) ;
toggle = $$ . toggleBar ;
} else { // would be arc
isWithin = true ;
toggle = $$ . toggleArc ;
}
}
if ( config [ _ _data _selection _grouped ] || isWithin ) {
if ( config [ _ _data _selection _enabled ] && config [ _ _data _selection _isselectable ] ( d ) ) {
if ( ! config [ _ _data _selection _multiple ] ) {
$$ . main . selectAll ( '.' + CLASS [ _shapes ] + ( config [ _ _data _selection _grouped ] ? $$ . getTargetSelectorSuffix ( d . id ) : "" ) ) . selectAll ( '.' + CLASS [ _shape ] ) . each ( function ( d , i ) {
var shape = d3 . select ( this ) ;
if ( shape . classed ( CLASS [ _SELECTED ] ) ) { toggle . call ( $$ , false , shape . classed ( CLASS [ _SELECTED ] , false ) , d , i ) ; }
} ) ;
}
shape . classed ( CLASS [ _SELECTED ] , ! isSelected ) ;
toggle . call ( $$ , ! isSelected , shape , d , i ) ;
}
$$ . config [ _ _data _onclick ] . call ( $$ . api , d , that ) ;
}
} ;
c3 _chart _internal _fn . initBrush = function ( ) {
var $$ = this , d3 = $$ . d3 ;
$$ . brush = d3 . svg . brush ( ) . on ( "brush" , function ( ) { $$ . redrawForBrush ( ) ; } ) ;
@ -4815,7 +4916,7 @@
withSubchart : false ,
withUpdateXDomain : true
} ) ;
$$ . config [ _ _subchart _onbrush ] . call ( $$ , x . orgDomain ( ) ) ;
$$ . config [ _ _subchart _onbrush ] . call ( $$ . api , x . orgDomain ( ) ) ;
} ;
c3 _chart _internal _fn . transformContext = function ( withTransition , transitions ) {
var $$ = this , subXAxis ;
@ -4835,7 +4936,7 @@
. on ( "zoomstart" , function ( ) {
$$ . zoom . altDomain = d3 . event . sourceEvent . altKey ? $$ . x . orgDomain ( ) : null ;
} )
. on ( "zoom" , $$ . redrawForZoom ) ;
. on ( "zoom" , function ( ) { $$ . redrawForZoom . call ( $$ ) ; } ) ;
$$ . zoom . scale = function ( scale ) {
return config [ _ _axis _rotated ] ? this . y ( scale ) : this . x ( scale ) ;
} ;
@ -4845,8 +4946,8 @@
} ;
$$ . zoom . updateScaleExtent = function ( ) {
var ratio = diffDomain ( $$ . x . orgDomain ( ) ) / diffDomain ( $$ . orgXDomain ) ,
extent = $$ . orgScaleExtent ( ) ;
$$ . scaleExtent ( [ extent [ 0 ] * ratio , extent [ 1 ] * ratio ] ) ;
extent = this . orgScaleExtent ( ) ;
this . scaleExtent ( [ extent [ 0 ] * ratio , extent [ 1 ] * ratio ] ) ;
return this ;
} ;
} ;
@ -4879,7 +4980,7 @@
if ( d3 . event . sourceEvent . type === 'mousemove' ) {
$$ . cancelClick = true ;
}
config [ _ _zoom _onzoom ] . call ( c3 , x . orgDomain ( ) ) ;
config [ _ _zoom _onzoom ] . call ( $$ . api , x . orgDomain ( ) ) ;
} ;
c3 _chart _internal _fn . generateColor = function ( ) {
@ -4955,7 +5056,7 @@
return ( ratio * 100 ) . toFixed ( 1 ) + '%' ;
} ;
c3 _chart _internal _fn . formatByAxisId = function ( axisId ) {
var $$ = this . internal , data _labels = $$ . config [ _ _data _labels ] ,
var $$ = this , data _labels = $$ . config [ _ _data _labels ] ,
format = function ( v ) { return isValue ( v ) ? + v : "" ; } ;
// find format according to axis id
if ( isFunction ( data _labels . format ) ) {
@ -5648,7 +5749,7 @@
} ;
c3 _chart _fn . ygrids . add = function ( grids ) {
var $$ = this . internal ;
return c3 . ygrids ( $$ . config [ _ _grid _y _lines ] . concat ( grids ? grids : [ ] ) ) ;
return this . ygrids ( $$ . config [ _ _grid _y _lines ] . concat ( grids ? grids : [ ] ) ) ;
} ;
c3 _chart _fn . ygrids . remove = function ( params ) { // TODO: multiple
var $$ = this . internal ;
@ -5696,8 +5797,7 @@
return config [ _ _regions ] ;
} ;
c3 _chart _fn . data = function ( ) {
} ;
c3 _chart _fn . data = function ( ) { } ;
c3 _chart _fn . data . get = function ( targetId ) {
var target = this . data . getAsTarget ( targetId ) ;
return isDefined ( target ) ? target . values . map ( function ( d ) { return d . value ; } ) : undefined ;
@ -5764,8 +5864,7 @@
} ;
c3 _chart _fn . axis = function ( ) {
} ;
c3 _chart _fn . axis = function ( ) { } ;
c3 _chart _fn . axis . labels = function ( labels ) {
var $$ = this . internal ;
if ( arguments . length ) {
@ -5810,8 +5909,7 @@
} ;
c3 _chart _fn . legend = function ( ) {
} ;
c3 _chart _fn . legend = function ( ) { } ;
c3 _chart _fn . legend . show = function ( targetIds ) {
var $$ = this . internal ;
$$ . showLegend ( $$ . mapToTargetIds ( targetIds ) ) ;
Masayuki Tanaka
10 years ago