chart.js - Multiple line types in ChartJS

Question

I have a project to recreate a Parametric EQ and am using Angular and Chartjs (angular-chart) to do so. Most of it's working, but, I have a need for two different line types in the same graph. Most of the filter types have lines connecting the points, but one of the filter types (band stop) should show a gap at the frequency. I can plot the X/Y of the points, but how do I get the span gaps to only apply to the one data set (and not the other 9)?

Thank you for your help!

    //I think the relevant data:
$scope.data = [
            [{x:-100,y:-90},{x:-60,y:-10},{x:-50,y:0}],
            [{x:-100,y:-80},{x:-50,y:-20},{x:0,y:0}],
            [{x:-100,y:-70},{x:-40,y:-30},{x:0,y:0}],
            [{x:-100,y:-60},{x:-30,y:-40},{x:0,y:0}],
            [{x:-100,y:-50},{x:-20,y:-50},{x:0,y:0}],
            [{x:-100,y:-40},{x:-30,y:-60},{x:0,y:0}],
            [{x:-100,y:-30},{x:-40,y:-70},{x:0,y:0}],
            [{x:-100,y:-20},{x:-50,y:-80},{x:0,y:0}],
            [{x:-100,y:-10},{x:-60,y:-90},{x:0,y:0}],
            [{x:-100,y:0},{x:-70,y:-100},{x:0,y:0}]


        ];
        $scope.options = {
            tooltips:{enabled:false},
            elements:{
                point:{
                    radius:0
                },
                line:{
                    tension:.25,
                    fill:false
                }
            },
            scales: {
                xAxes:[{
                    type:'logarithmic',
                    display:true,
                    ticks:{
                        min:10,
                        max:10000,
                        callback: function(...args) {
                            const value = Chart.Ticks.formatters.logarithmic.call(this, ...args);
                            if (value.length) {
                                return Number(value).toLocaleString()
                            }
                            return value;
                        }
                    },

                }],
                yAxes: [
                    {
                        id: 'y-axis-1',
                        ticks:{min:-20,max:20,stepSize:10},
                        type: 'linear',
                        display: true,
                        position: 'left'
                    }
                ]

            }
        };

question from:https://stackoverflow.com/questions/65621755/multiple-line-types-in-chartjs

Answer 1

Seems like you can add it in the specific dataset as an option in which you want it: https://www.chartjs.org/docs/latest/charts/line.html?h=spangaps