$ .function ist keine Funktion - jQuery

Question

Ich realisiere, dass dies doppelt sein kann, der Grund, warum ich immer noch frage ist, dass ein Kollege ein Liniendiagramm von chartJS hat. Ich kopierte seinen Code, passte ihn in ein Balkendiagramm und änderte den Ajax-Call leicht. Der Code ist praktisch derselbe, und ich habe zahlreiche Überprüfungen für die korrekte Syntax durchgeführt. Ich benutze das leicht veränderte js-Skript, um die jQuery-Funktion aufzurufen, aber das funktionierte noch, bevor ich mein Balkendiagramm erstellte.

Das Skript auf der Webseite ist:

var url = '/stats/test-stats'; 

$('input[name="demographics"]').on('change', function() { 
    console.log('changed demo to ' + this.value); 
    if (this.value == '/stats/conversion-stats') { 
     url = this.value; 
     // console.log(url); 
    } 
}); 

$('input[name="daterange"]').daterangepicker({ 
    opens: 'left', 
    ranges: { 
    'Today': [moment(), moment()], 
    'Yesterday': [moment().subtract(1, 'days'), moment()], 
    'Last 7 Days': [moment().subtract(6, 'days'), moment()], 
    'Last 30 Days': [moment().subtract(29, 'days'), moment()], 
    'This Month': [moment().startOf('month'), moment().endOf('month')], 
    'Last Month': [moment().subtract(1, 'month').startOf('month'),moment().subtract(1, 'month').endOf('month')] 
} 
}); 

$('input[name="daterange"]').on('apply.daterangepicker', function(ev, picker) { 
$.getBarData(url,'Average Dwell Time',picker.startDate.format('YYYY-MM-DD'),picker.endDate.format('YYYY-MM-DD')); 
}); 

$(document).ready(function() { 
$.getBarData(url,'Average Dwell Time'); 
}); 

Ich habe über das Hinzufügen von (jQuery) auf verschiedene Bereiche oder ($) gesehen, aber mein Kollege dies und seine Werke nicht tun ...

Hier ist meine Funktion ist das keine Funktion ist ...

jQuery.getBarData = function(url='/stats/dwell-time-stats',label='',startDate='',endDate='') { 
    console.log('called'); 

    function removeData(chart) { 
     chart.data.labels.pop(); 
     chart.data.datasets.forEach((dataset) => { 
      dataset.data.pop(); 
     }); 
     chart.update(); 
    } 
    $.ajax({ 
     url: url, 
     method: 'GET', 
     dataType: 'json', 
     data: { 
      startDate: startDate, 
      endDate: endDate 
     }, 
     success: function (d) { 

      window.barChart.data.labels = []; 

      window.barChart.data.datasets.forEach((dataset) => { 
       dataset.data = []; 
      }); 


      $.each(d.labels,function(k,v){ 
       window.barChart.data.labels.push(v); 
      }); 

      $.each(d.recordsOne,function(k,v){ 
       window.barChart.data.datasetOne => { 
        //datasetOne.label = l[0]; 
        data.push(v); 
       } 
      }); 

      $.each(d.recordsTwo,function(k,v){ 
       window.barChart.data.datasetTwo => { 
        //datasetTwo.label = l[1]; 
        data.push(v); 
       } 
      }); 

      window.barChart.update(); 

     } 
    }); 
}; 

Da dies aus chartJS wird die CTX, Diagrammoptionen und Daten werden über diese Funktion definiert, das ganze Skript beginnt mit: $ (function() {'use strict';/code hier /});

Ich würde meinen Kollegen fragen, aber sie werden für eine Weile nicht verfügbar sein. Jede Hilfe wird sehr geschätzt.

Fehlermeldung:

jquery.min.js:2 Uncaught TypeError: $.getBarData is not a function 
    at HTMLDocument.<anonymous> (test_stat:206) 
    at j (jquery.min.js:2) 
    at k (jquery.min.js:2) 
(anonymous) @ test_stat:206 
j @ jquery.min.js:2 
k @ jquery.min.js:2 

Answer 1

Dies wurde von meinem Mangel an Verständnis für chart.js verursacht

Ich war eine notwendige Funktion convertHex fehlt(), dass ich von meinem Kollegen erstellt angenommen und dann einfach nicht benutzt.

Grundsätzlich führten Syntaxfehler und fehlende Funktionen zu verwirrenden Fehleraussagen.

Funktion:

function convertHex(hex,opacity){ 
    hex = hex.replace('#',''); 
    var r = parseInt(hex.substring(0,2), 16); 
    var g = parseInt(hex.substring(2,4), 16); 
    var b = parseInt(hex.substring(4,6), 16); 

    var result = 'rgba('+r+','+g+','+b+','+opacity/100+')'; 
    return result; 
}