녹아웃 바인딩과 함께 사용하면 DateAxisRenderer가 렌더링되지 않습니다.

Question

jqplot에 대한 녹아웃 바인딩을 작성 했으므로 기본 렌더러에서 완벽하게 작동합니다. DateAxisRenderer를 x 축 렌더러로 사용하면 어떤 이유로 선이 그려지지 않습니다.

여기에 사용한 코드가 있습니다. 여기에 두 개의 차트가 있습니다. 하나는 의도대로 작동하지 않는 녹아웃 바인딩을 사용하고 다른 하나는 녹아웃 바인딩없이 의도 한대로 작동합니다.

그리고 바이올린 여기에 어떤 도움에 감사드립니다 https://jsfiddle.net/0vauuf13/

입니다.

<script type="text/javascript" src="https://cdn.jsdelivr.net/jqplot/1.0.8/plugins/jqplot.dateAxisRenderer.js"></script> 

<div id="chart3" style="height:300px;width:600px; "></div> 
<div id="chart-container"> 
    <div id="chart4" style="height:300px;width:600px;" data-bind="jqplot:chartData"></div> 
</div> 


$(document).ready(function() { 

    var line1 = [ 
    ['2008-06-30 8:00AM', 4], 
    ['2008-7-14 8:00AM', 6.5], 
    ['2008-7-28 8:00AM', 5.7], 
    ['2008-8-11 8:00AM', 9], 
    ['2008-8-25 8:00AM', 8.2] 
    ]; 

    var plotOptions = { 
    title: 'Customized Date Axis', 
    axes: { 
     xaxis: { 
     renderer: $.jqplot.DateAxisRenderer, 
     tickOptions: { 
      formatString: '%b %#d, %#I %p' 
     }, 
     min: 'June 16, 2008 8:00AM', 
     tickInterval: '2 weeks' 
     } 
    }, 
    series: [{ 
     lineWidth: 4, 
     markerOptions: { 
     style: 'square' 
     } 
    }] 
    }; 
    var plot3 = $('#chart3').jqplot([line1], plotOptions); 

    ko.applyBindings({ 
    chartData: { 
     data: line1, 
     options: plotOptions 
    } 
    }, $("#chart-container")[0]); 
}); 


ko.bindingHandlers.jqplot = { 
    init: function(element, valueAccessor, allBindingsAccessor, context) { 

    }, 
    update: function(element, valueAccessor, allBindingsAccessor, context) { 
    var value = ko.unwrap(valueAccessor()) || {}; 
    var data = value.data || []; 
    var options = value.options || {}; 
    if (data.length > 0) { 
     if ($(element).data('jqplot')) { 
     var plotObject = $(element).data('jqplot'); 
     //plot.replot(data, options); 
     plotObject.destroy(); 
     } 
     $(element).jqplot(data, options); 
    } 
    } 
}; 

Answer 1

저에게 전화 해주세요. 방금 데이터 포인트에서 대괄호가 빠졌습니다. 아래 라인은 데이터 포인트를 [] 대괄호로 묶습니다.

[]으로 line1 데이터를 포장하여 ko 바인딩에 전달해야합니다.

var plot3 = $('#chart3').jqplot([line1], plotOptions);