Chart.js以定义的值启动Y轴

时间:2016-03-16 11:36:22

标签: javascript php chart.js

我在网站上使用的插件使用Chart.js 我尝试以定义的值启动Y轴。

这是我现在拥有的照片: 折线图 enter image description here

javascript代码:

(function() {
Chart.types.Line.extend({
    name:'UncontinuousLine',
    defaults:{scaleBeginAtZero:false},
    initialize:function(data) {
        Chart.types.Line.prototype.initialize.apply(this,arguments);
    },
    draw:function() {
        Chart.types.Line.prototype.draw.apply(this,arguments);
        var ctx=this.chart.ctx;
        this.datasets.forEach(function(ds) {
            ctx.strokeStyle=ds.strokeColor;
            var prevPt={value:2.49};
            ds.points.forEach(function(curPt) {
                if(parseInt(curPt.value)<=0) {
                    curPt.value=prevPt.value;
                } 
                if(parseInt(curPt.value)>0&&parseInt(prevPt.value)>0) {
                    ctx.beginPath();
                    ctx.moveTo(prevPt.x,prevPt.y);
                    ctx.lineTo(curPt.x,curPt.y);
                    ctx.stroke();
                } 
                prevPt=curPt;
            });
        });

    }
});})(); 

和php代码:

private function _create_uncontinuousline_chart( $data, $opt ){ 
    if ( empty( $data ) ){ 
        return '';
    } 
    $id = self::_get_canvas_id( $this->count );
    $sets = self::_parse_data( $data, 3 );
    $cd = self::_resort_sets( $sets, true );
    $this->js[] = 'new Chart(' . "jQuery('#$id').get(0).getContext('2d')" . ')
                    .UncontinuousLine(' . AimyChartsContentPluginHelper::phpva_json_encode( $cd ) . ',' 
                    . '{' . 'animation: ' . ( $opt[ 'animate' ] ? 'true' : 'false' ) . ',' 
                    . 'multiTooltipTemplate: ' . '"<%= value %> (<%= datasetLabel %>)"' 
                    . ',responsive: ' . ( $opt[ 'responsive' ] ? 'true' : 'false' ) 
                    . ',datasetStrokeWidth:0.01' . '}' . ');';
    return self::_get_canvas( 'UncontinuousLine', $this->count, $opt );
}

我尝试了很多东西,但是不可能以1为例开始我的y轴... 有人知道我该怎么做吗?

1 个答案:

答案 0 :(得分:0)

在您的选项中,使用此:

 scaleBeginAtZero : false,
 scaleOverride: true,
 scaleStartValue: 1,

试试这个PHP代码:

private function _create_uncontinuousline_chart( $data, $opt ){ 
    if ( empty( $data ) ){ 
        return '';
    } 
    $id = self::_get_canvas_id( $this->count );
    $sets = self::_parse_data( $data, 3 );
    $cd = self::_resort_sets( $sets, true );
    $this->js[] = 'new Chart(' . "jQuery('#$id').get(0).getContext('2d')" . ')
                    .UncontinuousLine(' . AimyChartsContentPluginHelper::phpva_json_encode( $cd ) . ',' 
                    . '{' . 'animation: ' . ( $opt[ 'animate' ] ? 'true' : 'false' )  
                    . ',multiTooltipTemplate: ' . '"<%= value %> (<%= datasetLabel %>)"' 
                    . ',responsive: ' . ( $opt[ 'responsive' ] ? 'true' : 'false' ) 
                    . ',datasetStrokeWidth:0.01' 
                    . ',scaleBeginAtZero : false'
                    . ',scaleOverride: true'
                    . ',scaleStartValue: 1'
                    . '}' . ');';
    return self::_get_canvas( 'UncontinuousLine', $this->count, $opt );