English

How To: Enable Auto Refresh layer visibility in HTML Viewer

Summary

Instructions provided describe how to enable auto refresh of the map image when the layers are checked on or off for visibility in the HTML Viewer layer list(Table of contents).

Procedure

Follow the steps below.

  1. Navigate to the HTML Viewer Web site folder and open 'toc.htm' file in any text editor.
  2. Locate the following lines of code

    Code:
    document.write('<input type="Checkbox" name="LayerVisible" value="' + i + '"');
    if (t.LayerVisible[i] == 1) document.write(' checked');
    document.writeln(' ></td>');

    Modify the above code to:

    Code:
    document.write('<input type="Checkbox" name="LayerVisible" value="' + i + '"');
    if (t.LayerVisible[i] == 1) document.write(' checked');
    //**** new line added here ****
    document.writeln(' onclick="javascript:updateLayers()" ');
    document.writeln(' ></td>');


    Note:
    Step 1 and 2 enables auto refresh of layers based on check box value. Indicate to the user that Auto Refresh is enabled and may be remove the 'Refresh Map' button shown in the layer list. Optional Steps 3 and 4 shows how to modify the HTML Viewer to add these features.

  3. Optionally, display the text: 'Auto Refresh Enabled'

    In the same file find the following lines of code:

    Code:

    document.writeln(' </TD>');
    document.writeln('</TR>');

    </SCRIPT>
    </TABLE>


    Modify the above code to

    Code:

    document.writeln(' </TD>');
    document.writeln('</TR>');

    //**** new code start *******
    document.writeln('<TR>');
    document.writeln(' <TD ALIGN="center" COLSPAN="3">');
    document.writeln('<font size="-1" color="blue"><b>Auto Refresh Enabled</b></font>');
    document.writeln(' </TD>');
    document.writeln('</TR>');
    //**** new code end *********

    </SCRIPT>
    </TABLE>

  4. Optionally, remove the 'Refresh Map' button.

    In the same file find the following lines of code:

    Code:

    document.writeln(' <INPUT TYPE="button" style="background-color: #FFFFE7;" NAME="refreshButton" VALUE="' + t.buttonList[44] + '" onClick="updateLayers()">');


    Comment the above line of code

    Code:

    //***** commented out to remove the refresh button ********
    //document.writeln(' <INPUT TYPE="button" style="background-color: #FFFFE7;" NAME="refreshButton" VALUE="' + t.buttonList[44] + '" onClick="updateLayers()">');