Most voted "svg" questions
SVG (Scalable Vector Graphics) is a two-dimensional vector graphics format based on XML.
Learn more…168 questions
Sort by count of
-
2
votes1
answer803
viewsSvg is not rendered, the browser downloads the file in iis
When accessing the site that contains a svg image, it does not appear but the browser downloads the image and in the debug console appears the following message: Resource Interpreted as Document but…
-
2
votes2
answers784
viewsHow to implement an SVG?
Well, the SVG is very important to the web, since it’s vector and I can resize it at will. It is an image format written in xml and is one of the image standards for web. But, when I try to…
-
2
votes1
answer114
viewsClick link highlight SVG
I’m learning to deal with SVG, My doubt and the following, I have 10 balls in SVG and 10 links. My idea and click on a link and highlight a ball taking the highlight of other.
-
2
votes1
answer449
viewsHow to create an element in SVG dynamically?
I want to use a variable number and create multiple identical SVG objects. Just change their position and name in Javascript. As in the loop for exemplified in the pseudo-code: for(i=0;…
-
2
votes1
answer413
viewsMove graphic SVG objects
I want to draw up a graph where I can move the dots (circle) of a Javascript line. When moving the object circle, the line is always glued to the circle. I want to play the genre of this: That is,…
-
2
votes2
answers64
viewsClone of an image
I have the code that moves SVG images with the mouse. When I move the image, as soon as it is released, I want your clone to appear, in the position that the first one started and that it is also…
-
2
votes1
answer161
viewsHTML table in SVG
It will be possible to create an HTML table inside the tag <svg>? I have an example, but I can’t see the objects. Example: http://jsfiddle.net/XmC2A/18/…
-
2
votes1
answer205
viewsChange SVG object color with animation
Using the animateColor tag, I wanted to change the color of an SVG object. Example jsfiddle but it doesn’t work: <svg width="500" height="650" > <rect ry=5 rx=0 x=150 y=100 width=90…
-
2
votes1
answer380
viewsReturn to TEXT SVG line
I’m creating a text svg dynamically, and I want to return the middle line of the two variables when printing. I experimented with the " n" and the "br" but it doesn’t make me. var text_h_fin =…
-
2
votes1
answer1235
viewsHow to effect "Hover" in SVG icon?
How do I make an effect :hover on an SVG icon? Example: <!DOCTYPE html> <html> <head> <title></title> <style type="text/css"> .agenda { fill: cyan; }…
-
2
votes1
answer515
viewsProblem with svg background
I’m studying a little bit about svg And I found the giant shapes on the sites amazing, but I’m having a really hard time reproducing correctly. I created a 693x768 shape that will cut a page, but I…
-
2
votes1
answer687
views -
2
votes1
answer71
viewsSprite in SVG for Internet explorer
I read an article that explained how to put several SVG images in a single file. The final file looked like this: <?xml version="1.0" encoding="UTF-8"?> <svg version="1.1"…
-
2
votes2
answers110
viewsUse a function several times
I created a function that creates a certain clock. The goal is to use the function to reuse several times by changing the position parameters x and y. I use the function setInterval to update every…
-
2
votes1
answer71
viewsRegulation of svg
I’m looking for new effects to improve my portfolio. I really liked that effect, but there’s one mistake I couldn’t adjust. Height cuts when you do the Hover. After a lot of searching, I was able to…
-
2
votes1
answer51
viewsKeep clicked part of an SVG using CSS
I would like the following: Click on one of the segments, and it gets painted. My idea was to use only CSS, so I was wondering if there’s anything like hover to do it for me. My SVG is as follows:…
-
2
votes1
answer1845
viewsSVG image does not appear
I’m trying to upload an SVG image as background but it doesn’t appear. When I’m in the live preview of VS Code it works normally, but when I open index.html directly from the browser it just doesn’t…
-
2
votes1
answer169
viewsanimation wave effect in SVG string
I am making an animation SVG and to be complete, is only missing the animation of the string .wrapper { background: #364254; width: 100%; height: 100%; } <div class="wrapper"> <svg…
-
2
votes1
answer45
viewsHow do I make the user not paint the svg line on a site to color the same
Hello, I’m making a system for children to color a drawing made with SVG format, but when the child colored the drawing it can also color the line and the background. Would it be possible to disable…
-
2
votes2
answers157
viewsIcon SVG created with Inkscape is not properly imported
With Inkscape app, I’m trying to create my own custom SVG icons and then import them to Android Studio. On import to Android Studio I get the following error message ERROR@ line 29 <defs> is…
-
2
votes1
answer339
viewsHelp to understand SVG coordinates and sizing
I’m trying to set an icone.svg in the system and something went wrong: the icon does not appear on the screen... I think it might be the coordinate system. I’m having doubts about how to resize the…
svgasked 7 years, 10 months ago Lucas Trino 87 -
2
votes1
answer276
viewsI can’t set a vector image as an app icon
As you can see I’ve correctly added a svg. so that it acts in a vector way: The problem happens when I try to put it as app icon: I go to Androidmanifest.xml and normally modify the line…
-
2
votes0
answers59
viewsGet X and Y of <g> with ID even when zooming in
I have a map of Brazil with several <g> svg. Each element of this is a municipality. I need to take the X and Y of this element in relation to the div that svg is in. The biggest problem is…
-
2
votes2
answers48
viewsIcon svg does not occupy 100% of the area in svg tag
I’m having trouble with one of my icons in svg, it doesn’t occupy 100% of width and height tag svg and this ends up disturbing me in some alignments with texts and other icons. Follows the code:…
svgasked 7 years, 7 months ago user27585 -
2
votes0
answers151
viewsHow to put CSS correctly in a rendered SVG in the view via the use tag?
I’m using Angularjs to load an element, but it doesn’t take CSS. A View: <svg version="1.1" id="body_1" data-name="body-1" xmlns="http://www.w3.org/2000/svg"…
-
2
votes3
answers827
viewsIs it possible to insert an SVG as value into an input tag?
I have the button below and what I want is that instead of the name "Go", I can use an image, be it in SVG or even something from Font Awesome. How to proceed in that case? From now on, thank you!…
-
2
votes0
answers123
viewsColoring a SVG with JS
I inserted several buttons in a form, each one has the function of changing the color of the same SVG files, however I tried to make this change via css and did not work, I think I will need a js to…
-
2
votes1
answer2534
viewsBackground with gradient and undulations
I wonder if it is possible to create the image effect below using CSS. Make the gradient is quiet, but I’m having trouble making the ripples. #teste { width: 100%; height: 300px; background-image:…
-
2
votes2
answers3057
viewsHow to use svg images?
I don’t understand and I can’t even use images svg in a web application. I downloaded the image https://svgur.com/i/8NF.svg and put it in the <img src="8NF.svg" class="logo"/>, but she doesn’t…
svgasked 6 years, 2 months ago Paulo Dos Santos 376 -
2
votes1
answer1195
viewsCentralize elements of an SVG
Hi, I have a <g> within an SVG and would like to center its content, basically it would be like this: +-----------------+ x-----------------+ | X | | | | | | | | | | | | | ----> | x | | | |…
-
2
votes2
answers89
viewsHover mouse does not work in the circular calendar cells in SVG
I would like to ask for help again, I’m having a hard time running Hover (CSS) on my SVG. It is a circular calendar with 31 days, divided into three shifts (each layer is a turn). When hovering over…
-
2
votes1
answer110
viewsHover on SVG on my page does not answer
I am trying to create a circle with several divisions in SVG, and each section when passing the mouse, I would like the background color to change. However the code I’m trying to use isn’t working.…
-
2
votes1
answer95
viewsIncomplete SVG only in Chrome
I’m doing animations with SVG, using CSS. In Firefox works perfectly with Stroke + Fill gradient, in Edge it just ignores the gradient and in Chromefica everything right, however, it does not…
-
2
votes1
answer96
viewsHow to change the color of an SVG dynamically with props in React?
I’m trying to change the color of an SVG through props, but I’m not getting it. My component Hexagon that in which I receive the color via props and check with a switch: function Hexagon({ size,…
-
1
votes1
answer176
viewsMeasure distance between SVG polygon points
I created a SVG very simple with a triangle. <svg class="triangulo" height="210" width="500"> <polygon points="200,10 250,190 160,210" style="fill:lime;stroke:purple;stroke-width:1" />…
-
1
votes1
answer179
viewsProblem in SVG image. Event mouseenter(), Mousemove() and mouseleave()
I have a SVG image with the States of the Country and I need that when passing the mouse over a State, the image with the name of the State appears and follow the mouse. I’ve already made the image…
-
1
votes1
answer311
viewsAdd SVG object inside a dynamic div
I have an SVG element created from a clone. I wanted to insert this clone into a new div. I used this code. function clone(){ var newrect = document.getElementById('rect').cloneNode(true);…
-
1
votes1
answer82
viewsZoom and drag settings in SVG area
I’m trying to make a system creates a graph of a mathematical function, and I’m developing it into svg. But I’m encountering some difficulties, the first of which is the lack of automation, because…
-
1
votes3
answers1682
viewsGantt chart using C3.js: How to use Axis Y Category or Y timeseries?
I am looking for a solution within the javascript library C3.JS (Based on D3.JS) where I can create a graph that shows over a period the types of certain thing being used and intercalated. A small…
-
1
votes1
answer133
viewsIdentify SVG elements
I have this code to dynamically create SVG elements through a for, and a step number, which is the number of elements that will be created.(default equals 10). I add an id to each element. I would…
-
1
votes0
answers90
viewsUse viewBox in SVG
I used SVG to create objects. The problem is that when changing the window, the SVG is cut, I can only see a part. I want to use viewBox to show all the SVG depending on the window or image…
-
1
votes1
answer441
viewsIdentify the positions of objects
I have two images that I move, and I keep their position x and y in an array. I create a clone of each image, and when I stop moving (onmouseup) I save its position. I give the same id to each…
-
1
votes1
answer49
viewsSVG image conversion in Ruby on Rails
I have an application in Rails and there I generate SVG images to return to the user by email, but I want to return this in another format (png or jpg). Does anyone have any tips on how I can do…
-
1
votes1
answer88
viewsSvg contained in DIV does not follow "max-height: 100%"
Take the example of the structure first. .follow-window-size-container { height: 100vh; background-color: green; } container-of-svg { max-height: 100%; } container-of-svg svg { max-height: 100%; }…
-
1
votes2
answers90
viewsZoom in out mousedown
I have a SVG image, as I can create a small zoom (enlarge the image) when I step over with the mouse, and go back to its size when it came out? I have the example: http://jsfiddle.net/twsthyds/37/…
-
1
votes1
answer1049
viewsHow to jump line in tooltip?
Hello, I’m trying to put balloons with information on my SVG map (when I hover over the map the information appears), however, when I try to put information like city and phone the information line…
-
1
votes0
answers932
viewsPHP - Generating dynamic Qrcode customized with PHP
I am trying to generate Qrcode with dynamic information with the library Phpqrcode, Qrcode I’ve been able to generate in SVG, but I’m not being able to style it to have rounded edges and the company…
-
1
votes2
answers171
viewsSVG, Canvas or CSS? Need to network with interlinked images
Well, that’s it. I thought about using SVG and image with borders but my concern is about responsiveness, in smaller devices will get all messy I wanted a way for the lines to automatically connect…
-
1
votes1
answer345
viewsMap in SVG in Wordpress
I cannot insert the map(link below) in Wordpress. When I put the code on the page, the states are lined up as attached: Can someone help me? Tks Follow code (I didn’t post integer in the snippet…
-
1
votes1
answer104
viewsCenter svg inside a <rect> element
Good morning, I have the following code <?xml version="1.0" encoding="utf-8"?> <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"…