chart.js not allowing y axis steps with logarithmic scale

chart.js, javascript

Solution

I figured it out, here's what I did in case any one else needs it:

var packetsElement = $("#packetsGraph");
    pckBarChart = new Chart(packetsElement, {
        type: 'bar',
        data: {
            labels: ["Received", "Errors", "Lost"],
            datasets: [{
                label: '% of Packets (Logarithmic)',
                data: packetsArr,
                backgroundColor: [
                    'rgba(55,102,245,0.3)',
                    'rgba(55,102,245,0.2)',
                    'rgba(55,102,245,0.1)'
                ],
                borderColor: [
                    '#3766F5',
                    '#3766F5',
                    '#3766F5'],
                borderWidth: 1
            }]
        },
        options: {
            responsive: true,
            maintainAspectRatio: false,
            title: {
                display: true,
                text: 'Packets',
                fontSize: 20
            },
            scales: {
                yAxes: [{
                    type: 'logarithmic',
                    ticks: {
                        min: 0,
                        max: 100,
                        callback: function(value, index, values) {//needed to change the scientific notation results from using logarithmic scale
                            return Number(value.toString());//pass tick values as a string into Number function
                        }
                    },
                    afterBuildTicks: function(pckBarChart) {    
                        pckBarChart.ticks = [];
                        pckBarChart.ticks.push(0);
                        pckBarChart.ticks.push(25);
                        pckBarChart.ticks.push(50);
                        pckBarChart.ticks.push(75);
                        pckBarChart.ticks.push(100);
                      }
                }]
            },
            tooltips: {
                enabled: true,
                mode: 'single',
                callbacks: {
                    label: function(tooltipItems, data) { 
                        return tooltipItems.yLabel + ' %';
                    }
                }
            },
        }
    });

Problem

I had to parse the scientific notation that was a result of implementing logarithmic scale to my graph but it printed out each value for each line in the graph. No method of steps seems to be working. RESULTING CHART IMG ``` var packetsElement = $("#packetsGraph"); pckBarChart = new Chart(packetsElement, { type: 'bar', data: { labels: ["Received", "Errors", "Lost"], datasets: [{ label: '# of Packets', data: packetsArr, backgroundColor: [ 'rgba(55,102,245,0.3)', 'rgba(55,102,245,0.2)', 'rgba(55,102,245,0.1)' ], borderColor: [ '#3766F5', '#3766F5', '#3766F5'], borderWidth: 1 }] }, options: { responsive: true, maintainAspectRatio: false, title: { display: true, text: 'Packets', fontSize: 20 }, scales: { yAxes: [{ type: 'logarithmic', ticks: { min: 1, stepSize: 1000000, steps: 1000000, stepValue: 1000000, callback: function(value, index, values) { return parseFloat(value); } } }] } } }); ```

Original source