как обновить данные / серию старших графиков, которые динамически создаются на виджете с помощью knockoutJs

Question

Я использую knockoutJs с высокими диаграммами. Я создаю динамические виджеты для knockoutJs и виджетов внутри круговой диаграммы (HighCharts). Я использую ko.custombindinghandlers для отображения верхних графиков. После загрузки страницы, фильтрации круговой диаграммы, затем обновления серии, но изменения диаграммы исчезли.

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
ko.bindingHandlers.orderPieChart = {
                init: function (element, valueAccessor, allBindings) {
                    elementm = element;
                    valuAccess = valueAccessor;
                    bind = allBindings;

                    orderChart = Highcharts.chart('orderChart', {
                        chart: {
                            plotBackgroundColor: null,
                            plotBorderWidth: null,
                            plotShadow: false,
                            type: 'pie'
                        },
                        title: {
                            text: ''
                        },
                        tooltip: {
                            headerFormat: '',
                            pointFormat: '<span style="color:{point.color}">\u25CF</span> <b> {point.name}</b><br/>' +
                                    'Sipariş Miktarı: <b>{point.y}</b><br/>'
                        },
                        plotOptions: {
                            pie: {
                                allowPointSelect: true,
                                cursor: 'pointer',
                                dataLabels: {
                                    enabled: false
                                }
                            }
                        },
                        series: [{
                                name: 'OpType',
                                data:#{dashboardBean.jsonOrderTypeModel}
                            }]
                    });

                    ko.bindingHandlers.value.init(element, valueAccessor, allBindings);
                },
                update: function (element, valueAccessor) {
                    console.log("update");
                    ko.bindingHandlers.value.update(element, valueAccessor);
                }
            };



/*button click */
function updateOrderData(data) {
                if (orderChart !== undefined) {
                    orderData = data;
                    orderChart.series[0].update({data: orderData}, true);
                    ko.bindingHandlers.orderPieChart.update(elementm, valuAccess);
                }
            }

  <template id="gridstack-template">

<div class="grid-stack" data-bind="foreach: {data: widgets, afterRender: afterAddWidget}">
  <div  class="grid-stack-item"   data-bind="attr: {'data-gs-id':$data.widgetId,'data-gs-x': $data.x, 'data-gs-y': $data.y, 'data-gs-width': $data.width, 'data-gs-height': $data.height, 'data-gs-auto-position': $data.auto_position}">
                    <div class="grid-stack-item-content wigetTitleBar" id="widget0"  data-bind="style: { display: $data.widgetId === 'widget0' ? 'block' : 'none'}">


  <div id="orderChart" style="height:220px;" data-bind="orderPieChart"></div>

</div>
</div>

</div>
</template>