Динамическое построение графика с Axios+JavaScript+Laravel [требует правки]

Здравствуйте, уважаемые форумчане. Пробую построить динамически обновляемый график, событием для обновления которого должно стать изменения значения фильтра в выпадающем списке на странице. Для передачи данных на сервер использую axios, для обработки ответа - чистый JavaScript, для построения графика - библиотеку Chart.js. Серверная часть на LaravelPHP

Фронт HTML

Основной смысл здесь сводится к тому, чтобы в canvas с id doghnut отрисовалась круговая диаграмма. Триггерами для изменения диаграммы являются данные выпадающего списка. Варианты для выбора подтягиваются запросом в случае успешной авторизации пользователя:

    <select name="filter" required="">
   <option value="">Выберите</option>
   @foreach($shops as $shop)
   <option value="{{$shop->shop}}">{{$shop->shop}}</option>
   @endforeach
</select>
<canvas id="doghnut" width="auto" height="auto"></canvas>

Фронт - Axios+JS+Chart.js

var token = document.querySelector('meta[name="csrf-token"]').getAttribute('content'),
    trigger = document.querySelector('select[name="filter"]'),
    randomcolor,
    colors = new Array(),
    values = new Array(),
    names = new Array(),
    doghnut;
trigger.onchange = function() {
    var shop = trigger.value;
    var CancelToken = axios.CancelToken;
    var source = CancelToken.source();
    if (!shop) return !1;
    else axios.post('/data', {
        _token: token,
        shop: shop
    }).then(function(data) {
        if (!data) {
            document.getElementById('doghnut').innerHTML = '<p>Данных пока нет</p>';
        } else {
            for (i = 0; i < data.length; i++) {
                randomcolor = "#" + ((1 << 24) * Math.random() | 0).toString(16);
                values[i] = data[i].good_quant;
                names[i] = data[i].category;
                colors[i] = randomcolor;
            }
            doghnut = new Chart(document.getElementById('doghnut'), {
                type: "doghnut",
                data: {
                    labels: names,
                    datasets: [{
                        label: 'Структура ассортимента магазина "' + shop + '"',
                        data: values,
                        backgroundColor: colors
                    }]
                },
                options: {
                    title: {
                        display: !0,
                        text: "Структура ассортимента магазина " + shop,
                        fontFamily: "Roboto",
                        fontSize: 28,
                        fontColor: "black"
                    },
                    legend: {
                        position: top
                    }
                }
            })
        }
    })
    cancelToken: source.token;
    source.cancel();
}

Метод формирования данных для графика на сервере

   public function data (request $input){
$this->validate($input, [
                        'shop' => 'required|exists:shops,shop'
                        ]);
$shop = trim(strip_tags($input['shop']));
if (Auth::check()){
                 $data = Categories_report::select('category', 'good_quant')
                 ->whereShop($shop)
                 ->get()
                 ->toJSON();
if ($data == TRUE) return $data;
else return !1; 
}       
}

Столкнулся с тем, что хоть данные и приходят в виде JSON, диаграмма не строится, не могу понять в чем причина. Если кто-то сталкивался с подобной проблемой, подскажите, пожалуйста, заранее спасибо.