2

jQueryjqPlotのcanvasOverlayプロパティを動的に更新したい。これにより、jqPlotでタイムラインの効果が得られます。この効果は、このjFiddleに示されているものと同様である必要があります。canvasOverlayただし、ポイントを描画する代わりに、プロパティを毎秒更新したいと思います。

                canvasOverlay: {
                    show: true,
                    objects: [
                        { rectangle: { xmax: new Date(), xminOffset: "0px", xmaxOffset: "0px", yminOffset: "0px", ymaxOffset: "0px",
                                            color: "rgba(0, 0, 0, 0.1)", showTooltip: true } },
                    ]
                }

これどうやってするの？使用すべき機能は何ですか？

アップデート：

私の考えは次のようなことをすることです：

                    canvasOverlay: {
                        name: 'current',
                        show: true,
                        objects: [
                            { rectangle: { xmax: new Date(), xminOffset: "0px", xmaxOffset: "0px", yminOffset: "0px", ymaxOffset: "0px",
                                                color: "rgba(0, 0, 0, 0.1)", showTooltip: true } },
                        ]
                    } 

/...

var co = plot.plugins.canvasOverlay;
var current = co.get('current');

current.options.objects.rectangle.xmax = new Date();
co.draw(plot);
4

2 に答える 2

1

私は答えを見つけました。誰かに役立つことを願っています：

canvasOverlay: {
                        show: true,
                        objects: [
                            { 
                                rectangle: { 
                                    name: 'current',
                                    xmax: new Date(), 
                                    xminOffset: "0px", 
                                    xmaxOffset: "0px", 
                                    yminOffset: "0px", 
                                    ymaxOffset: "0px",
                                    color: "rgba(0, 0, 0, 0.1)", 
                                    showTooltip: true 
                                } 
                            },
                 ]
             } 

                $('#buttonNext').bind("click", function() {
                    counter++;
                    UpdateTimeline(plot1);
                });

                $(document).ready(function() {
                    $('#buttonNext').click();
                });

                window.setInterval(function(){
                    $('#buttonNext').click();
                }, 1000);

function UpdateTimeline(plot1) {
                    var co = plot1.plugins.canvasOverlay;
                    co.get("current").options.xmax = new Date();
                    co.draw(plot1);
                    plot1.replot();                 
                }
于 2012-09-09T10:17:32.040 に答える
0

同様の問題がありましたが、既存のオーバーレイを変更するだけでなく、追加のオーバーレイを動的に追加できるようにする必要もありました。

次の方法を使用して、新しい/変更されたオーバーレイ オブジェクトの配列でチャートを再描画しました。

var chart = $.jqplot(...);
var overlayObjects = getOtherOverlayObjects();
chart.plugins.canvasOverlay = new $.jqplot.CanvasOverlay({
    show: true,
    objects: overlayObjects
});
chart.replot();

$.jqplot.CanvasOverlay() 関数に渡されるパラメーターは、最初に $.jqplot() に渡される canvasOverlay-options と同じ構造を持っています。

于 2016-11-21T16:43:35.620 に答える