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

Tutorial 1: How to Set Up FLDraw on Your Local Web Server

This tutorial shows you how to set up FLDraw on your local web server.

Assume that you have IIS and PHP installed on your computer,

  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\script.
  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. Copy the test folder to your default website home directory (LocalDisk:\Inetpub\wwwroot).

    Make sure that you have the following directory structure:

    • wwwroot
      • 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 address of the editor.html page (http://localhost/test/main/editor.html ), and then press Enter.

Note
Make sure the test folder has the necessary permissions for running scripts and saving plan files.