raphael

问题 This is what I want to achieve: I want to create an interactive map using raphael.js. Using Php, I get datas from MySql DB and converted into a JSON file. So far so good. Inside my raphael js file, I must now: get those datas use them in order to modify my raphael file. I am currently stuck at this first step. Here's my simplified JSON file (let's call it countries.json) : [ { "id": "1", "type": "Country", "title": "France", "published": "1", "description": "Republic" }, { "id": "2", "type":

问题 If I have a circle object var c = paper.circle(...) I would like to get this circle's center x, y position, how to get? 回答1: You can get the SVG attributes of cx and cy with: c.attr('cx'); 回答2: Do something like: var c = paper.circle(...); var centerX = c.attr('x') + c.attr('width') / 2; var centerY = c.attr('y') + c.attr('height') / 2; 来源： https://stackoverflow.com/questions/5618794/raphael-js-how-to-get-a-circles-center-x-y-position

问题 If I have a circle object var c = paper.circle(...) I would like to get this circle's center x, y position, how to get? 回答1: You can get the SVG attributes of cx and cy with: c.attr('cx'); 回答2: Do something like: var c = paper.circle(...); var centerX = c.attr('x') + c.attr('width') / 2; var centerY = c.attr('y') + c.attr('height') / 2; 来源： https://stackoverflow.com/questions/5618794/raphael-js-how-to-get-a-circles-center-x-y-position

问题 I need to do something like: paper.text(Left, Top, " " + this._p.Label + ":"); paper.text(Left, Top, " " + this._p.Label + ":"); But the prepended whitespace won't show or show as   in text. I've tried: label.attr({"xml:space": "preserve"}); ...with no effect. Is there anyway to access the SVG node in Raphael JS so I can set setAttributeNS("http://www.w3.org/XML/1998/namespace","space","preserve"); (or is there any other way to solve this?) 回答1: Yes, you can definitely apply that namespaced

问题 I'm trying to work out how to determine when an svg image has loaded in the browser. I'm using Raphael JS and I've tried: var image = paper.image(path, 0,0,10,10); image.node.addEventListener('load', function(){alert("test");}); and: $('image').on('load') all to no avail. I've also used "onload" and "onsvgload" none of which work. Is there away to determine if an svg image has actually loaded? I even tried loading the image using an Image() object and then calling paper.image() - but I get

问题 I want to apply or 'bake' a transformation of several paths in Raphael JS 2, so that I can then combine them into one single path. Here is an example path, where I would like the "transform" attribute to be applied to all the "d" coordinates. <path style="" fill="#000000" stroke="none" d="M150,-265C182,-275,171,-220,180,-194L178,-194C181,-192,180,-185,181,-180C211,-169,282,-173,306,-166C308,-169,316,-171,315,-165C268,-157,225,-148,184,-137C188,-118,186,-96,190,-79L282,-131C289,-131,296,-135

问题 I used the worderfull javascript library called raphaeljs on my website to draw maps, animations and animated functionalities. I have noticed that the script using this library work perfectly with iPhone but not with Android . Can someone confirm this (just going on the demo page of raphaeljs will tell you if it works of not) and if it doesn't, does someone has any idea why, and what could be tested. Thanks 回答1: The default Android browser did not support SVG until they recently re-introduced

问题 My app is dependent on the conversion of some HTML text elements into SVG elements, using Raphael.js . The text in those HTML objects is given by the user, via a textarea input. Therefore, they can input new lines too. And those new lines need to be accounted for when creating the SVG. For this, I use the following code: function replaceNL(text) { return text.replace(/[\n\r]/g, "\n"); } And when adding the SVG to the page: var obj = paper.text(x,y,replaceNL(this.text)); The problem I've come

问题 I'm build a kind of javascript map with javascript and the Raphael lib. I'm able to zoom on an object when clicked, but I want it to be animated (like slowly diving in and so on). Is there a way to do so without reinventing the wheel? 回答1: There is no reason that the viewbox of an svg object cannot be animated -- Raphael simply doesn't provide such functionality out of the box. Creating a plugin is reasonably straightforward, however. For instance: Raphael.fn.animateViewBox = function

问题 I've seen this question asked over at the Raphael Google Groups, but after hours of searching there, and also on here, and Google, I cannot seem to find a solution. I would simply like to be able to target my pie chart (svg path) slices using jQuery, but I cannot figure out how to add custom id's to the path tags - there is no ID attribute in there by default: <path fill="#764c29" stroke="none" d="M350,350L350.6911881148345,94.00093308961084A256,256,0,0,1,561.8463375189659,206.2741175716762Z"