Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

SVG can do that?

slides.com

Post reply on HN
Print view View original

101–110 of 202 posts

Re: SVG can do that?

#101

Post by bryanrasmussen »

polymeris wrote: post #28

SVG works so fantastically well with React -- it's just part of the DOM, after all. Unless there are performance concerns, that reason alone would make me choose it over Canvas every time. Shameless plug, one of my first experiments with SVG+react (+cljs): https://polymeris.github.io/carlos/ Done in one day, without knowing the tech.

I would say not fantastically - it is part of the DOM, but it is 1. XML - so namespaces? 2. SVG has it's own DOM - it builds on an extends the HTML DOM but React only understands the HTML DOM.

But I could also say these were minor quibbles.

Re: SVG can do that?

#103

Post by jansho »

anilgulecha wrote: post #93
Tajnymag wrote: post #90

Earlier quoted context omitted.

Inkscape does have such a feature too. While importing a bitmap image, you can specifically "convert" it to vector graphic. Works fairly well.

I love and use Inkscape exclusively for any SVG editing, but this particular feature in Inkscape is woefully under anything I've seen vector magic provides.

The trick is to make sure the raster image is as clean as possible. But yeah I agree, this is not its best feature.

Re: SVG can do that?

#104

Post by aidos »

vbuwivbiu wrote: post #96
aidos wrote: post #92

Earlier quoted context omitted.

(Edit moved to here from the wrong thread) This comes up on each SVG thread and I post the same comment each time (so excuse me if you've heard this from me before). We render SVG that contain beyond 100k nodes in the browser and find that it works fine. You need to be careful with your manipulations and we've developed a couple of tricks to keep things snappy, but the final experience is great. Here's a demo of it i…

that's not 100k unique elements though, it's 100k instances of a set of isn't it ?

No, in our case they're all unique elements - unfortunately for me! That demo example is actually much smaller though (2k nodes).

Here's an example with over 150k nodes [1]. To be honest, we would normally doctor documents that had this many nodes to make the experience smoother for users. You'll notice that it's a bit sluggish when you zoom in and out, but panning is the same speed regardless of number of elements, and updating elements within the document is fast too.

[1] https://www.dropbox.com/s/xf89s2txvp9jb3k/Big%20SVG%20%28150...

Re: SVG can do that?

#105

Post by jansho »

dnautics wrote: post #47
ben-schaaf wrote: post #34

Earlier quoted context omitted.

Inkscape is what I always use for editing static SVGs. Not using it enough to become familiar with it myself, the interface is usually intuitive enough for me to guess my way to success.

My biggest gripe with inkscape is that it suffers from some sort of floating point precision error, when you do certain copy/paste/transformation operations it mercilessly outputs more digits of significance than are necessary, which bloats the text and peeves off someone who must obsessively keep their ml clean

And also the output png is sometimes unpredictable. I hate it when what's supposed to be flat-coloured in svg turns out to be this 'pixelated-swirl' in png. I also find minimising operations can reduce this effect.

Re: SVG can do that?

#106

Post by ygra »

baybal2 wrote: post #19

It has been almost 12 years, and we still don't have working word wrap with svg

We have it specified by now at least with SVG 2, but browser vendors have made it clear that they don want to support it at all, presumably because SVG 1.1 works well enough as a vector image format and more complexity and features could just be added by scripting. It felt a lot like browser vendors don't care about SVG at all beyond the extent that it's implemented at the moment.

They also tend to break non-static SVG things all the time which further suggests that things like applications or animations built with SVG are definitely not a use case they cater for (or that those things are simply very rare on the top 500 sites they test).

Re: SVG can do that?

#107

Post by sAbakumoff »

k_sh wrote: post #91
sAbakumoff wrote: post #63

Earlier quoted context omitted.

>>offers immediate responsiveness does it? Any examples of responsive grid system on SVG? What would be interesting.

I think GP was referring to the fact that you don't need to generate SVG assets at multiple sizes for size/picture clarity balance, as you do with popular raster formats.

But GP was asking : "Why the lack of love while we pour ever increasing energy into mangling HTML and CSS"

SVG can't be, shouldn't be and never will be the replacement for HTML/CSS/JS.

Re: SVG can do that?

#108

Post by b0rsuk »

Flash has the "advantage" that it's used almost exclusively for advertisments. Mostly pretentious people (artists, photographers etc) have websites made of flash. So, by turning off Flash, you block the bulk of annoying ads. And you lose little by disabling Flash.

Would the same be true for SVG ? Would it be used mostly for ads, too ? Or even, can you selectively block only the SVG used for advertisments ?

Re: SVG can do that?

#109

Post by Vinnl »

polymeris wrote: post #28

SVG works so fantastically well with React -- it's just part of the DOM, after all. Unless there are performance concerns, that reason alone would make me choose it over Canvas every time. Shameless plug, one of my first experiments with SVG+react (+cljs): https://polymeris.github.io/carlos/ Done in one day, without knowing the tech.

That's actually what got me into React as well - I was initially going to try my hands at a then-alpha of Angular 2, but it couldn't work with SVG. I then decided that React would be nice to try for a hobby project, and there we are: https://agripongit.vincenttunru.com/

Re: SVG can do that?

#110

Post by vog »

marcus_holmes wrote: post #59
polymeris wrote: post #28

SVG works so fantastically well with React -- it's just part of the DOM, after all. Unless there are performance concerns, that reason alone would make me choose it over Canvas every time. Shameless plug, one of my first experiments with SVG+react (+cljs): https://polymeris.github.io/carlos/ Done in one day, without knowing the tech.

When I started learning React, I realised a dream of mine could finally come true: a proper Celtic Knotwork generator. Uses SVG and React together in harmony. http://celtic-knotwork.online

Pardon my ignorance, but aren't these patterns just composed of certain tiles in rows and columns? This is something you can do equally well with raster graphics, so what's the gain of using SVG here?
Post reply on HN