我试图获得相同的行为WilLinssen'simplementation但在d3.js版本4上。我对版本4中的zoomapi很困惑。我在原始实现中所做的更改是:zoom.translate()替换为d3.zoomTransform(selection.node())并添加了适当的点:svg.attr("transform","translate("+t.x+","+t.y+")"+"scale("+t.k+")");这个:zoom.scale(iScale(t)).translate(iTranslate(t));替换为varfoo=iTranslate(t);zoom.transla
我正在创建一个类似于MikeBostock's的图表可缩放面积图。对于我的特定项目,我有一组传感器,每30秒记录一次值(温度、光线、湿度和声音)。我有缩放实现工作,但是当我缩小到一年的比例时,图表的密度会减慢浏览器的速度并且图形也不会读取。如何编辑脚本,使折线图的密度相对于缩放量发生变化?换句话说,x域控制着值(value)线上的点数。当我放大到一个小时的时间范围时,我想要全密度(每30秒记录一次),而当我缩小时,我想要低得多的密度(每天记录一次)。有任何想法吗?使用上面链接中的脚本实现会很有帮助。谢谢!svg{font-size:10px;}.axis{shape-rendering
我使用SVG使用d3创建了zooming/panning图形。我正在尝试使用Canvas创建完全相同的图表。我的问题是,当涉及到Canvas图形的缩放和平移时,图形正在消失,我不知道为什么。我创建了两个JSBin来显示两者的代码。有人可以帮助我吗。SVG-JSBinCanvas-JSBin我的SVG缩放代码如下所示://ZoomComponentszoom=d3.zoom().scaleExtent([1,dayDiff*12]).translateExtent([[0,0],[width,height]]).extent([[0,0],[width,height]]).on("zoo
我有一张带有openlayers3和矢量图层的map。我想将map调整为该矢量图层的大小,但到目前为止,我所能得到的只是将map居中放置在该矢量的最后一个点上,因为在创建map时无法访问矢量图层的点:if(trackMap!=null){for(vari=0;i 最佳答案 为什么不只适合ol.source.Vector的范围?varsource=newol.source.Vector();...map.getView().fitExtent(source.getExtent(),map.getSize());
我目前正在使用D3.js。这是为我的svg标签注册缩放监听器的代码varzoomListener=d3.behavior.zoom().scaleExtent([0.1,3]).on("zoom",zoom);functionzoom(){vis.attr("transform","translate("+d3.event.translate+")scale("+d3.event.scale+")");}svg.call(zoomListener)现在,当我在svg元素上滚动鼠标时,它会被缩放。但是当我像这样解除绑定(bind)缩放事件时zoomListener.on("zoom",n
我们可以通过按住ctrl来放大和缩小滚动。但我想使用jQuery或JavaScript来做到这一点。有可能吗? 最佳答案 因为你也在jquery中做了标记(尽管在问题标题中只写了js)我会添加这个答案您可以将以下css添加到网页以缩放浏览器窗口body{-moz-transform:scale(0.8,0.8);zoom:0.8;zoom:80%;}所以你的jquery变成了$(document).ready(function(){$('body').css('zoom','80%');/*Webkitbrowsers*/$('bo
我根本无法在文档或任何地方找到有关如何使用jQueryMobile在触摸设备上检测简单的缩放手势的任何内容?我也会考虑使用另一个库或任何东西。我只想检测用户是否试图缩放网站上的内容。所以我不需要处理网站元素上的捏合手势,而是网站本身。我只想听听我网站上的捏合手势。知道怎么做吗?谢谢 最佳答案 vendor的支持各不相同,而iOS是唯一可以可靠地使用多点触控Javascript事件的平台。http://developer.apple.com/library/ios/#DOCUMENTATION/AppleApplications/Re
我们正在开展一个考古测绘项目,我们在该项目中对数百张手绘map进行了地理配准。这些都可以在非常高的缩放级别下查看,这在Googlemap中转换为缩放级别22、23和24。但是,默认情况下,google-maps类型Map只能达到zoom级别21。我尝试了几种方法来强制将最大缩放级别提高到24,但这里建议的几种方法已被证明是笨拙且不一致的(例如,强制用户切换到卫星然后返回map以获取它可以工作)。有人知道如何有效地执行24的maxZoom吗? 最佳答案 GoogleMapsAPI有一个名为numZoomLevels的属性。您需要使用适
我有一个可视化效果,它本质上是一系列堆叠条形图,每个条形图都包含几个面板。例如,here是三个这样的条形图,每个都有四个面板。我已经设法实现了跨图表协调的平移/缩放功能。This例如,如果我从最后一张图像放大到第三个面板,它会是什么样子。从放置在每个图表上的不可见矩形调用缩放行为。我的问题是我想根据用户光标在绘图中的位置启用工具提示功能。然而,由于缩放矩形位于图表的顶部,因此实际图表本身中的任何SVG元素都没有注册任何鼠标事件。有人知道解决这个问题的方法吗? 最佳答案 我正在关注MikeBostock'sexample,就像你在我的
我已经成功地将D3(矢量)map分层放置在从Mapbox中提取图block的d3-tile(光栅)map之上。手动缩放效果完美,矢量和光栅同步。我现在正在尝试实现MikeBostock'zoom-to-bounding-box'功能,应用程序可在用户单击时放大所需的国家/地区。我想我快到了,但现在似乎不匹配,可以这么说,map缩小到外太空。我在这个jsfiddle中重现了这个问题.我需要在“缩放”功能中进行哪些修改才能使map按预期正确缩放?我认为这就是问题所在:vector.selectAll("path").attr("transform","translate("+[transf