Hacker News new | ask | show | jobs
by v8engine 2276 days ago
Can someone please tell me what the name for the technology used to create the graphics is? The text for the place names over the image is highlightable.

I know you can handcraft these by having the text overlay over an exact X,Y on an image but that seems overblown for just these maps than having the text rastered into the image loaded.

So, is there some tool like an SVG creator that helps create these with the responsiveness and everything handled?
1 comments
wffurr 2276 days ago
There's some interesting HTML comments in the source.

"ai2html" sounds like the source is Adobe Illustrator and probably refers to this tool: https://github.com/newsdev/ai2html

Not sure what "freebird" is, some internal software. I can't find much about it with Google search.

    <!-- data processed in process/freebird/process-graphic.js -->
    <!-- asset wrapper : start -->
    <!-- ASSET : START -->
    <div class="g-asset g-graphic" style="max-width: 945px">
    <!-- Intro elements -->
    <!-- inner graphic element -->
    <!-- print .html file -->
    <!-- Generated by ai2html v0.100.0 - 2020-03-22 00:19 -->
    <!-- ai file: maps_la.ai -->
    <!-- preview: 2020-03-19-coronavirus-us-cities-shutdown -->
    <!-- scoop: coronavirus-usa-traffic -->
link
v8engine 2276 days ago
Yup. ai2html seems to what I was looking for. Didn't spot that because of all the freebird comments.

As for freebird, my search led me to this. https://github.com/freebirdjs/freebird

Seems to be the NYT has an array of pollution sensor IOT across the cities and they are using Freebird to control them. Just my guess.

link