# Random generator - Dice Roll with HTML5 canvas

• 11-07-2013, 09:05 AM
007Julien
Random generator - Dice Roll with HTML5 canvas
Hello

What better than a dice to generate random numbers ?

However, it is not very easy to roll a dice even with HTML5 canvas !
Here is an essay which roll with drag and drop or touch and move...

But before trying to roll it like a real Dice, I'd like to solve the problem of its shape which appears with a coloured background (see this page).

Thank you for any comments or proposals.
• 11-10-2013, 04:57 PM
007Julien
Without perspective effect, It's possible to draw something that roll and look like a dice !

Next step, with perspective no more ellipses but many points...
• 11-10-2013, 05:00 PM
bionoid
If you wrote that code, then I am very impressed.
Unfortunately I am no good at 3D mathematics, or more advanced graphics in that case, to be of any help.

I will eagerly watch your progress though.

Good luck.
• 11-10-2013, 06:25 PM
007Julien
Thanks ! I wrote effectively that code...
Its' not very complicated to rotate a cube in space (see the source of 2x2x2 cube).

This Fascinating page give me the idea of this mini Rubik's cube. I intended to propose to solve each position (It's possible with 2x2x2 - See this page ) but it's to heavy with the canvas rolling cube.

My project is now simply to roll a dice... I discover now that Dices are not only cubes, but at first spheres...

EDIT : Opera and safari do not appreciate my last script.
• 11-11-2013, 05:50 PM
007Julien
• 08-07-2015, 10:32 PM
kamrul000
Great job
Quote:

Originally Posted by 007Julien

That looks really great. I am creating a Ludo game where I need a dice. Haven't done much 2D/3D coding myself. I will take your's as an example.

Cheers
• 04-18-2016, 03:31 AM
amanwas
How can I know which numbers are facing up?
Can anyone please tell me how to know which numbers are facing up?
• 04-18-2016, 03:32 AM
amanwas
How can I know which numbers are facing up after rolling is ended?
• 04-19-2016, 02:23 PM
DaveyErwin
Quote:

Originally Posted by amanwas
How can I know which numbers are facing up after rolling is ended?

1. determine the results of the roll
2. display the animated roll
3. display the die with
the pre determined
results.
• 05-23-2017, 04:44 PM
Lagwert
That looks great but is too difficult to upgrade by me. Who know and upgrade this code that first program set random number from 1 to 6 show this number in F12 console and next the dice animate roll and stop on this number.
• 05-23-2017, 05:10 PM
Lagwert

## X vBulletin 4.2.2 Debug Information

• Page Generation 0.11575 seconds
• Memory Usage 2,370KB
• Queries Executed 11 (?)
Template Usage (20):
• (2)bbcode_quote_printable
• (1)footer
• (1)gobutton
• (1)navbar_moderation
• (1)navbar_noticebit
• (2)option
• (1)spacer_close
• (1)spacer_open

Phrase Groups Available (3):
• global
• postbit
Included Files (19):
• ./global.php
• ./includes/class_bootstrap.php
• ./includes/init.php
• ./includes/class_core.php
• ./includes/config.php
• ./includes/functions.php
• ./includes/class_friendly_url.php
• ./includes/class_hook.php
• ./includes/class_bootstrap_framework.php
• ./vb/vb.php
• ./vb/phrase.php
• ./includes/functions_calendar.php
• ./includes/class_bbcode_alt.php
• ./includes/class_bbcode.php
• ./includes/functions_bigthree.php
• ./includes/functions_notice.php

Hooks Called (41):
• init_startup
• init_startup_session_setup_start
• database_pre_fetch_array
• database_post_fetch_array
• init_startup_session_setup_complete
• global_bootstrap_init_start
• global_bootstrap_init_complete
• cache_permissions
• fetch_foruminfo
• global_state_check
• global_bootstrap_complete
• global_start
• style_fetch
• global_setup_complete
• bbcode_fetch_tags
• bbcode_create
• bbcode_parse_start
• bbcode_parse_complete_precache
• bbcode_parse_complete
• cache_templates
• cache_templates_process
• template_register_var
• template_render_output
• fetch_template_start
• fetch_template_complete
• parse_templates
• notices_check_start
• notices_noticebit
• friendlyurl_resolve_class
• friendlyurl_clean_fragment
• friendlyurl_geturl
• process_templates_complete