D3拖動事件行爲：DragEvent.x和DragEvent.y值來源

Question

我不明白在D3的Mike Bostock例子中的D3 DragEvent對象的行爲。

這些是兩個例子我不理解： Circle Dragging I Drag + Zoom

這是我不理解的代碼：

功能拖動（d）{d3.select（這個）.attr（「cx」，dx = d3.event.x）.attr（「cy」，dy = d3.event.y）; }

在此示例中，d.x和d.y是包含圓的最後一箇中心的數據對象的一部分。

我希望這個代碼的情況發生，是屬性Cx和Cy圈變化d3.event.x和d3.event.y

的當前值在我看來，那應該是用戶開始拖動時鼠標的座標。如果用戶沒有開始精確地在圓的中心拖動，我期望的行爲是圓到用戶開始拖動的位置，然後是正常的拖動行爲。

我的問題是，最初的跳躍不會發生，我不知道爲什麼。

當代碼運行時，我檢查了d3.event.x和d3.event.y的值，它們與d.x和d.y完全相同，不必介意用戶在圓圈中單擊的位置。我不明白爲什麼會這樣。

最後，我改變了對象的名稱（並且只需要在代碼中需要），從d.x和d.y到d.m和d.n，代碼開始執行我期望的操作。

功能拖動（d）{d3.select（本）.attr（ 「CX」，D.M = d3.event.x）.attr（ 「CY」，d.n = d3.event.y）; }

因此，當數據對象具有屬性d.x和d.y以便數據對象具有屬性d.m和d.n. 似乎DragEvent對象正在期待一個具有特定屬性的數據對象，但這聽起來很奇怪，我也找不到它。

我期待避免檢查D3源代碼，如果有人知道答案已經。

Answer 1

我雖然奇怪的行爲是預期的行爲。

所有DragEvent對象都有一個'主題'。主題不是產生拖動事件的SVG形狀，但如果存在，則與該SVG關聯的數據。

更多可用信息：https://github.com/d3/d3-drag#drag_subject

所以，是的，如果數據對象具有屬性x和y的值將被分配給dx和dy的DragEvent對象的屬性。

正如我們在D3源看，在drag.js文件：

dx = s.x - p[0] || 0; 
    dy = s.y - p[1] || 0;