2022 Developer Survey is open! Take survey.

Questions tagged [svg]

Scalable Vector Graphics (SVG) is an XML-based two-dimensional vector graphics format that can also be used in HTML. Do not add this tag just because your project uses SVG. Instead, add the tag if your question is either about SVG, or closely related to it, like how to achieve something with SVG.

Filter by
Sorted by
Tagged with
0 votes
0 answers
3 views

Cannot update a pie chart in d3 using on click button

So, I am trying to understand how to replace a pie chart with a different set of data with a button click. I am facing the issue that it just creates a new one when I click on the button instead of ...
user avatar
0 votes
0 answers
11 views

How to set pattern origin at the top left point of each bar of a barchart in d3.js?

I created a barchart and used patterns to fill it. For each pattern, I set x=0 and y=0, but I don't know where this (0,0) point is, so I don't know my pattern start tiling from where . I want to set ...
user avatar
  • 25
0 votes
1 answer
16 views

Dynamically and Accurately Replace HTML span with SVG text with correct positioning

I would like to replace a regular HTML span with the same text but in SVG format. I have seen examples of this, but it seems like the positioning is just manually entered in the examples, i.e. x=10 ...
user avatar
  • 913
1 vote
0 answers
8 views

Problem with duplicate SVG in multiple pages and z-indexing

I am loading an SVG text effect into a couple of pages and I have the problem of multiple SVGs now loading into the header - I understand why but not how to fix it. I am putting the SVG markup into ...
user avatar
  • 21
-4 votes
0 answers
17 views

How is this effect created? [closed]

The effect where you hover over the portrait images and a circle mask reveals the second image. https://artistsweb.co.uk/ I first thought it was three.js with a displacement effect but there is no ...
user avatar
0 votes
0 answers
34 views

Firefox 100: CSS 3D Transform rotateY(180deg) and SVG not playing well together

This may be a browser-bug relating to how Firefox Desktop 100.0.2. handles SVG and CSS Transforms. Or else I'm doing something wrong to bring about this undesired effect. I have a <button> ...
user avatar
0 votes
0 answers
9 views

SVG.js: How to set up animation but play it later (dynamically, e.g. on button click)?

I'm working with the SVG.js API for the first time. I'd like to set up an animation (i.e. define what shape to animate and how to animate it/what parameters to animate) but trigger/play it at an ...
user avatar
  • 713
2 votes
1 answer
33 views

How to create a staggered square tiling pattern in svg?

I want to fill a rectangle space with a repeating image pattern. The images are arranged in a staggered square tiling. Two adjacent rows are staggered in the x-direction by half the width of the side ...
user avatar
  • 25
0 votes
0 answers
23 views

How to convert scaling from SVG units to pixels using scale formula?

Previously, I asked how to obtain the real coordinates (d) of a path when a transformation is applied, finally I decided to investigate the transformation formulas, I have already seen the translation,...
user avatar
  • 123
0 votes
0 answers
18 views

How can I fill SVG template using Spring Boot?

I have an Image taken from https://github.com/fredericojordan/progress-bar/blob/master/templates/progress.svg, How can I edit it and in addition fill it with params I get from API (controller mapping) ...
user avatar
  • 916
0 votes
1 answer
19 views

SVG cuts off circle

I have such code: <svg width="100" height="100"> <circle cx="50" cy="50" r="50" stroke="green" stroke='1' stroke-width="1" fill='yellow'/> </svg> in result i get cutted ...
user avatar
  • 75
0 votes
1 answer
29 views

How to reference an inline svg <view>?

I suspect that what I'm trying to do is either impossible, because I'm thinking about the problem wrong, or trivial but impossible to Google because of the word "view" in relation to an ...
user avatar
0 votes
0 answers
9 views

How to export UV map in SVG format in Blender but only outlines

I have this UV map from my 3d object. Now I want to export it to SVG format but I just need outlines/borders as SVG not all polylines. Is it possible in Blender to export as SVG just outlines/borders ...
user avatar
  • 1,327
1 vote
1 answer
30 views

Transition effect between two states of svg polygon on hover

function menuHover(navLI, Y) { const topTriangle = navLI.querySelector(".triangle").querySelector("polygon"); topTriangle.setAttribute("points", "0,0 200,0 100," + Y); } function navHoverIn(...
user avatar
  • 11
3 votes
2 answers
59 views

SVG continuous inwards square spiral animation with pure CSS/JS

I need some help with this kinda specific animation. It is a square spiral pattern that keeps going inwards until it's fully complete. I somewhat did manage to get it going but I don't know how to ...
user avatar

15 30 50 per page
1
2 3 4 5
2738