简体   繁体   中英

chart.js / angular-chart line outside style issue

I have a strange issue with angular-chart.js (which use chart.js). If I set and block the min and max values for yAxis, when the line goes out of the limits the style is strange. Do you have an idea about what occurs ?

Here is the configuration for each 3 chart :

    ChartJsProvider.setOptions({
    responsive: true,
    animation: false,
    pointDot: false,
    colours: [{ // blue
        fillColor: 'rgba(0,0,0,0)',
        strokeColor: 'rgba(51,87,205,1)',
        pointColor: 'rgba(51,87,205,1)',
        pointStrokeColor: 'rgba(51,87,205,1)',
        pointHighlightFill: 'rgba(0,0,0,0)',
        bezierCurve: true,
        pointHitDetectionRadius: 20,
        datasetStroke: false,
    }, { // blue
        fillColor: 'rgba(0,0,0,0)',
        strokeColor: '#FB3333',
        pointColor: '#FB3333',
        pointStrokeColor: '#FB3333',
        pointHighlightFill: 'rgba(0,0,0,0)',
    }],
    maintainAspectRatio: false,
    showXLabels: 10,
    showTooltips: true,
    multiTooltipTemplate: function(label) {

        return label.datasetLabel + " : " + label.value.toFixed(1);
    }


});

And for each chart I applied an other configuration :

    $scope.optionsG1 = {
    scaleStartValue: -2,
    scaleStepWidth: 1,
    scaleOverride: true,
    scaleSteps: 4
};

Thanks for your help

对于存在此问题的图表,将bezierCurve: false设置为bezierCurve: false

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM