Jump to content

Search the Community

Showing results for tags 'SVG'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • W3Schools
    • General
    • Suggestions
    • Critiques
  • HTML Forums
    • HTML/XHTML
    • CSS
  • Browser Scripting
    • JavaScript
    • VBScript
  • Server Scripting
    • Web Servers
    • Version Control
    • SQL
    • ASP
    • PHP
    • .NET
    • ColdFusion
    • Java/JSP/J2EE
    • CGI
  • XML Forums
    • XML
    • XSLT/XSL-FO
    • Schema
    • Web Services
  • Multimedia
    • Multimedia
    • FLASH

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


AIM


MSN


Website URL


ICQ


Yahoo


Jabber


Skype


Location


Interests


Languages

Found 17 results

  1. Could you please help me to find the answer, how the svg file should look like? <svg viewBox="0 0 80 20" xmlns="http://www.w3.org/2000/svg"> <symbol id="myDot" viewBox="0 0 6 6" overflow="visible" transform="matrix(2 0 0 1 -6 5)"> <circle cx="1" cy="2" r="3"/> </symbol> <use href="#myDot" x="0" y="0" style="opacity:0.8" /> </svg> it looks differently in firefox and chrome. I disabled clipping by setting 'overflow="visible"'. In one case the transformation matrix is applied to she shape, and in the other one it is not. I can not find in specs which one is correct. Maybe someone knows?
  2. I've seen this (and similar) code used to apply an SVG filter to an image. How do I use this code to apply an SVG filter to a canvas? The canvas' content may change often. <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <defs> <filter id="darkGreen"> <feColorMatrix type="matrix" values="0 0 0 0 0 0 0.5 0 0 0 0 0 0 0 0 0 0 0 0 1" /> </filter> </defs> <image xlink:href="(url to image)" width="" height="" filter="url(#darkGreen)" /> </svg> Thank you
  3. I've been experimenting with various models for edge detection in an image. Everything I've tried reduces the image to grayscale. How do I perform edge detection with an SVG Sharpen Filter and preserve the image's underlying color? Here's a sample of the effect I'm looking for: Thank you very much!
  4. I am not able to understand how to enter any other element under SVG. suppose if you have to put your form under the SVG CIRCLE then how you will do it. Or suggest any other idea how i can nest my form's input text field under SVG. I also want to know weather i can align any form's input field like we can align texts. please answere my questions.
  5. Why does my polyline tag in SVG not accept style set inside defs tag but does in normal CSS? Here is my code: <html> <body> <style> .trapezoid2 { fill:beige;stroke:forestgreen;stroke-width:2; } </style> <center> <!-- I routinely use the center tag for older browsers. --> <svg height="400" width="800" style="border:5px double blue;background-color:tan;margin:0 auto;" > <defs> <polygon id="trapezoid1" style="fill:tan;stroke:blue;stroke-width:4;" /> </defs> <use xlink:href="#trapezoid1" points="100,200 150,100 350,100 400,200" /> <polygon id=".trapezoid2" points="400,300 450,200 650,200 700,300" style="fill:beige;stroke:forestgreen;stroke-width:2;" /> </svg> </center> </body> </html> The second trapezoid shows up but not the first. Thanks, PHPremote aka Patrick w3forum_polyline_defJune3.html
  6. Hello! Is there any way I can add a specific class to svg tag? I try to do that: .svgclass{ stroke: lightblue; stroke-width: 2px; display:inline-block; position:absolute; z-index:1; right: 0px; top: 10px; margin:0px 0px 0px 0px; padding:0px 0px 0px 0px; height:80px; width:1px; } And in the body: <svg class="svgclass"><line x1="0" y1="0" x2="0" y2="80" /></svg> This is not work... (And the svg style is set good, cause when I remove the class from the svg, and change in the css file to svg its all great..) Thanks! (:
  7. We need to display machine statuses based on time according to the attached screenshot using HTML5, CSS and SVG ?I thought of using Stack Bar chart but in the current context, a status can be repeated multiple times in a given timespan.For ex, In a given timespan, 11PM - 11:30Pm, what are the different statuses a machine is transitioned into ?Each state is represnted by a color.Can any one suggest how to generate this chart ?
  8. I don't understand the X-Axis-Rotation. One definition says it indicates how the ellipse is rotated relative to the current coordinate system. What do they mean by rotated? What do they mean by the current coordinate system?
  9. I'm sorry for this very prosaic topic: What does exactly mean: 'scalable vector graphics'? 1 - It means that when you reduce browser's window into a smaller size, the graphic (a circle for example) reduces itself keeping its shape, avoid the overlapping of the browser's window? 2 - Or it means that the created shape on screen is gonna have a different size, relatively to the window's size? 3 - Or it's relative to the computation's value of the script that will make the shape? Sorry again (...blushing), thanks to anyone who'll reply to this unbelievable topic...
  10. Hi, I have this following code: http://jsfiddle.net/dustcomposer/bapwnhy0/ var cresc_path = '<path class="dyna_line" id="dyna_line" d="M ' + 0 + ' ' + 0 + ' L ' + 50 + ' ' + 25 + ' M ' + 0 + ' ' + 50 + ' L ' + 50 + ' ' + 25 + '" style="stroke-width: 1; stroke: red; fill:none;" />';var dl = document.createElementNS("http://www.w3.org/2000/svg", "svg");dl.setAttribute('class', 'dyHolder');dl.setAttribute('id', 'dyHolder');dl.setAttribute('style', 'border:1px solid red');dl.setAttribute('width', '50');dl.setAttribute('height', '50');dl.setAttributeNS("http://www.w3.org/2000/xmlns/", "xmlns:xlink", "http://www.w3.org/1999/xlink");dl.innerHTML = cresc_path;document.getElementById('a').appendChild(dl);var str = '<svg class="dyHolder" id="dyHolder" style="border:1px solid red" width="50" height="50" xmlns:xlink="http://www.w3.org/1999/xlink"><path class="dyna_line" id="dyna_line" d="M 0 0 L 50 25 M 0 50 L 50 25" style="stroke-width: 1; stroke: red; fill:none;"></path></svg>';document.getElementById('b').innerHTML = str; both dl and str does result a svg image in html page. but when I grab similar string with str from json file, it appears as text like: <svg class="dyHolder" id="dyHolder" style="border:1px solid red" width="50" height="50" xmlns:xlink="http://www.w3.org/1999/xlink"><path class="dyna_line" id="dyna_line" d="M 0 0 L 50 25 M 0 50 L 50 25" style="stroke-width: 1; stroke: black; fill:none;"></path></svg> can anyone explain what the problem is? UPDATE: I've found the problem! the saved json structure must be typed neat. If the json structure made like this: [[ "28/11/2014 - 7:7", "", "", ""],[ "", "", "", ""],["", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", ""],["", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", ""],["", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", ""],["", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "<svg class="dyHolder" id="dyHolder" style="border:none" width="140" height="10" xmlns:xlink="http://www.w3.org/1999/xlink"><path class="dyna_line" id="dyna_line" d="M 0 0 L 140 5 M 0 10 L 140 5" stroke-width="1" stroke="black" fill="none"></path></svg>"]] the svg (as string) won't appears as svg but a paragraph/text. therefore it should written like this: [[ "28/11/2014 - 7:7", "", "", ""],[ "", "", "", ""],[ "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", ""],[ "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", ""],[ "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", ""],[ "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "<svg class="dyHolder" id="dyHolder" style="border:none" width="140" height="10" xmlns:xlink="http://www.w3.org/1999/xlink"><path class="dyna_line" id="dyna_line" d="M 0 0 L 140 5 M 0 10 L 140 5" stroke-width="1" stroke="black" fill="none"></path></svg>"]] Everything works well now.
  11. hello, I am new to this forum and beginner in html5 language . My goal is to create a canvas or svg that consists of grid where I can add rectangles and circles with specific sizes and positions(by dragging objects). what I should use and how I can save all information like sizes and positions in my database to display or modify it in another page. is the example thanks.
  12. I was guided toward svg when I found out about vector resizable feature... now that I went through the svg guide on w3school(which was just a guise of it). I come to wonder if I can use that over canvas api?What do you guys think?Gaming propose, which one would be efficient in formatting games?
  13. L8V2L

    MOAR SVG!

    expand the SVG tutorial, and reference explanation etc. web animation is being implementing.
  14. I'm trying to work with SVGs but I'm pretty sure there's going to be some people using the old browsers that don't do this, so I'm looking into installing some kind of a fallback. Is there some way I can do this? Maybe make a DIV with the PNG for the background and containing the SVG?
  15. Hi, I'm trying to use an svg file to display a logo instead of a png file, but when they don't render the same font and image in the browser. Anyone have an idea why the svg file doesn't display in the browser like in the svg editor (inkscape)? This is a link to the site: www.10elearning.com
  16. Hello!I'm working on a portfolio on XML languages and want to include some thoughts of users about those languages such as RSS,SVG, SMIL and so on. Are there any websites I can read upon opinions related to those topics. Maybe some thought about the how those languages will do in the future. Thank you!
  17. Hi,I tried the following code but can not get the result of textLength and lengthAdjust. Why? I created the SVG file and opened it with the browser (explorer, firefoz, chrome) but I get the same result. <?xml version="1.0" encoding="UTF-8" ?><svg version="1.1" xmlns="http://www.w3.org/2000/svg"><g style="font-size: 14pt;"> <path d="M 20 10 20 70 M 220 10 220 70" style="stroke: gray;"/> <text x="20" y="30" textLength="200" lengthAdjust="spacing">Two words</text> <text x="20" y="60" textLength="200" lengthAdjust="spacingAndGlyphs">Two words</text> <text x="20" y="90">Two words <tspan style="font-size: 10pt;">(normal length)</tspan></text> <path d="M 20 100 20 170 M 100 100 100 170" style="stroke: gray;"/> <text x="20" y="120" textLength="80" lengthAdjust="spacing">Two words</text> <text x="20" y="160" textLength="80" lengthAdjust="spacingAndGlyphs">Two words</text></g> </svg> Thanks
×
×
  • Create New...