headers
Jason | 18 May 13:05
Picon
Favicon

Manipulating SVG in HTML using JavaScript

I have a project I'm working on. My goal is to display 18 images in a single HTML document in the same space. The
first is just text and is put in using standard HTML. Over that I have placed a SVG image and I'd like to do
drawings in it using JavaScript. I only want one server call for the entire map set. I know how to do the math
to get the images and text in the SVG but I can't get the JavaScript to do the drawings.

Here is what it should look like: http://evony.net23.net
Here is the code that's not working: http://evony.net23.net/maps.htm

The one that works is 18 different pages and takes up over 175kb of file space. The one that doesn't work yet
will be less than 10kb.

Any suggestions would be appreciated.

Jason

------------------------------------

-----
To unsubscribe send a message to: svg-developers-unsubscribe <at> yahoogroups.com
-or-
visit http://groups.yahoo.com/group/svg-developers and click "edit my membership"
----Yahoo! Groups Links

<*> To visit your group on the web, go to:
    http://groups.yahoo.com/group/svg-developers/

<*> Your email settings:
    Individual Email | Traditional

<*> To change settings online go to:
(Continue reading)

Permalink | Reply | 1 comment |
headers
svgdeveloper | 20 May 13:41
Picon
Favicon

Get first parameter of rotate function

Hello,

I just joined your SVG group. I'm working on a web application which is based on SVG. I have a little problem
concerning the rotate parameters of a text element. I want to fetch the first parameter of a rotate
function which represents the rotation angle in degrees.

I use the jQuery SVG plugin of Keith Wood to use jQuery to interact with the SVG canvas. To fetch the angle I use
the indexOf and substring methods of JavaScript. For instance:

      
        currentFontRotation = currentId.attr('transform');
        var bracket = currentFontRotation.indexOf('rotate(');
        var comma = currentFontRotation.indexOf(',');
        bracket = bracket +7;       
        currentFontRotationNumber = currentFontRotation.substring(bracket, comma );

The variable currentId represents the selected text element. Is there a more clean way to get the angle. I
think it's a pretty dirty method to use the indexOf and substring methods in this case.

Thanks

------------------------------------

-----
To unsubscribe send a message to: svg-developers-unsubscribe <at> yahoogroups.com
-or-
visit http://groups.yahoo.com/group/svg-developers and click "edit my membership"
----Yahoo! Groups Links

<*> To visit your group on the web, go to:
(Continue reading)

Permalink | Reply | 1 comment |
headers
Brian Birtles | 21 May 04:02
Picon
Gravatar

Re: Filter inheritance

Hi Jan,

(2012/05/19 5:50), honyk wrote:
> While there is a child element with the filter attribute set to 'none', the
> filter of its ancestor is still aplied to it (FF and Chrome).
>
> Is it bug or according to the spec?

This is according to the spec. Specifically, this part:

"When applied to container elements such as ‘g’, the ‘filter’ property 
applies to the contents of the group as a whole. The group's children do 
not render to the screen directly; instead, the graphics commands 
necessary to render the children are stored temporarily."[1]

The filter property is not inherited so there's no need to set it to none.

You can think of it like this: at the point where the filter property 
appears, the element and all of its children stop drawing to the screen 
and instead draw to 'SourceGraphic'.

The filter can then use 'SourceGraphic' (or SourceAlpha) and apply its 
effects to the visual result of the element and all of its children at 
once. It doesn't apply to the children individually.

Hope that helps,

Brian

[1] http://www.w3.org/TR/SVG11/filters.html#Introduction
(Continue reading)

Permalink | Reply | 0 comments |
headers
honyk | 18 May 22:50
Picon

Filter inheritance

Dear All,

I've tried to apply a drop-shadow filter, but encountered the following
inheritance issue, see this small test case
http://hroska.cz/other/filter.svg

While there is a child element with the filter attribute set to 'none', the
filter of its ancestor is still aplied to it (FF and Chrome).

Is it bug or according to the spec?

