d3設置與ZoomIdentity不同的默認縮放配置

Question

就像這里解釋的那樣：在這里輸入鏈接描述我已經將縮放行為添加到了圖表中。

D3將ZoomTransform啟動為K = 1，X = 0，Y = 0。

是否可以覆蓋那些K，X，Y？ 例如，說圖表的當前狀態（及其軸和比例）不是K = 1，x = 0，y = 0，而是類似k = 0.012，x = 12，y = -18？

Answer 1

您可以如下設置SVG元素的transform屬性：

svg.attr('transform', 'translate(12, -18) scale(0.012)');

這可以是在可視化的初始化上，也可以是在事件處理程序中，例如單擊重置按鈕。

重要的是要注意，這就是在示例中應用縮放效果的方式。 d3.event.transform.toString()的結果將類似於：

translate(100, 100) scale(2)

d3.zoomIdentity.toString()的結果是：

translate(0, 0) scale(1)

換句話說，您將獲得SVG元素的transform屬性的格式正確的參數，該參數在使用時可以使用：

mySvgElement.attr('transform', d3.event.transform);

縮放或平移元素。