Diagram tool

j0elpark

Registered
Hello,

I'm not really on here much but I just made this to diagram shots, and if anyone finds it useful, feel free to use it: http://www.joelpark.net/billiards/
You can draw anywhere inside the black box around the table.

You can use the bottom and left rails as X and Y coordinates for the ball positions with each diamond being 10. I'm afraid the controls on the bottom are the only way to move the balls. This is my first time working with HTML canvas, so it's got its quirks.

It should work with most modern browsers. It works on the iPad, which is what I will use it on.
 

pacemonster

"Billiard" Mike
Silver Member
Joel.....great job. One thought tho.....is there a way to make/keep the lines straight when drawing? That might be very useful. Also a way to make lines dashed/dotted would be good too. Overall.....I will find it very useful. Thanks again
 

j0elpark

Registered
I figured out how to draw non-dotted lines and updated the page, since that's what I wanted originally. I think it's better than the dotted lines. I don't think I can make it draw straight lines and have it still work on the touchscreen, though. I did make it smooth out the lines a bit.

I'll work on it some more today and keep updating it. I welcome any more feedback, as long as I can actually figure out how to implement the changes.
 

j0elpark

Registered
I got the straight lines and moving the balls around figured out.
I also added another page for aiming diagrams.
 

Jerseychris

AzB Silver Member
Silver Member
Super......could use directional indicator on lines and cue tip point of contact indicator on cue ball.
 
Last edited:

zensteve

AzB Silver Member
Silver Member
http://data:image/png;base64,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
 

Attachments

  • Steve's shot.txt
    2 KB · Views: 99
Last edited:

j0elpark

Registered
Sorry, should have mentioned. When you download the image file, rename it with ".png" at the end. Let me know if that works. I'll see if there's a better way to do that.

I'll also see if I can make an arrow appear at the end of the line.

If you click on the "aiming" button on the bottom you can create another diagram with english and thickness.

Here's another project I'm working on:
http://www.joelpark.net/billiards/tracklines.html

Click anywhere to show lines and double click to move. If on touchscreen, you can just move the ball with your finger.
 
Last edited:

j0elpark

Registered
I don't know about Windows, but I just noticed that at least on Safari for Mac, if you right click on the image and choose "Save image as," it adds the .png extension automatically.

Not so with Chrome, though. You have to add it manually.
 

zensteve

AzB Silver Member
Silver Member
Please verify what you see. My cache may be misleading me. When you click on my pdf file do you see the diagram I created?
 

j0elpark

Registered
I do not. The best way to go about saving the image is to click the "Save as image" button (which should open a new window or tab with the image), and in the new window that opens, right click on the image and save it to your computer. Then rename the file to "something.png"

Or in the new window with the image, you can just go to File->Save As and save it as "something.png"

If on an iPad or other iOS device, you can just tap and hold on the image and be able to save it.

I've attached a diagram as an example to show what you should end up with.
 

Attachments

  • test.png
    test.png
    34.7 KB · Views: 337
Last edited:

pacemonster

"Billiard" Mike
Silver Member
j0el.....awesome!!!!! Now we all have a useful tool to diagram shot variations. KUDOs to you sir.
 

n_den

Take It Down!
Silver Member
too bad, its still very useful. thought i play with the tool. made this shot this afternoon during a match. n_den

attachment.php
 
Last edited:

j0elpark

Registered
Hi,

I didn't think anyone was still using this, but good to see people are still finding it useful. I just made a couple changes that may make it easier to save a screenshot.
 
Last edited:

n_den

Take It Down!
Silver Member
attachment.php


ah, now it works.

hey thanks j0elpark! n_den
 

Attachments

  • n_den_12022018.jpg
    n_den_12022018.jpg
    96.6 KB · Views: 132
Last edited:
Top