While there is a quite easy workaround for this example, my real file is
much more complex :-(

Any idea?

Thanks, Jan

------------------------------------

-----
To unsubscribe send a message to: svg-developers-unsubscribe <at> yahoogroups.com
-or-
visit http://groups.yahoo.com/group/svg-developers and click "edit my membership"
----Yahoo! Groups Links

<*> To visit your group on the web, go to:
    http://groups.yahoo.com/group/svg-developers/

<*> Your email settings:
(Continue reading)

Permalink | Reply | 0 comments |
headers
David Dailey | 15 May 20:15

PlanetSVG is listed as suspicious

http://www.google.com/safebrowsing/diagnostic?site=http://planetsvg.com/tool
s/mime.php
<http://www.google.com/safebrowsing/diagnostic?site=http://planetsvg.com/too
ls/mime.php&hl=en> &hl=en 

Interesting. I was trying to get to info about setting mimetypes, but the
site seems to have been the target of some mischief.

Cheers

D

[Non-text portions of this message have been removed]

------------------------------------

-----
To unsubscribe send a message to: svg-developers-unsubscribe <at> yahoogroups.com
-or-
visit http://groups.yahoo.com/group/svg-developers and click "edit my membership"
----Yahoo! Groups Links

<*> To visit your group on the web, go to:
    http://groups.yahoo.com/group/svg-developers/

<*> Your email settings:
    Individual Email | Traditional

<*> To change settings online go to:
    http://groups.yahoo.com/group/svg-developers/join
(Continue reading)

Permalink | Reply | 0 comments |
headers
David Dailey | 16 May 01:36

video affected by SVG clip-path

I have put a video in an HTML5 document and have succeeded in having it
clipped by an SVG clip-path (and also filtered) as follows:

<style>video {position:absolute;  filter: url(#f1);clip-path: url(#c1); }

                                p{left:50%;top:5%;
position:absolute;clip-path: url(#c1);}

</style>  

The clip path is later defined within an SVG tag on the same page.

This only seems to work in Firefox though. Would it be absurd to think that
it might someday work elsewhere as well?

The other experiments I've done (trying to accomplish similar effects)
involve

a)      Using <foreignObject> in svg - with an <iframe> containing the
video. Seems only to work in Firefox again - Opera displays the  video, but
it only plays if I actively resize the window, as soon as I stop dragging
the corner of the window, the video stops

b)      Using <video> in svg - only Opera seems to do this, but then I can't
use all the fun attributes associated with video.

So two questions really:

1.       Is <video> in SVG likely to be improved in other browsers? Will the
other attributes (like controls="controls"  muted="muted" loop="loop"
(Continue reading)

Permalink | Reply | 0 comments |
headers
Arif Burhan | 13 May 01:54
Picon
Favicon

Fw: Reflection in a puddle

I now have a Chrome / webkit compliant example of the puddle effect example below -
see:          http://irony-maiden.com/SVG/Cr-Puddle.htm
[    all  <clipPath> blocks need to be within a <defs> block    ]
Kind regards,
Arif Burhan

--- On Thu, 10/5/12, Arif Burhan <aburhan2000 <at> yahoo.co.uk> wrote:

From: Arif Burhan <aburhan2000 <at> yahoo.co.uk>
Subject: [svg-developers] Reflection in a puddle
To: svg-developers <at> yahoogroups.com
Date: Thursday, 10 May, 2012, 9:02

 

    

      
      To see an example of a reflection in a puddle view:

     http://irony-maiden.com/SVG/Puddle.htm

( Best viewed in Mozilla Firefox or Seamonkey )

regards,

Arif Burhan

[Non-text portions of this message have been removed]
(Continue reading)

Permalink | Reply | 1 comment |
headers
royhoja | 14 May 17:45
Picon
Favicon

Getting current time in svg file...

Hi,
I am trying to add current time to the svg file I have using Ecmascript.
following is the code I have. Unfortunately its not working . can someone help me fix it?
Thank you

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
width="300" height="300">
<text x="0" y="15" fill="red">It is now
<script type="text/javascript">
<![CDATA[
var currentTime = new Date();
var month = currentTime.getMonth() + 1;
var day = currentTime.getDate();
var year = currentTime.getFullYear();
document.write(month + "/" + day + "/" + year);
]]>
</script>
</text>
</svg> 

------------------------------------

-----
To unsubscribe send a message to: svg-developers-unsubscribe <at> yahoogroups.com
-or-
visit http://groups.yahoo.com/group/svg-developers and click "edit my membership"
----Yahoo! Groups Links
(Continue reading)

Permalink | Reply | 1 comment |
headers
barkha jasani | 10 May 16:10
Picon
Favicon

Need Guidelines

I am a new bea to SVG,Basically i'm a java developer.And Currently i 
have got a requirement to create a POC with JAVA and SVG which includes 
generating Floor wise Dynamic(Interactive) maps

1.       Using SVG model provided by a designer as the
background of the map
·         Receive an SVG file that represent static floor
map and use it as a resource in the code
·         Use a dedicated layer for the map background
·         Implement zoom-in and out of the background and
all sub entities by point-and-click on the map. Point clicked is centered as
part of the zoom operation
2.       Using drag and drop to add Readers to the map
·         Show a list of un-assigned Readers using pseudo
data.
·         Allow the user to drag items from the list into
the map. Once on the map, Readers can be dragged again on the map to change
their location.
·         Allow removing of items from the map by dragging
them back to the list.
3.       Using Layers to group all entities of the same
type
·         Each type of entities is shown on its own Layer.
The background is also placed on its own Layer.
·         Each layer can be faded-in and out independently
of other Layers using a slider.
·         Each layer can be turned on and off. This is
implemented by showing a list of all Layers, each of them can be switched on or
off by a checkbox.
(Continue reading)

Permalink | Reply | 0 comments |
headers
Arif Burhan | 10 May 10:02
Picon
Favicon

Reflection in a puddle

To see an example of a reflection in a puddle view:

     http://irony-maiden.com/SVG/Puddle.htm

( Best viewed in Mozilla Firefox or Seamonkey )

regards,

Arif Burhan

[Non-text portions of this message have been removed]

------------------------------------

-----
To unsubscribe send a message to: svg-developers-unsubscribe <at> yahoogroups.com
-or-
visit http://groups.yahoo.com/group/svg-developers and click "edit my membership"
----Yahoo! Groups Links

<*> To visit your group on the web, go to:
    http://groups.yahoo.com/group/svg-developers/

<*> Your email settings:
    Individual Email | Traditional

<*> To change settings online go to:
    http://groups.yahoo.com/group/svg-developers/join
    (Yahoo! ID required)
(Continue reading)

Permalink | Reply | 0 comments |
headers
Jonathan Chetwynd | 5 May 10:03
Gravatar

Given start point, control point(s) vector & length, how to solve end point for quadratic and cubic Bézier curves?

Given start point, control point(s) vector & length, how to solve end  
point for quadratic and cubic Bézier curves?

Jonathan Chetwynd
jay <at> peepo.com

------------------------------------

-----
To unsubscribe send a message to: svg-developers-unsubscribe <at> yahoogroups.com
-or-
visit http://groups.yahoo.com/group/svg-developers and click "edit my membership"
----Yahoo! Groups Links

<*> To visit your group on the web, go to:
    http://groups.yahoo.com/group/svg-developers/

<*> Your email settings:
    Individual Email | Traditional

<*> To change settings online go to:
    http://groups.yahoo.com/group/svg-developers/join
    (Yahoo! ID required)

<*> To change settings via email:
    svg-developers-digest <at> yahoogroups.com 
    svg-developers-fullfeatured <at> yahoogroups.com

<*> To unsubscribe from this group, send an email to:
    svg-developers-unsubscribe <at> yahoogroups.com
(Continue reading)

Permalink | Reply | 0 comments |

Gmane