标签: transform

jQuery旋转/转换

我想使用此功能旋转然后在特定点或度数停止.现在元素只是旋转而不停止.这是代码:

    <script type="text/javascript">
    $(function() {
       var $elie = $("#bkgimg");
       rotate(0);
       function rotate(degree) {

           // For webkit browsers: e.g. Chrome
           $elie.css({ WebkitTransform: 'rotate(' + degree + 'deg)'});
           // For Mozilla browser: e.g. Firefox
           $elie.css({ '-moz-transform': 'rotate(' + degree + 'deg)'});

           // Animate rotation with a recursive call
           setTimeout(function() { rotate(++degree); },65);
       }
    });
    </script>
Run Code Online (Sandbox Code Playgroud)

谢谢你的帮助

jquery transform rotation

21
推荐指数
3
解决办法
13万
查看次数

变换不在IOS上工作

所以我在iOS上面对这个小问题实现这个代码,因为我不熟悉iOS的工作原理.我有这个圈子,我在我的网站上使用它在浏览器和Android设备上的完美工作但是当涉及到iOS时它会崩溃并且所有学位都会成为中心.如果有人可以帮我解决这个问题,我会很高兴的.

HTML

<div class='circle-container'>   
    <div class="center"> Center </div>
    <div class="deg90">1</div>
    <div class="deg315">2</div>
    <div class="deg0">3</div>
    <div class="deg110">4</div>
    <div class="deg135">5</div>
    <div class="deg180">6</div>
    <div class="deg225">7</div>
</div>
Run Code Online (Sandbox Code Playgroud)

CSS:

.circle-container {
    position: relative;
    width: 15em;
    height: 14em;
    padding: 2.8em;
    /*2.8em = 2em*1.4 (2em = half the width of a link with img, 1.4 = sqrt(2))*/
    border: dashed 0px;
    border-radius: 50%;

}
.circle-container > a {
    display: block;
    text-decoration: none;
    position: absolute;
    top: 50%; left: 50%;
    width: 4em; height: 4em;
    margin: -2em;

    text-align: center;
}

.circle-container …
Run Code Online (Sandbox Code Playgroud)

css transform css3 ios

21
推荐指数
2
解决办法
4万
查看次数

CATransform3D旋转导致图像的一半消失

我正在使用以下代码来旋转图像,但是已经"旋转"出页面的图像的一半(沿着y轴)消失了.怎么修?heading是弧度.

    CALayer *layer = myUIImageView.layer;
    CATransform3D rotationAndPerspectiveTransform = CATransform3DIdentity;
    rotationAndPerspectiveTransform.m34 = 1.0 / 500;
    rotationAndPerspectiveTransform = CATransform3DRotate(rotationAndPerspectiveTransform, heading, 0.0f, 1.0f, 0.0f);
    layer.transform = rotationAndPerspectiveTransform;
Run Code Online (Sandbox Code Playgroud)

iphone transform calayer quartz-graphics catransform3d

20
推荐指数
2
解决办法
7520
查看次数

将多个函数应用于数据框的每一行

每次我认为我理解使用向量时,似乎是一个简单的问题会让我内心深处.很多阅读和尝试不同的例子在这个场合没有帮助.请勺子喂我这里...

我想将两个自定义函数应用于数据帧的每一行,并将结果添加为两个新列.这是我的示例代码:

# Required packages:
library(plyr)

FindMFE <- function(x) {
    MFE <- max(x, na.rm = TRUE) 
    MFE <- ifelse(is.infinite(MFE ) | (MFE  < 0), 0, MFE)
    return(MFE)
}

FindMAE <- function(x) {
    MAE <- min(x, na.rm = TRUE) 
    MAE <- ifelse(is.infinite(MAE) | (MAE> 0), 0, MAE)
    return(MAE)
}

FindMAEandMFE <- function(x){
        # I know this next line is wrong...
    z <- apply(x, 1, FindMFE, FindMFE)
        return(z)
}

df1 <- data.frame(Bar1=c(1,2,3,-3,-2,-1),Bar2=c(3,1,3,-2,-3,-1))

df1 = transform(df1, 
    FindMAEandMFE(df1)  
)

#DF1 should end up with …
Run Code Online (Sandbox Code Playgroud)

r transform rows apply dataframe

20
推荐指数
3
解决办法
6466
查看次数

在CSS3变换后获取div的实际像素坐标

是否有可能得到的四个实际的顶点坐标<div />是已经用CSS3属性,如scale,skewrotate

例:

在CSS3转换之前,坐标是

x1y1: 0,0
x1y2: 0,200
x2y1: 200,0
x2yw: 200,200
Run Code Online (Sandbox Code Playgroud)

div看起来像这样:

在转型之前

经过一点点CSS3魔术后transform: skew(10deg, 30deg) rotate(30deg) scale(1, 2); 它看起来像这样:

转型后

如何获得实际角点(不是边界框)的坐标(使用javascript)?任何帮助非常感谢.

javascript jquery transform css3

20
推荐指数
1
解决办法
7833
查看次数

如何获得translateX和translateY的价值?

我希望translateY通过JavaScript从内联css中获取价值.

这是内联值:

style ="transition-property: transform; transform-origin: 0px 0px 0px; transform: translate(0px, -13361.5px) scale(1) translateZ(0px);"
Run Code Online (Sandbox Code Playgroud)

这些代码给了我变量中的总列表:

var tabletParent = document.getElementById("scroller");
var toTop = tabletParent.style.transform;
console.log(toTop);
Run Code Online (Sandbox Code Playgroud)

console.log

translate(0px, -12358.8px) scale(1) translateZ(0px)
Run Code Online (Sandbox Code Playgroud)

预期toTop-12358.8px.

javascript transition transform css3

20
推荐指数
3
解决办法
2万
查看次数

将转换应用于UITextView - 防止内容调整大小

当我将旋转变换应用于a UITextView然后单击内部以开始编辑时,似乎内容大小自动变宽.内容视图的新宽度是旋转视图的边界框的宽度.例如,给定宽度为500且高度为400的文本框,并旋转30度,新的内容宽度将为:

(500 * cos(30)) + (400 * sin(30)) = 633
Run Code Online (Sandbox Code Playgroud)

或图形化:

在此输入图像描述

有趣的是,如果您已经在编辑文本视图,然后应用转换,那么似乎不会对内容大小进行任何修改.所以看起来在文本编辑开始的某个时候,文本视图会查看其frame属性并根据帧宽调整内容大小.我想这个解决方案是告诉它使用bounds属性,但我不知道在哪里做,因为我不确定文本视图决定修改内容大小的确切位置.

我用谷歌搜索,但似乎无法找到任何使用转换的UITextViews的参考.有没有人对此有任何想法?

编辑(测试项目的按钮操作):

- (IBAction)rotateButtonTapped:(id)sender {
    if (CGAffineTransformIsIdentity(self.textView.transform)) {
        self.textView.transform = CGAffineTransformMakeRotation(30.0 * M_PI / 180.0);
    }
    else {
        self.textView.transform = CGAffineTransformIdentity;
    }

    NSLog(@"contentsize: %.0f, %.0f", textView.contentSize.width, textView.contentSize.height);
}
Run Code Online (Sandbox Code Playgroud)

transform rotation uitextview cgaffinetransform ios

19
推荐指数
1
解决办法
4838
查看次数

C++ std :: transform of pairs-> first to new vector

对不起有点初学者的问题.有矢量和矢量对

typedef std::vector <int> TItems;
typedef std::vector < std::pair <int, int> > TPairs;
Run Code Online (Sandbox Code Playgroud)

有没有办法在一步中将对中的所有第一项转换为另一个向量

int main ()
{
TItems items;
TPairs pairs;

pairs.push_back (std::make_pair(1,3));
pairs.push_back (std::make_pair(5,7));

std::transform( items.begin(), items.end(), items.begin(), comp ( &pairs ) );

return 0;
}
Run Code Online (Sandbox Code Playgroud)

如何设计仿函数?

class comp
{
private:
     TPairs *pairs;

public:
    comp ( TPairs  *pairs_ ) : pairs ( pairs_) { }

    unsigned int operator () ( const unsigned int index ) const
    {
        return  (*pairs)[index].second != pairs->end();  //Bad idea
    }
};
Run Code Online (Sandbox Code Playgroud)

也许有一些没有lambda表达式和循环的用户友好方法.谢谢你的帮助.

c++ transform vector functor std-pair

19
推荐指数
3
解决办法
2万
查看次数

CSS变换比例,不要缩放子元素

如果我有一个带有一些子元素的div,那就是css变换缩放.我有一个我不想扩展的子元素

#parent{
    -webkit-transform: scale(.5);
}
 
span:last-child{
    -webkit-transform: Something to ignore the parent scale;
}
Run Code Online (Sandbox Code Playgroud)
<div id="parent">
    <span>Child 1</span>
    <span>Child 2</span>
    <span>Child 3 (Don't Scale Me)</span>
</div>
Run Code Online (Sandbox Code Playgroud)

这可以用css完成吗?不改变html或使用js.

css transform css3

19
推荐指数
1
解决办法
3万
查看次数

变换后获取D3节点的屏幕位置

我试图在d3.behavior.zoom()转换布局后获取节点的屏幕位置,但我没有太多运气.在翻译和缩放布局后,我如何才能在窗口中获取节点的实际位置?

mouseOver = function(node) {
  screenX = magic(node.x); // Need a magic function to transform node
  screenY = magic(node.y); // positions into screen coordinates.
};
Run Code Online (Sandbox Code Playgroud)

任何指导将不胜感激.

编辑:上面的'node'是一个强制布局节点,因此它的x和y属性由模拟设置,并在模拟停止后保持不变,无论应用何种类型的变换.

编辑:我用来转换SVG的策略来自d3的缩放行为,这里概述了:SVG Geometric Zooming.

var svg = d3.select("body").append("svg")
    .attr("width", width)
    .attr("height", height)
  .append("g")
    .call(d3.behavior.zoom().scaleExtent([1, 8]).on("zoom", zoom))
  .append("g");

svg.append("rect")
    .attr("class", "overlay")
    .attr("width", width)
    .attr("height", height);

svg.selectAll("circle")
    .data(data)
  .enter().append("circle")
    .attr("r", 2.5)
    .attr("transform", function(d) { return "translate(" + d + ")"; });

function zoom() {
  svg.attr("transform", "translate(" + d3.event.translate + ")scale(" + d3.event.scale + ")"); …
Run Code Online (Sandbox Code Playgroud)

position transform zoom d3.js

18
推荐指数
2
解决办法
3万
查看次数