Выбор флот не регистрируется - PullRequest
Новая
       32

Выбор флот не регистрируется

0 голосов
/ 28 мая 2020

У меня есть две разные веб-страницы, на каждой из которых есть две диаграммы. На одной странице есть диаграммы высокого разрешения, а на другой - диаграммы низкого разрешения. Мне удалось реализовать возможности выбора и масштабирования с помощью библиотеки flot на диаграммах с низким разрешением, но когда я попытался реализовать те же шаги в диаграммах с высоким разрешением, это не сработало. Я не получаю никаких ошибок, но ничего не происходит, и кажется, что интерактивные части не регистрируются по неизвестной причине.

HTML: 

<div id="content">
    <div class="contain1">
        <h3 class="header1"></h3>
        <div id="chartElem1" class="placeholder" style="float:left; width:75vw; height:340px; margin-left:2vw; margin-top:-5vh"></div>
        <div id="overview1" class="placeholder" style="float:right;width:16vw; height:125px;"></div>
    </div>
    <div class="contain2">
        <h3 class="header2"></h3>
        <div id="chartElem2" class="placeholder" style="float:left; width:75vw; height:340px; margin-left:2vw; margin-top:-5vh"></div>
        <div id="overview2" class="placeholder" style="float:right;width:16vw; height:125px;"></div>
    </div>
</div>

Javascript: 

$("#chartElem1").bind("plotselected", function (event, ranges) {
    done = true;

    $.plot("#chartElem1", plotDataList2,
        $.extend(true, {}, splPlotOptions, {
            xaxis: { min: ranges.xaxis.from, max: ranges.xaxis.to },
            yaxis: { min: ranges.yaxis.from, max: ranges.yaxis.to }
        })
    );
    overview1.setSelection(ranges, true);
});
$("#overview1").bind("plotselected", function (event, ranges) {
    done = true;
    plotData2.setSelection(ranges);
});
$("#chartElem2").bind("plotselected", function (event, ranges) {
    done = true;
    $.plot("#chartElem2", plotDataList1,
        $.extend(true, {}, splPlotOptions, {
            xaxis: { min: ranges.xaxis.from, max: ranges.xaxis.to },
            yaxis: { min: ranges.yaxis.from, max: ranges.yaxis.to }
        })
    );
    overview2.setSelection(ranges, true);
});
$("#overview2").bind("plotselected", function (event, ranges) {
    done = true;
    plotData1.setSelection(ranges);
});

Пример, которому я пытаюсь следовать https://www.flotcharts.org/flot/examples/zooming/index.html

Мои диаграммы выглядят точно так же, как этот пример, за исключением того, что у меня две на одной странице. Я действительно не знаю, какая информация может потребоваться для решения этой проблемы, потому что я не знаю, в чем проблема. Ошибок нет, выбор просто не работает. Ничего не происходит. Любая помощь или предложения будут приняты с благодарностью.

...