jjzjj

Transform

全部标签

javascript - D3 : zoom to bounding box with d3-tiles

我已经成功地将D3(矢量)map分层放置在从Mapbox中提取图block的d3-tile(光栅)map之上。手动缩放效果完美,矢量和光栅同步。我现在正在尝试实现MikeBostock'zoom-to-bounding-box'功能,应用程序可在用户单击时放大所需的国家/地区。我想我快到了,但现在似乎不匹配,可以这么说,map缩小到外太空。我在这个jsfiddle中重现了这个问题.我需要在“缩放”功能中进行哪些修改才能使map按预期正确缩放?我认为这就是问题所在:vector.selectAll("path").attr("transform","translate("+[transf

javascript - 使用 CSS 转换/动画/等时,如果用户浏览器不执行 css 动画,回退到 jquery 的最佳方法是什么?

我正在寻找一种使用css动画的方法,但如果用户浏览器不执行css动画-然后回退使用Jquery来制作动画。在Jquery中有一种简单的方法可以做到这一点吗?一个插件就可以了,如果它是一个小插件,但如果可能的话,我真的在寻找某种在jquery中执行此操作的方法。我想使用css动画的唯一原因是因为使用css动画时使用的处理器功率要低得多。 最佳答案 jQueryanimateenhancedplugin使用CSS转换而无需为支持转换的浏览器编写特定代码替代方案不是很令人鼓舞:您可以添加一个特征检测库,例如Modernizr,然后为每种情

javascript - 在客户端执行 jsx 转换

我正在构建一个允许用户构建和应用他们自己的组件和模板的应用程序。我想允许用户编辑jsx数据字符串,然后在客户端执行转换以进行渲染。虽然在inbrowsertransform对嵌入式脚本执行jsx转换,以及react-tools在服务器上可用,我无法确定如何使客户端可以使用转换功能。内联浏览器转换似乎没有提供任何访问方法,当我尝试在客户端上使用react-tools转换时,Atomify/Browserify崩溃。 最佳答案 JSXTransformer模块导出两个函数:transform将JSX源代码作为一个字符串并返回一个对象,该

javascript - 错误 : Invalid value for <g> attribute transform ="translate(undefined,undefined)"

我在集群中遇到d3.js问题。它给了我以下错误:Error:Invalidvalueforattributetransform="translate(undefined,undefined)"我不知道为什么它会给我。代码:varloadd3=function(){functionelbow(d,i){return"M"+(d.source.y+100)+","+d.source.x+"V"+d.target.x+"H"+(d.target.y+100);}varwidth=(window.innerWidth-100),height=(window.innerHeight-20);va

javascript - 使用 css 和 javascript 将 div 翻转 180 度

我想使用触发css动画的javascript函数将div翻转180度。我的div有以下声明:.start-photo-thumb{position:relative;float:left;background:#444444;height:192px;width:192px;margin-right:10px;margin-bottom:10px;perspective:1000px;animation:rotating0.6slinearinfinite;animation-play-state:paused;}@keyframesrotating{from{transform:ro

javascript - 猎犬.js : Transform the data returned by a remote source?

我正在使用带有远程API的Bloodhound,我需要转换从远程API返回的结果。APIURL是https://www.googleapis.com/books/v1/volumes?q=quilting它返回一个具有items属性的对象,该属性是一个列表。我需要将该列表返回给Typeahead,而不是顶级对象。Bloodhound文档说thereisatransformfunctionthatissupposedtodothis,但我无法让它工作。这是我的代码:varbooks=newBloodhound({datumTokenizer:function(d){returnBlood

javascript - 使用 KineticJS 变换(移动/缩放/旋转)形状

我正在尝试为KineticJS构建一个转换管理器,它将构建一个边界框并允许用户在他们的Canvas上缩放、移动和旋转图像。我被anchor的逻辑绊倒了。http://jsfiddle.net/mharrisn/whK2M/我只想让用户从任何Angular落按比例缩放他们的图像,并在按住并拖动anchor时旋转。谁能帮我指明正确的方向?谢谢! 最佳答案 这是我制作的旋转控件的概念证明:http://codepen.io/ArtemGr/pen/ociAD当控件被拖动时,dragBoundFunc用于旋转旁边的内容:controlGro

javascript - 如何使用 CSS 随机旋转图像?

我的网页上有一个包含20张图片的画廊,我想在将鼠标悬停在每张图片上时随机旋转(-5到5度)。如果可能的话,我想只使用CSS。如果没有,我愿意使用JavaScript或jQuery。我的CSS如下:.photo:hover{z-index:1;transform:rotate(6deg)scale(1.25);-webkit-transform:rotate(6deg)scale(1.25);-moz-transform:rotate(6deg)scale(1.25);-ms-transform:rotate(6deg)scale(1.25);}6deg应该是一个随机数,所以每次用户将鼠

javascript - 在按钮单击事件中旋转文本

我需要在点击按钮时以不同Angular旋转文本。我需要两个按钮,一个顺时针移动文本,另一个逆时针移动文本。 最佳答案 试试这个:html:texttoberotatedcss(提示:使用transform-origin控制旋转anchor,这里只用于webkit).rotate{-moz-transform:rotate(7.5deg);/*FF3.5+*/-o-transform:rotate(7.5deg);/*Opera10.5*/-webkit-transform:rotate(7.5deg);/*Saf3.1+,Chrom

javascript - -ms-transform for IE9 在 JavaScript 中

如何在JavaScript中为“-ms-transform”设置Div的属性?我想旋转一个DIV,如下所示:-ms-transform:rotate(30deg);任何帮助都会很棒:) 最佳答案 试试这个:document.getElementById('myDiv').style.msTransform='rotate(30deg)'; 关于javascript--ms-transformforIE9在JavaScript中,我们在StackOverflow上找到一个类似的问题: