Tag: raphael

如何使用jquery在窗口resize上缩放Raphael js元素: 如何在窗口更换时重新调整Raphaelcanvas内的所有元素？考虑下面的代码/ 演示如果我重新调整我的窗口大小只有div container缩放，因为我将其宽度设置为窗口宽度的50％而没有（ rect ， circle或path ）更改码 #container{border : 1px solid black ; width : 50% ; height:300px} var con = $(“#container”); var paper = Raphael(con.attr(‘id’), con.attr(‘width’), con.attr(‘height’)); var win = paper.rect(0,0,400,300).attr({stroke: ‘black’ }) ; var path = paper.path(“M 200 100 l 100 0 z”) ; var cir = paper.circle(50, 50, 40);

Raphael JS：如何在IE中的对象上使用jQuery选择器？: 我正在尝试使用Raphael JS，但jQuery选择器似乎与IE8中的Raphael JS不兼容。在Chrome和Firefox中，这可以： var paper = ScaleRaphael(“test”, 500, 500); var c = paper.circle(50, 50, 40); c.node.setAttribute(‘class’,’bluecircle’); $(‘.bluecircle’).attr({fill: ‘blue’}); 但在Internet Explorer（使用VML而不是SVG的IE8）中没有显示任何内容。基本上我要做的是给每个对象一个类，所以我可以使用Jquery选择器一次操作具有某个类的所有对象…… 有没有人知道如何做到这一点，这也适用于IE？

与Raphael路径的SVG动画: 我对SVG动画有一个相当有趣的问题。我使用拉斐尔沿着圆形路径制作动画 obj = canvas.circle(x, y, size); path = canvas.circlePath(x, y, radius); path = canvas.path(path); //generate path from path value string obj.animateAlong(path, rate, false); circlePath方法是我自己创建的方法，用于生成SVG路径表示法中的圆路径： Raphael.fn.circlePath = function(x , y, r) { var s = “M” + x + “,” + (yr) + “A”+r+”,”+r+”,0,1,1,”+(x-0.1)+”,”+(yr)+” z”; return s; } 到目前为止，这么好 – 一切正常。我的对象（obj）沿圆形路径动画。但：仅当我在与路径本身相同的X，Y坐标处创建对象时，动画才有效。如果我从任何其他坐标开始动画（例如，沿着路径的一半），对象在正确半径的圆圈中动画，但是它从对象X，Y坐标开始动画，而不是沿着路径开始动画，因为它以视觉方式显示。 […]

jQuery偏移顶部无法正常工作: 我正在尝试创建一个脚本通过鼠标在元素中绘制一些东西，而我正在使用Raphaeljs来做到这一点。为了正确绘制，我需要找到input‍‍元素的top和left 。我正在使用var offset = $(“#input”).offset(); left 。但top值不正确。它比真正的top距离低10px 。我认为10px可能会在不同的分辨率下改变，然后我通常不能添加10px然后我想知道如何解决问题！我在这里上传了我的考试。

如何沿路径制作Raphael对象的动画？: 对象可以是简单的，矩形或圆形。但路径应该是一条贝塞尔曲线。如果不是太麻烦，请提供javascript / Raphael代码。如果在动画期间存在移动物体的拖尾效果，那将是很好的。

将ID添加到raphael对象: 我有一个相当大的地图，包含Raphael路径，我试图让一些jquery ajax脚本可以访问。我试图添加一个ID或任何东西，以便以有组织的方式从jquery访问它。作为拉斐尔的新手，我无法找到实现这一目标的好方法。我尝试使用.data（）为每个点添加一个ID，其中包括“seat_1”，“seat_2”等，但到目前为止还没有成功。我将如何组织这个代码，以便通过循环操作它？我意识到这是一个相当开放的问题，但任何建议都非常感谢在这里演示： http ： //www.sam-sys.in/demo/pushparaj/ticketreservation/？ page_id = 203 var path_gs = rsr.path(“M5.834,698.336c-3.217,0-5.833,2.615-5.833,5.831 c0,3.215,2.616,5.833,5.833,5.833c3.219,0,5.835-2.618,5.835-5.833C11.669,700.951,9.053,698.336,5.834,698.336”); path_gs.attr({“clip-path”: ‘url(#SVGID_2_)’,fill: ‘#777675’,parent: ‘group_a’,’stroke-width’: ‘0’,’stroke-opacity’: ‘1’}).data(‘id’, ‘path_gs’); 产生

如何访问Raphael中任何元素的id属性: 我正在使用Raphael在网站上绘制一些元素。元素包括矩形，线（路径）。我给了path元素一个id，并尝试在该行的onclick事件中访问它。但是当我对id进行警报时，看不到任何东西。以下是代码段 function createLine() { var t = paper.path(“M” + xLink + ” ” + yLink +”L” + linkWidth + ” ” + linkHeight); t.attr(‘stroke-width’,’3′); t.attr(‘id’,’Hello’); t.node.onclick = processPathOnClick; } function processPathOnClick() { alert($(this).attr(“id”)); } 任何人都可以告诉我上面的代码有什么问题。任何指针都会有所帮助。谢谢

如何在Raphael生成的SVG上进行工具提示: 我正在做一些教学练习，用XSLT，Javascript和Raphael将XML转换为SVG。我确信这是艰难的方式……但它具有教育意义。我遇到的问题是创建工具提示。到目前为止，我已经找到了三种方法：第一种方法是在对象上使用.attr({title: “blah”{) 。这是有效的，但拉斐尔并没有正式支持，我想在工具提示中加入的内容可能有点长，这是人们操作系统在人们读完之前超出工具提示的问题。我找到的第二种方法就是这里的function。当有鼠标hover时，它可以正常弹出拉斐尔对象，但是，据我所知，弹出一个看起来很正常的工具提示是不可能的。使用jquery Tooltip插件。这似乎不起作用。我无法让Raphael将title属性添加到对象中并选择该标题。不知道为什么。所以，我想知道的是，向Raphael对象添加工具提示是一种简单可靠的方法，以便当人们将鼠标hover在对象上时弹出它们，并在鼠标输出时（但不是之前）消失？