Live data from Hacker News

Stately - A US state map in a font

intridea.github.com

21–30 of 30 posts

Re: Stately - A US state map in a font

#23
post #20

What about old fashioned https://developer.mozilla.org/en-US/docs/HTML/Element/map and area tag? They are built specifically for this.

That can be a huge mess, though, if you need to do a lot of dynamic color changing of specific states and/or groups of states.

Re: Stately - A US state map in a font

#24

You'll all regret adding -ly to anything eventually. Still really awesome, can't wait to see the rest of the world.

Does Flickr regret dropping a vowel in its name? There have been lots of naming trends and they don't seem to have had much effect on long-term success. What's wrong with -ly?

I think the general case is that it might have been innovative for one name, but the rest sound derivative, unoriginal, repetitive, derivative, unoriginal and repetitive. And many abuse the Lybian TLD.

Re: Stately - A US state map in a font

#25

You'll all regret adding -ly to anything eventually. Still really awesome, can't wait to see the rest of the world.

Does Flickr regret dropping a vowel in its name? There have been lots of naming trends and they don't seem to have had much effect on long-term success. What's wrong with -ly?

It's not a bad thing at all. Flickr works because it is still pronounced Flicker. Personally anything with -ly irks me the wrong way and it feels like a branding cop-out at times. Just imagine if Google was called Searchly or if Basecamp was named Managely. From a branding perspective in 5-10 years time adding -ly will look dated. You'll think back to web 2.0 as if you were looking at a geocities page (or worse Homestead). Not to say this project should be aware of its branding at all.

I have to say Improvely looks solid by the way.

Re: Stately - A US state map in a font

#26
post #5
post #2

I like the idea of styling a map properly with CSS. I love the sheer WTF factor. The fact we're seeing fonts (ab)used in this manner (and for icon fonts) says that we're sorely missing a good technical solution.

Amazing indeed. So what is this font abuse really getting at? It's a means to introduce semantic information into vector graphics. Defining the semantics of a state, its shape and name, allows us to treat the state as an abstraction that can have formatting applied to it. So how did web fonts end up as the approach? Because that's where browsers first acquired the notion of confluencing semantics and vector graphics.…

I'm not sure if I'm missing something in the question, but SVG plays very nicely with CSS. I frequently download SVG map files from Wikipedia, add new, more suitable, IDs to the relevant elements, and then add a CSS section at the top for shading individual countries or regions or whatever.

The complex part is usually simply working out which country/region/whatever corresponds to which in the first place; but this is a complaint more about the quality of the markup of the underlying SVG of an average map on Wikipedia, than about SVG itself.

Re: Stately - A US state map in a font

#27
post #17

I love the idea, but they've made an odd choice in the way they've styled the page: I can't scroll down to read all the text. Page scrolling is jerky and the text disappears for me before I reach the bottom of the text. I had to inspect the page source to finish reading "How does it work?"

What browser/OS? Working fine on Chrome stable/Mac 10.8

I was also using chrome stable, Mac OS 10.8. The left column doesn't disappear when I scroll down in Firefox (although also much more jumpy than I'm used to). But, I guess it seems to only affect me. I do have a retina display and they are using javascript to serve me retina images, which might have something to do with it.

Re: Stately - A US state map in a font

#28
post #11
post #8

Hm, why can't this be done with simply using SVG instead of using fonts in such manner?

It can, but not every browser supports SVG sadly. :( This however, works in IE8

Surely it's relatively easy to convert SVG to, say, .jpg on the fly, though, no?

Re: Stately - A US state map in a font

#29
post #5

Earlier quoted context omitted.

Amazing indeed. So what is this font abuse really getting at? It's a means to introduce semantic information into vector graphics. Defining the semantics of a state, its shape and name, allows us to treat the state as an abstraction that can have formatting applied to it. So how did web fonts end up as the approach? Because that's where browsers first acquired the notion of confluencing semantics and vector graphics.…

I'm not sure if I'm missing something in the question, but SVG plays very nicely with CSS. I frequently download SVG map files from Wikipedia, add new, more suitable, IDs to the relevant elements, and then add a CSS section at the top for shading individual countries or regions or whatever. The complex part is usually simply working out which country/region/whatever corresponds to which in the first place; but this i…

Great info. The missing part is educating web developers that this is even possible. The thought that SVG can accept CSS styles never occurred to me until this thread and your answer. And I can hardly be the only such ill-informed web developer in the world.

So we do have a good technical solution for what this submission is doing with the web font, as the top post asks. SVG with CSS would be a more proper way of expressing a styleable vectorized map of states. (But the web font is still an exceedingly clever hack, and grabs attention in a way that a boring old SVG tutorial wouldn't.)

Re: Stately - A US state map in a font

#30
post #29

Earlier quoted context omitted.

I'm not sure if I'm missing something in the question, but SVG plays very nicely with CSS. I frequently download SVG map files from Wikipedia, add new, more suitable, IDs to the relevant elements, and then add a CSS section at the top for shading individual countries or regions or whatever. The complex part is usually simply working out which country/region/whatever corresponds to which in the first place; but this i…

Great info. The missing part is educating web developers that this is even possible. The thought that SVG can accept CSS styles never occurred to me until this thread and your answer. And I can hardly be the only such ill-informed web developer in the world. So we do have a good technical solution for what this submission is doing with the web font, as the top post asks. SVG with CSS would be a more proper way of exp…

Yes. For an example, compare the underlying XML of http://globestroller.com/maps/US_48.svg with the original at http://upload.wikimedia.org/wikipedia/commons/e/e9/Blank_US_...

In the original the states already had IDs (except, for some reason, Virginia), so it was simply a matter of moving the inline styling to a CSS section at the top.

The CSS can also be in a different file, which could be dynamically generated for different users if you wanted to build a simple "make a pretty map of which states you've visisted" app.

Post reply on HN