Question

Ployly.js在使用大量数据点时会占用大量内存。

我正在尝试解决使用plotly.js显示图表的网站加载缓慢的问题。我认为我将其范围缩小到正在使用的数据点，这导致它使用大量内存。例如，对于仅使用1500个数据点（日期/整数）的绘图，它占用了500mb的页面下载量。我想知道是否有人看到过此问题或找到了解决方法？到目前为止，我的Google Fu即将发布。

示例树枝模板

            <ul class="list-group">
                <div id="flow_data_cmFlowStatsFMYN2AFlow1{{ counter }}" class="collapse" style="width: 100%; height: 100%"><!-- Plotly chart will be drawn inside this DIV --></div>
            </ul>
            <script>
                var flow = {
                    x: [
                        {% for d in n['flow_data_datetime'] %}
                        '{{ d|date('F j, Y g:i:s:a') }}',
                        {% endfor %}
                    ],
                    y: [
                        {% for d in n['flow_data_cmFlowStatsFMYN2AFlow1'] %}
                        '{{ d }}',
                        {% endfor %}
                    ],
                    name: 'FMY - N2A - {{ n['flow_data_flow_name'] }}',
                    type: 'scatter',
                    hovertemplate: 'FMY - N2A - {{ n['flow_data_flow_name'] }}, %{y} (Frames)',
                };

                var flowDropped = {
                    x: [
                        {% for d in n['flow_data_datetime'] %}
                        '{{ d|date('F j, Y g:i:s:a') }}',
                        {% endfor %}
                    ],
                    y: [
                        {% for d in n['flow_data_cmFlowStatsFMYDN2AFlow1'] %}
                        '{{ d }}',
                        {% endfor %}
                    ],
                    name: 'FMY and Dropped - N2A - {{ n['flow_data_flow_name'] }}',
                    type: 'scatter',
                    hovertemplate: 'FMY and Dropped - N2A - {{ n['flow_data_flow_name'] }}, %{y} (Frames)',
                };


                var data = [
                    flow,flowDropped
                ];
                var layout = {
                    width: 1000,
                    height: 700,
                    margin: {
                        l: 100,
                        r: 50,
                        b: 220,
                        t: 100,
                        pad: 10
                    },
                    title: 'FLOW :: {{ n['flow_data_flow_name'] }}',
                    showlegend: true,
                    legend: {
                        x: 1,
                        y: 1
                    },
                    xaxis: {
                        title: 'Date / Time Pulled',
                        automargin: true,
                        height: 1000,
                        titlefont: {
                            family: 'Courier New, monospace',
                            size: 18,
                            color: '#7f7f7f'
                        }
                    },
                    yaxis: {
                        title: 'Frames Marked Yellow N2A',
                        automargin: true,
                        titlefont: {
                            family: 'Courier New, monospace',
                            size: 18,
                            color: '#7f7f7f'
                        }
                    }
                };

加载速度慢，当查看页面统计信息时，下载大小将达到300-500mb页面大小。

Answer 1

我不确定本文是否会解决内存问题。
但是我相信它会比以前更快。

首先，更改“类型”散布-> scattergl。

有关更多信息，请参见How do I make Plotly faster

使用高内存的plotly.js

1 个答案: