Sign in to follow this  

SVG Sliding Tile Puzzle

This topic is 4233 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

If you intended to correct an error in the post then please contact us.

Recommended Posts

Here's a simple interactive SVG demonstration, a sliding tile puzzle: http://members.optusnet.com.au/khsoh/000e.xhtml The initial coding was straightforward and quick. Only when I wanted to make the demonstration work in MSIE6 and ASV3 did I run into trouble. The first problem was that ASV3 did not process events for SVG elements if the SVG code was inline XHTML, so onclick didn't work. The workaround was to put all the SVG code in a separate .svg file and get the user to open that file. The second problem was that MSIE6 (or ASV3) did not accept a function reference as the first argument to the setTimeout() function, unlike Firefox and Opera. That stumped me for about half an hour until I found an example that used a string as the first argument. When I tested the program on another Windows XP computer using MSIE6 + ASV3, it works without needing to open the SVG file in another window. It must be some setting on my notebook that stopped it working.

Share this post


Link to post
Share on other sites
Simple and clean. SVG is quite powerful!

If there is something I would have done different it is the shuffeling. Currently it shuffles the '1' rarely, because of the algorithm.

I know there is some easy way of determing if one of these kinds of boards are solvable (it has to do with sums of rows and columns in some way). You could just create the board randomly, until you get a solvable version. If you place the numbers randomly, it's 50% chance it is solvable.

Share this post


Link to post
Share on other sites
Quote:
Original post by Enselic
Simple and clean. SVG is quite powerful!

If there is something I would have done different it is the shuffeling. Currently it shuffles the '1' rarely, because of the algorithm.

I know there is some easy way of determing if one of these kinds of boards are solvable (it has to do with sums of rows and columns in some way). You could just create the board randomly, until you get a solvable version. If you place the numbers randomly, it's 50% chance it is solvable.


I'm still experimenting with SVG to see how far I can take it. So far, the limitation have been my knowledge and time.

Thanks for the inspiration! I found Kevin Gong's Analysis of the Sixteen Puzzle. I just skimmed his essay, but it looks like there's a simple way to determine if a particular configuration is solvable or not.

Share this post


Link to post
Share on other sites
Minor updates:

1. Added buttons to allow player to create a different sized puzzle: 3x3 and 4x4.
2. Added routine to generate random solvable (in theory) puzzles.

Share this post


Link to post
Share on other sites
Sign in to follow this