Khi truyền dữ liệu qua d3.js, thư viện chia dữ liệu thành các thành phần nhập/cập nhật/thoát, nhưng tôi thấy rằng chúng ta lãng phí rất nhiều tính toán trong phần cập nhật cho các giá trị không thay đổi bằng cách tính toán lại và thiết lập lại các thuộc tính cho cùng một giá trị đã hiện tại.d3: Tránh các nút không thay đổi?
Có cách nào tốt để chia tiếp bộ "cập nhật" thành các bộ đã thay đổi/không thay đổi không?
Bạn có thể thực hiện một lựa chọn khác về lựa chọn cập nhật của mình. Tức là, hãy gọi lại số .selectAll() bằng công cụ chọn chỉ mang đến cho bạn những thứ cần được cập nhật. Điều này tất nhiên giả định rằng bạn có thể tạo ra một bộ chọn như vậy. Một cách tiếp cận có thể là làm mọi thứ thông qua các lớp CSS và không đặt thuộc tính nào trong chính mã đó. Sau đó, bạn có thể chọn dựa trên lớp CSS.
Ngoài ra, không có gì bạn thực sự có thể làm. Toàn bộ ý tưởng đằng sau D3 là việc trực quan hóa được xác định bởi dữ liệu và nếu dữ liệu không thay đổi, các yếu tố hình ảnh vẫn không thay đổi.
Bạn có thể sử dụng chức năng d3 filter để lọc thêm các giá trị dựa trên bất kỳ giá trị tùy ý nào. Tôi đã sử dụng mẫu này trong quá khứ:
# store the extra value in the DOM to use for filtering later on:
selection.attr('data-someExtraValue', function(d) { return d.someExtraValue; });
# during the 'update' phase, filter out values who's someExtraValue hasn't changed:
filteredSelection = selection.filter(function(d) { return d.someExtraValue != parseInt(d3.select(this).attr('data-someExtraValue')); });
# do updates on the filtered selection rather than the initial selection...