text: 
  function showDetail(target){
      target.unshift('today\'s steps detail')
      var chart = c3.generate({
        bindto: '#zoom',
        data: {
          columns: [target]
        },
  
        axis:{
          x:{
              type:'category',
              categories:['0','','','1','','','2','','','3','','','4','','','5','','','6','','','7','','','8','','','9','','','10','','','11','','','12','','','13','','','14','','','15','','','16','','','17','','','18','','','19','','','20','','','21','','','22','','','23','',''],
              tick: {
                multiline:false,
                culling: {
                    max: 96 // the number of tick texts will be adjusted to less than this value
                }
              }
          }
        },
        zoom: {
          enabled: true
        }
      });
  }
  
  function height_weight_history(){
    var chart = c3.generate({
      bindto: '#height_weight',
      data:{
        x:'x',
        columns:[
          // ['x','2015-01-01','2015-02-01','2015-03-01','2015-04-01','2015-05-01','2015-06-01','2015-07-01','2015-08-01','2015-09-01','2015-10-01','2015-11-01','2015-12-01'],
          ['x','JAN','FEB','MAR','APR','MAY','JUN','JUL','AUG','SEP','OCT','NOV','DEC'],
          ['weight',55,54,56.6,55.3,56,60.8,58.9,57.7,55.7,57.7,62.5,60.1],
          ['height',164,164,164,165,165,165,165,166,166,166,166,166]
        ],
        axes:{
          weight:'y',
          height:'y2'
        }
        
      },
      axis:{
        x:{
          type:'category',
          tick:{
            // format:'%m'
            multiline:false
          }
        },
        y:{
          label:'weight'
        },
        y2:{
          show:true,
          label:'height'
        }
      }
    })
  }
  
  function sleep(){
    var chart = c3.generate({
      bindto: '#sleep',
      data:{
        columns:[
          ['有效睡眠时间',120,111,97,133,177,37,79], 
          ['总睡眠时长',523,522,308,650,494,230,316,],
          ['浅度睡眠时间',403,411,211,517,317,193,237]
          
        ],
        types:{
  
          有效睡眠时间:'bar',
          浅度睡眠时间:'bar',
          总睡眠时长:'area-spline'
        },
        colors: {
          有效睡眠时间:'#994D52',
          浅度睡眠时间:'#D9742B',
          总睡眠时长:'#E6B450'
        },
        axis:{
          y:{
            max:800,
            min:0,
          }
        },
        groups:[['有效睡眠时间','浅度睡眠时间','总睡眠时长']]
      }
  
    });
      setTimeout(function () {
        chart.transform('line', '有效睡眠时间');
    }, 1000);
  
    setTimeout(function () {
        chart.transform('line', '浅度睡眠时间');
    }, 2000);
  
    setTimeout(function () {
        chart.transform('area-spline');
    }, 3000);
  
    setTimeout(function () {
        chart.transform('bar');
    }, 4000);
  }
  
  function heartbeat(){
      var chart = c3.generate({
        bindto: '#heartbeat',
        data: {
          columns:[
            ['heartbeat',61,77,101,89,99,77,110,121,133,151,171,188,167,
            179,167,155,141,123,111,127,119,100,99,77,63,78,74,88,84,
            
            87,91,80,99,100,91,87,
            78,101,111,121,119,145,134,165,155,132,
            
            129,151,164,154,153,142,125,132,111,121,101,136,120,
            111,109,103,118,107,103,120,102,
            
            109,105,107,99,79,
            179,167,155,141,123,111,127,119,100,99,77,63,78,74,88,84,
            
            61,77,101,89,99,77,110,121,133,151,171,188,167,
            78,101,111,121,119,145,134,165,155,132,
            
            87,91,80,99,100,91,87,
            111,109,103,118,107,103,120,102,
            
            129,151,164,154,153,142,125,132,111,121,101,136,120,
            109,105,107,99,79,
            
            61,77,101,89,99,77,110,121,133,151,171,188,167,
            78,101,111,121,119,145,134,165,155,132,
            87,91,80,99,100,91,87,
            78,101,111,121,119,145,134,165,155,132,
            109,105,107,99,79,
            179,167,155,141,123,111,127,119,100,99,77,63,78,74,88,84,
            61,77,101,89,99,77,110,121,133,151,171,188,167,
            179,167,155,141,123,111,127,119,100,99,77,63,78,74,88,84,
            129,151,164,154,153,142,125,132,111,121,101,136,120,
            111,109,103,118,107,103,120,102,
             129,151,164,154,153,142,125,132,111,121,101,136,120,
            109,105,107,99,79,
            87,91,80,99,100,91,87,
            111,109,103,118,107,103,120,102,]
          ]
        },
  
        axis:{
          x:{
              type:'category',
              categories:['0','','','1','','','2','','','3','','','4','','','5','','','6','','','7','','','8','','','9','','','10','','','11','','','12','','','13','','','14','',
              '','15','','','16','','','17','','','18','','','19','','','20','','','21','','','22','','','23','','',
              '24','','','25','','','26','','','27','','','28','','','29','','','30','','','31','','','32','','','33','','','34','','','35','','','36','','','37','','','38','','','39','','','40','','','41','','','42','','','43','','','44','','','45','','','46','','','47','','',
                          '24','','','25','','','26','','','27','','','28','','','29','','','30','','','31','','','32','','','33','','','34','','','35','','','36','','','37','','','38','','','39','','','40','','','41','','','42','','','43','','','44','','','45','','','46','','','47','','',
                                      '24','','','25','','','26','','','27','','','28','','','29','','','30','','','31','','','32','','','33','','','34','','','35','','','36','','','37','','','38','','','39','','','40','','','41','','','42','','','43','','','44','','','45','','','46','','','47','',''],
  
              tick: {
                multiline:false,
                culling: {
                    max: 96 // the number of tick texts will be adjusted to less than this value
                }
              }
          }
        },
        zoom: {
          enabled: true
        }
      });
  }
  
  