Javascript d3.event.scale缩放处理过大

我已经从d3.js演示页面实现了。我想在图形上启用缩放和拖动。到目前为止，我能得到的最好的结果是缩放和翻译作品，但d3.event.scale的比例太大了。只是一些示例输出：

Base: translate: 0,0, scale: 1.0000000000000002    
1 zoom in: translate: -276691.7368930365,-243364.72096474364, scale: 776.0468820533237
2 zoom in: translate: -215002451.4426526,-189105797.62743115, scale: 602248.7631446852
3 zoom in: translate: -166852258767.62857,-146755207991.69574, scale: 467373274.8589036
4 zoom in: translate: -129485175456864.23,-113888921830407.19, scale: 362703572709.30316
Back to base: translate: 0,0, scale: 1.0000000000000004
1 zoom out: translate: 356.53997624595127,313.59538526954816, scale: 0.0012885819441141556
2 zoom out: translate: 356.9994072216967,313.999478620764, scale: 0.000001660443426697016
3 zoom out: translate: 356.99999923615655,313.99999932816013, scale: 2.13961741886481e-9
4 zoom out: translate: 356.9999999990157,313.9999999991343, scale: 2.757072373261327e-12

如果你放大，它会变得很大，基本上你的整个屏幕都被填满了。如果你缩小，你什么也看不见。如何将d3.event.scale比率更改为更小？到目前为止，此代码与缩放/翻译有关：

var width = Math.max(document.documentElement.clientWidth,
                window.innerWidth || 0);
var height = Math.max(document.documentElement.clientHeight,
                window.innerHeight || 0);
//Define width & height as big as window

var svg = d3.select("body").attr('width', width).attr('height',
                height).attr("pointer-events", "all").append("svg").append(
                "g").call(d3.behavior.zoom().on("zoom", zoom)).append("g");
//Add svg tag to body

svg.append('rect').attr('width', width).attr('height', height)
                .attr('fill', 'white');

function zoom() {
    svg.attr("transform", "translate(" + d3.event.translate + ")"
        + " scale(" + d3.event.scale + ")");
    java.getData("translate: " + d3.event.translate + ", scale: "
                    + d3.event.scale);
}

在这一点上，我不确定它是否值得一提，但在

标记下，我创建了一个组来存储一个圆圈和一个标签

var gnodes = svg.selectAll('g.gnode').data(graph.nodes).enter()
                    .append('g').classed('gnode', true);
//Create the groups under svg

由于我是JavaScript新手，我可能没有注意到缩放行为出错的地方，如果需要其他代码片段，请告诉我

注：

java.getData（字符串数据）

是一个来自“桥接类”的方法，用于将JavaScript页面与JavaFXWebView和Java代码连接起来

编辑：

现在我有了这个输出：

1 zoom in: translate: -798,-1337, scale: 8
Normal: translate: 0,0, scale: 1

放大现在限制为8度。1鼠标滚轮触发器可缩放到8，内容可读，但仍然太大，无法缩放<1。是否可以定义更好的缩放比例？
尝试此操作：

scaleExtent（[1,2,4,8]）

和

scaleExtent（[5,1,2,4,8]）

第一个缩放1或2，第二个缩放0.5或1。我不能定义两个以上的比率吗？

---

到目前为止，我的工作不是在浏览器中绘制svg，而是在fx中绘制svg，遗憾的是没有调试器。

我有一种预感，如果在您的浏览器上工作正常。。。然后很有可能是其他代码干扰，将比例更改为如此大的值：（我在浏览器（IE）中打开了演示）在JavaFX WebView中运行我的JS，仍然有希望^^^Hmm…可能是WebView的问题…您的代码与fiddle相同，没有任何原因导致此行为。可能是您可以将此问题标记为JavaFX，可能是某位专家可能会给您答案。这似乎是一个web view问题。我看不到fidd中节点之间的链接在我的浏览器上，可能是IE的错误，或者我真的有一些奇怪的代码。@Cyril是对的，这似乎是JavaFX WebView的问题。我有一个预感，如果在你的浏览器上工作正常……那么很可能是其他代码干扰了将比例更改为如此大的值：（我在我的浏览器（IE）中打开了演示）在JavaFX WebView中运行我的JS，仍然有希望^^^Hmm…可能是WebView的问题…您的代码与fiddle相同，没有任何原因导致此行为。可能是您可以将此问题标记为JavaFX，可能是某位专家可能会给您答案。这似乎是一个web view问题。我看不到fidd中节点之间的链接在我的浏览器上，可能是IE的错误，或者我真的有一些奇怪的代码。@Cyril是对的，这似乎是JavaFXWebView的问题。

1 zoom in: translate: -798,-1337, scale: 8
Normal: translate: 0,0, scale: 1