svg

jQuery $(document).ready and svg-web window.onsvgload

jQuery of course requires everything to be inside $(document).ready = function() {}; similarly, svg-web requires: window.onsvgload = function() {}; Is there a correct, elegant way to combine these that doesn't introduce any problems? ...

How to create a HTML5 + SVG document using the PHP XSLTProcessor

For a little project about XML I try to use HTML5 as it has SVG and WAI-ARIA Support. I also want to use a XSL stylesheet for my document. But I can't get a valid HTML5 document with a nested SVG. Here are some version I tested so far: <?xml version="1.0" encoding="UTF-8"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999...

Applying attribute to SVG using JS prompts 'this.textBox.style is undefined'. Why?

Hi, I'm using the following code to draw an SVG text box, and then change its text anchor attribute to 'left' as it defaults to center and that's nasty. The text generates correctly, but when I add this second line I get the error 'this.textBox.style is undefined' in my error console. Here's my code: RenderTextBox:function() { ...

manipulate objects outside svg with javascript-function inside the svg

Hello! I'm embedding a svg-graphic on my website and i'd like to manipulate the rest of the website with javascript-commands which are in the svg - though i'm not sure if this is possible. Let me elaborate: I've got a worldmap in svg, i want to click on a country and this click should run an ajax-call and load relevant information of t...

Simple graphics API with transparency, polygons, reading image pixels?

I need a simple graphics library that supports the following functionality: Ability to draw polygons (not just rectangles!) with RGBA colors (i.e., partially transparent), Ability to load bitmap images, Ability to read current color of pixel in a given coordinate. Ideally using JavaScript or Python. Seems like HTML 5 Canvas can hand...

Render SVG font in Adobe Illustrator or Corel Draw

Hello! I'm developing a project that produces SVG files with custom embed fonts. SVG font definition I compose as SVG font tag with help of http://www.fontsquirrel.com/fontface/generator or Batik SVG Toolkit. The resulted SVG file I try to open in following applications: Adobe Illustrator CS4 - text has default font and message notice...

gwt-graphics show existing svg

can i import and show the content of an existing svg file with the gwt-graphics library? or exist a possibility to do this? ps: i don't have the svg file but i recive the code in a stream ...

How do I superimpose one SVG image onto another using Apache Batik?

I have 2 SVG files I need to overlay using Batik. One file serve as the background image and is 308px by 308px while the second file (260px by 260px) is the foreground image that must be centered (that is at the center of the background image). I'd like the result of the operation to be saved in a third SVG file. If you are familiar with...

Antialiasing, web SVG and Raphaël.js

I'm using Raphaël.js to draw some small circles (2-4px radius), which is done through SVG on all browser except IE. The circles don't look smooth to me, so my question is: Is there some way to add antialiasing to Raphaël.js? Barring that, is there some way to antialias SVG objects? ...

Push SVG String into Dom?

I have a javascript variable that basically looks like this: my_svg_image = '<circle cx="227.58331298828125" cy="102" r="3" style="fill:black;stroke-width:0" />'; It was loaded from my database. Is there a way I can parse that string and add it to the DOM with Javascript? I have svgweb set up, but don't see how I can get it to parse...

How do I apply multiple rotation transforms on a Raphael text object?

I have a Raphaël text object that I would like to rotate around an axis some distance away and also rotate the text accordingly so it stays horizontal. I know this is possible using SVG transformation matrices, but the author of Raphaël has stated that they won't be a part of the toolkit anytime soon. Here's some code of what I'd like t...

SVG gradient rotation

Consider rect has fill of linearGradient with two color with rotation of 112 degree. I am following below steps to make it alive Make gradient vertically for that set the values for coordinates x1=0, y1=, x2=, y2= Using transform list values in gradientTransform. gradientTransform="rotate(angle, shapeWidth/2, shapeHeight/2)". but t...

Convert Image (JPG,BMP,GIF) to SVG

Does anyone know tell me a tool that actually works (I tried several, but none works), with support for color images. If some of his friends know how to implement this, or any component that makes (C #), I would be grateful. Thanks for any help The program below works, however, leaves all the files in black and white. I'm still looki...

One SVG file, many SVG gradients inside

Hello, I’m making a set of buttons which use dynamic gradients. I’ve taken care of Firefox 3.6+ and WebKit by using their proprietary CSS extensions and all I need to do is support Opera, iOS and IE9 by using background-image: url("gradient.svg"). This is relatively easy, I made an SVG file, linked it and got it working. However, I’m m...

Firefox 3.6 hit testing overlapping SVG shapes

I am drawing 2 SVG paths much like Google Maps does with directions. The problem I have is that the section of the first path that is overlapped by the bounding box of the second path won't fire the mouseover, mouseout or click events. Even though the event handlers are on the path dom element the events seem to fire when the mouse is ...

SVG linearGradient coordinates calculation

Hi , How can I calculate coordinates (x1,y1,x2,y2) values for linearGradient SVG element with different angles?. Need to achieve rotation of gradient. Any help much appreciated, Thanks SHAN ...

Simple SVG question - Detecting "inline" or "visible" elements

I've spent about a week looking for a solution to a problem I'm not even sure is addressable. I'll describe it: I'm working on an application for a mobile device that uses SVG and I'm stuck on a particular problem. When a user rolls over ("focusin") on a particular element (calendar icon) the device automatically displays their upcomin...

How can I use a variable within an SVG path creation?

Hi, I'm creating an SVG path using the Raphael library and the following code: this.resultsBoxLine1 = paper.path("M42 10L42 36"); I would like to use variables to dictate the position of the path, however I cannot write like this: this.resultsBoxLine1 = paper.path("MmyVar11 myVar2LmyVar3 myVar4"); Does anybody know how I can do th...

xhtml <object> problem with explorer

I have an html page with this code <object data="ciao.xhtml" width="100%" height="100%" type="application/xhtml+xml"> </object> ciao.xhtml contain a well formed xhtml with svg embedded. It work well in chrome and firefox but when i test it on explorer i don't see enything ...

Simple SVG question - Forcing an object to appear "inline" when another object is inline.

Is it possible to make an object appear "inline" when another object appears "inline"? I'm creating something for a mobile device that uses SVG, and it's pretty limited. When the user highlights their calendar icon on the bottom of the screen ("focusin"), the device automatically displays their upcoming calendar events above (calendar_t...