[HN Gopher] Pablo is a small, open-source JavaScript library for...
___________________________________________________________________
Pablo is a small, open-source JavaScript library for SVG
Author : EntICOnc
Score : 135 points
Date : 2021-11-20 12:44 UTC (10 hours ago)
(HTM) web link (pablojs.com)
(TXT) w3m dump (pablojs.com)
| AndrewSwift wrote:
| I wonder if we can use it with Svija (https://svija.love).
|
| We've been building all-SVG websites for six years, and the big
| hurdle has always been the complexity of creating simple SVG
| content.
|
| For complex content we use Adobe Illustrator, but for
| documentation etc., we've not yet found a good solution.
|
| I'm on my phone, but I can't wait to check it out on my computer.
| [deleted]
| sigg3 wrote:
| That's a great idea.
|
| Do you support Inkscape?
| AndrewSwift wrote:
| We don't right but now we're considering adding it.
|
| If you know it well I'd like to ask you a few questions --
| andrew@svija.love
| bobbylarrybobby wrote:
| I've been working on a project that makes creating SVGs -- with
| all assets embedded -- as simple as possible.
| https://github.com/rben01/collagen
| coldtea wrote:
| How does it compare to Snap.svg? I haven't used it much either,
| but I've used its precursor Raphael and it was great.
| [deleted]
| p4bl0 wrote:
| No I am not ;).
|
| Nice work (and very nice name -- although know that Picasso was
| actually an asshole). The slides are a very nice addition to the
| landing pages, I think the link to them should be emphasized
| more: http://slides.pablojs.com/.
| coldtea wrote:
| > _although know that Picasso was actually an asshole_
|
| Well, as opposed to who of us? The main difference being that
| we know of his private life...
| etc-hosts wrote:
| its a reference to the Modern Lovers song "Pablo Picasso" (I
| think)
| Levitz wrote:
| Well I'd say most of us aren't "dating a 17 year old while
| 45" kind of questionable.
| coldtea wrote:
| It wasn't that questionable in 20th century Paris, much
| less to artistic and bohemian circles...
|
| They weren't exactly about puritan prudery and bourgeois
| morality...
|
| Not to mention that "I disaprove of him dating a 17th year
| old when he was 45" to "asshole" is quite a long way...
| p4bl0 wrote:
| That's a good point. I'm not _at all_ saying "#NotAllMen".
|
| But not all projects are named after someone, or have a
| reference to that someone on their front page (here, a
| quote).
| marcellus23 wrote:
| Where does #NotAllMen fit in?
| bryanrasmussen wrote:
| Everybody knows that Pablo Picasso was never called an asshole
| https://www.youtube.com/watch?v=k43XjuhInkU
| ratww wrote:
| At least not in New York.
| pohl wrote:
| I love the cover of this song on the Repo Man soundtrack
| ratww wrote:
| The David Bowie version is pretty cool too.
| is_true wrote:
| What did he do?
| adolph wrote:
| It is possible to appreciate art without tedious pro-forma
| denunciations of the artist's behavior? At some point a
| creator's name is less about a historical person or apocryphal
| personage than the collective value found in artifacts and
| ideas.
| bovermyer wrote:
| I'm always interested in projects like this, since my Iron
| Arachne project dynamically builds several types of image with
| SVG and I currently rely on xmlbuilder2 as my primary method of
| creation.
|
| To see the results, here are two pieces of the site that use SVG:
|
| https://ironarachne.com/#/starsystem - the planet and star images
| are SVG
|
| https://ironarachne.com/#/heraldry - the coat of arms is SVG
|
| It's kind of painful to work with xmlbuilder2 for these things,
| though. I've been considering moving away from SVG and just using
| pure WebGL for all generated images.
|
| Pablo looks like it's meant as an animation library more than
| anything else; the commentary about Flash drives home that point
| for me. I don't think it would help me, at least not at a glance.
| jitl wrote:
| I would use React or a similar library with
| renderToStaticMarkup to produce SVG, because the JSX syntax
| basically gives you an XML literal. You can compose XML
| expression and write functions that take and return XML
| fragments. Those features significantly reduced the XML/HTML
| boilerplate for a document export system I migrated to
| React/JSX. The big annoyance is that it requires a build step
| to transform the JSX into regular JS, but if you're using
| Typescript already (I was) then it's a single flag to enable.
|
| Or go WebGL. That also sounds like a fun learning project.
| SquareWheel wrote:
| It's rare to see JS libraries releasing on bower nowadays. Is
| there any particular reason that was chosen over NPM?
| alvarlagerlof wrote:
| I think this is an old library
| SquareWheel wrote:
| Yes, looks like it hasn't received an update in quite some
| time.
|
| https://github.com/premasagar/pablo
| rcarmo wrote:
| Cute, but the demo appears to be completely broken on an iPad.
| chiefalchemist wrote:
| I had an issue on Android Firefox with the first demo but the
| other two were ok.
| jancsika wrote:
| Does the DOM's animate method play well with SVGs yet? E.g., can
| you feed it an array of path data and have it do the animation
| over a specified duration?
|
| Edit: assume I'm giving path data with the same commands and
| number of points.
| joshuanapoli wrote:
| When would dynamically generated SVG be preferable to using an
| html canvas?
| intrasight wrote:
| when you want vector instead of raster
| picardo wrote:
| This is just a DOM manipulation library, with some animation
| support thrown in. It's doing the same stuff that you can do with
| a few D3 libraries: d3.selection + d3.transition.
| jasonlaster11 wrote:
| Here's a replay of the rocket demo if others are curious how it
| works.
|
| https://app.replay.io/recording/3cc35235-0a00-4fff-a1eb-7ffa...
|
| https://www.loom.com/share/059d3d0770db447a8287c05bf269b476
| chiefalchemist wrote:
| Nice. A few more examples would help. Also, some of us (read:
| less and less) remember Flash. But there are plenty who probably
| heard of it but never full experienced, or felt the pains it
| created. So yeah, more examples would be great.
|
| P.s. Did I miss it? How many KB is the min?
| city41 wrote:
| Pablo looks to be about 8 years old. I thought it must be when it
| mentioned installing it with Bower. Not a criticism or anything,
| just pointing it out.
| dym_sh wrote:
| yeah, it's not a new one.
|
| today Svelte would be the #1 pick for part-SVG full-page
| infographics with transitions and animations
| ttiurani wrote:
| I've heard Svelte being promoted for SVG animations before
| too, but I haven't understood why. Is there some benefit
| Svelte specifically has here opposed to React/Vue/etc?
| deergomoo wrote:
| Svelte comes with a bunch of animation related things out
| of the box, whereas with Vue or React you're going to be
| implementing that stuff yourself or seeking out a third
| party library.
___________________________________________________________________
(page generated 2021-11-20 23:01 UTC)