使用HighCharts對條形圖的無響應腳本和/或高響應時間

Question

當我嘗試渲染具有大量數據點的條形圖時，我遇到了一個問題。 但這只發生在FireFox中。 一個彈出窗口顯示10秒后無響應的腳本，如果我繼續顯示大約需要20秒。 我已經建立了一個獨立的例子http://jsfiddle.net/tankchintan/UWB8h/5/

在Chrome中雖然大約需要5秒鍾，但它仍然可以毫無問題地呈現。 我想知道是否有解決方法嗎？ 或者我可以做些什么來讓響應時間縮短？ 有大約1000行，恕我直言並不高。

謝謝您的幫助！

Answer 1

您以兩種方式傷害用戶：

• 首先，他們必須等待幾秒鍾才能呈現頁面並且整個瀏覽器凍結，因為JS引擎沒有響應

• 但更重要的是，你正在傷害它們，因為你正在顯示一個有近1000個水平條形的條形圖 ！

第二點實際上更重要。 當然瀏覽器的JavaScript性能各不相同（Chrome已知速度更快，但Firefox不會掛在我的電腦上 - 但我知道你的意思）。 可能有一天，所有瀏覽器都會很樂意在沒有時間內呈現此圖表。

但是，您的用戶會欣賞長度為10個屏幕的圖表嗎？ 想象一下在一個表中有數千行的網頁。 關鍵 - 考慮不同的數據表示：可能在20個樣本之后截斷數據並顯示額外的“ 其他...... ”欄？

順便說一句，我和jqplot有類似的問題 - 我在同一頁面上渲染了10多個簡單的圖表。 就像你的情況一樣，Firefox對於腳本運行時間過長而尖叫。 我通過暫停渲染一個圖表來修復它。 這個頁面就像一個魅力，更具響應性和愉悅性。

Answer 2

我同意顯示這些數據點的難度。 這種情況發生在大多數情況下在其他類型的圖表中，在我的情況下是柱形圖。

這里的不同之處在於，可能有理由顯示大型數據集的趨勢，而Highcharts Zoom功能使這些圖表更加實用。 用戶可以在較大的集合中發現高點和異常，並放大以查看該區域內的各個列。 此外，使用柱形圖，整個演示文稿位於一個頁面上。

也就是說，無響應的腳本問題仍然存在，並且無論這種類型的要求如何，都需要用戶在呈現圖表之前指定數據的子集。