Create HTML5-Based Mobile-Friendly Interactive Images and Maps
FLDraw Interactive Floor Plan Software  >  Developer Guide  >  Tutorial 2

Tutorial 2: How to Set Up FLDraw on Your Website

This tutorial shows you how to set up FLDraw on your website.
  1. Unzip the package into a folder on your hard disk.
  2. Create a new folder on your hard disk, and name it test, it's your working folder.
  3. Locate the main and objects folders in the plugin/files folder, and copy them to the test folder.
  4. Locate the editor.html and viewer.html files in the plugin/samples/client_side/simplest_method folder, and copy them to test/main.
  5. Create a new folder inside the test folder, and name it plans.
  6. Create a new folder inside the test folder, and name it script.
  7. Locate the file.php file in the plugin/samples/server_side/php folder, and copy it to test/scrip.
  8. Open the test/main/config.xml file in a text editor,
    then modify the value of the objects_folder tag to point to the objects folder,
    (<objects_folder>../objects/</objects_folder>)
    and modify the value of the list_script, load_script, and save_script tags to point to file.php,
    ( <list_script>../script/file.php?v=[p]</list_script>
    <load_script>../script/file.php?v=[p]</load_script>
    <save_script>../script/file.php?v=[p]</save_script>
    )
    and save the config file.
     
  9. Upload the test folder to the root folder of your website.

    Make sure that you have the following directory structure:

    • website
      • test
        • script
          • file.php
        • main
          • editor.html
          • viewer.html
          • editor.swf
          • viewer.swf
          • config.xml
          • library.xml
        • objects
          • 101.swf
          • 102.swf
          • ...
        • plans
 

Open your browser and enter the URL of the editor.html page (http://YOUR WEBSITE/test/main/editor.html ), and then press Enter.

Note
Make sure that you have Read and Executable permissions for the test folder, and Write permission for the plans folder.