Results 1 to 5 of 5

Thread: Building a tilemap (JS, PHP, MYSQL, AJAX)

  1. #1
    Join Date
    May 2010

    Question Building a tilemap (JS, PHP, MYSQL, AJAX)

    Hey i'm trying to create a map for a game. I didn't know where to put this as this thread will handle HTML, CSS, JS, PHP, MYSQL and AJAX.

    My experience, (just to show how much i can or can't do)
    HTML and CSS : I know a lot about these languages.
    PHP, MySql : I wrote the whole item database for my game, currently you can buy/sell items, put them in your backpack or stash, equip them, sort them by amount, name, type etc. this was a lot of repeating code and theres is still a lot to learn for me.
    JS: i did a couple of tutorial and wrote a script to move an object around in a div.... thats pretty much it
    AJAX: i just finished my first tutorial about how to work with JS, PHP and AJAX to sent and get a query from a DB.

    So i have set up a testing database to run some tests on how to get this to work for me. The end result for this test should make the map rebuild with AJAX after the player moves a square. There is not much info about how to exactly do this with HTML, Javascript, PHP, mysql and AJAX so i'd like to open this thread in the hopes i am able to pull this off with some help. If i (we ) pull this off i will post all the code needed for this small testing environment so everyone can learn from it. After that i can get on with my bigger project that needs a map like this. Off course if there is a comprehensive tutorial about how to do this i'd be glad to read that .

    So i started making a query to get the tiles i need to draw in an array. Then with a foreach loop i can generate divs with the corresponding options and picture.

    The current problem is, the query i got here just returns the tileID of the current position. I expect the query to give me 9 values (the current tile the player is on and all the tiles next to him (a 3x3 grid)). It's probably something very simple i just can't think of atm .

    PHP Code:
    $xpos 3//this variable should get feeded by a $_GET or $_POST or something.
    $ypos 3//this variable should get feeded by a $_GET or $_POST or something.

    //build query
    $mapquery mysql_query ("
                (xpos BETWEEN '
    $xpos - 1' AND '$xpos + 1')
                (ypos BETWEEN '
    $ypos - 1' AND '$ypos + 1')
    ) or die (mysql_error());

    $mapgen mysql_fetch_assoc($mapquery);

    print_r ($mapgen);  //this only gives me the tile i'm currently on ->   Array ( [tileID] => 2 ) 
    I have build my table "world" like this:
    systemID -> not really used yet as there is just 1 system.
    orderID -> dunno if i really need this one as i could probably order my table from the xpos and ypos.
    tileID -> refers to the primary key of the table where i store my tiles.

    I have filled this table with 25 rows to represent a 5x5 grid. where all the outer tiles are 3 (water) the middle tile (3,3) is 2 (desert) and the rest are 1 (grass).

  2. #2
    Join Date
    May 2010
    I figured the query probably overwrites mapgen[tileID] therefor it just returns 1 value. If i do a num_rows it actually returns 9 so thats good.

    Is there a mysql function that avoids rows being overwritten? or do i have to make a function that puts the data into a array?

  3. #3
    Join Date
    Jan 2009
    Something like:
    PHP Code:
    while($row mysql_fetch_assoc($result)){
    //each row will be populated one by one

    What you had before was only fetching the first row. As an alternative you could adjust your query to return a single row with the nine values populated.

  4. #4
    Join Date
    May 2010
    Yeah i should have looped trough my query to give each result a different ID.

    I got this now:
    PHP Code:
    $mapquery mysql_query ("
                (xpos BETWEEN 
    $xpos - 1 AND $xpos + 1)
                (ypos BETWEEN 
    $ypos - 1 AND $ypos + 1)
    ) or die (mysql_error());

    $mapgen = array();
    while (
    $row mysql_fetch_object($mapquery)) {
    $mapgen[] = $row->tileID

  5. #5
    Join Date
    May 2010
    Now how to get this array data into my HTML file to load the 9 tiles into my map container with AJAX? I'm hoping to learn this today. I'm not sure if i should somehow pass this PHP array to my html file and create a JS loop that generates the tile divs in my map container div OR make the loop in PHP and put that directly into the map container div in the HTML file.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
HTML5 Development Center



X vBulletin 4.2.2 Debug Information

  • Page Generation 0.10635 seconds
  • Memory Usage 2,886KB
  • Queries Executed 13 (?)
More Information
Template Usage (33):
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_global_above_footer
  • (1)ad_global_below_navbar
  • (1)ad_global_header1
  • (1)ad_global_header2
  • (1)ad_navbar_below
  • (1)ad_showthread_firstpost_sig
  • (1)ad_showthread_firstpost_start
  • (1)ad_thread_first_post_content
  • (1)ad_thread_last_post_content
  • (3)bbcode_php
  • (1)footer
  • (1)forumjump
  • (1)forumrules
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (1)headinclude_bottom
  • (5)memberaction_dropdown
  • (1)navbar
  • (4)navbar_link
  • (1)navbar_moderation
  • (1)navbar_noticebit
  • (1)navbar_tabs
  • (2)option
  • (5)postbit
  • (5)postbit_onlinestatus
  • (5)postbit_wrapper
  • (1)spacer_close
  • (1)spacer_open
  • (1)tagbit_wrapper 

Phrase Groups Available (6):
  • global
  • inlinemod
  • postbit
  • posting
  • reputationlevel
  • showthread
Included Files (26):
  • ./showthread.php
  • ./global.php
  • ./includes/class_bootstrap.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/functions_navigation.php
  • ./includes/class_friendly_url.php
  • ./includes/class_hook.php
  • ./includes/class_bootstrap_framework.php
  • ./vb/vb.php
  • ./vb/phrase.php
  • ./includes/functions_facebook.php
  • ./includes/functions_calendar.php
  • ./includes/functions_bigthree.php
  • ./includes/class_postbit.php
  • ./includes/class_bbcode.php
  • ./includes/functions_reputation.php
  • ./includes/functions_notice.php
  • ./packages/vbattach/attach.php
  • ./vb/types.php
  • ./vb/cache.php
  • ./vb/cache/db.php
  • ./vb/cache/observer/db.php
  • ./vb/cache/observer.php 

Hooks Called (71):
  • init_startup
  • friendlyurl_resolve_class
  • 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_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • load_show_variables
  • load_forum_show_variables
  • global_state_check
  • global_bootstrap_complete
  • global_start
  • style_fetch
  • global_setup_complete
  • showthread_start
  • showthread_getinfo
  • strip_bbcode
  • friendlyurl_clean_fragment
  • friendlyurl_geturl
  • forumjump
  • cache_templates
  • cache_templates_process
  • template_register_var
  • template_render_output
  • fetch_template_start
  • fetch_template_complete
  • parse_templates
  • fetch_musername
  • notices_check_start
  • notices_noticebit
  • process_templates_complete
  • friendlyurl_redirect_canonical
  • showthread_post_start
  • showthread_query_postids
  • showthread_query
  • bbcode_fetch_tags
  • bbcode_create
  • showthread_postbit_create
  • postbit_factory
  • postbit_display_start
  • postbit_imicons
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • postbit_display_complete
  • memberaction_dropdown
  • tag_fetchbit
  • tag_fetchbit_complete
  • forumrules
  • navbits
  • navbits_complete
  • build_navigation_data
  • build_navigation_array
  • check_navigation_permission
  • process_navigation_links_start
  • process_navigation_links_complete
  • set_navigation_menu_element
  • build_navigation_menudata
  • build_navigation_listdata
  • build_navigation_list
  • set_navigation_tab_main
  • set_navigation_tab_fallback
  • navigation_tab_complete
  • fb_like_button
  • showthread_complete
  • page_templates