[Chameleon] HTML Legend with Javascript

Paul Spencer pagameba at magma.ca
Sat Sep 25 23:33:57 EDT 2004


Robin,
I just tried this:


legend template file:

[leg_layer_html order=ascending opt_flag=15]
</div>
<div id="[leg_layer_name]">
<input type="checkbox" name="legendlayername[]"
value="[leg_layer_name]"
     [if name=layer_status oper=eq  value=1]CHECKED[/if]
     [if name=layer_status oper=eq value=2]CHECKED[/if]><a 
href="javascript:void(0)" 
onclick="toggleLayer('[leg_layer_name]_class')">[leg_layer_name]</a>
</div>
<div id="[leg_layer_name]_class" style='display:none'>
[/leg_layer_html]
[leg_class_html]
<img src="[leg_icon width=20 height=18]" width="20" 
height="20">[leg_class_name]<br>
[/leg_class_html]


in chameleon template:

<script language="JavaScript" type="text/JavaScript">
function toggleLayer( szName )
{
     var layer = CWCDHTML_GetLayer( szName );

     if (layer.display == 'block')
         layer.display = 'none';
     else
         layer.display = 'block';
}
</script>
<div>
   <cwc2 type="LegendTemplate" visible="true" embedded="true" 
template="fancy_legend.html" popupstyleresource="TextButtons" 
popupwidth="500" popupheight="400" status="false" menubar="false"/>
</div>

this displays each layer with a checkbox and a clickable layer name. 
Clicking the layer name expands the class list below the layer.

I would assume you could extend this to support groups of layers too.

Cheers,

Paul

Robin Brown wrote:
> Thanks Paul.  I wasn't sure if it was even possible.  Now that I know it is, is there
> anyone out there that has done this?  I am very new to Javascript (just did a tutorial
> last week).  I got the divisions in but I'm not sure how to make them expand/collapse
> when they are clicked on. I tried to write a script in the template but that seems to
> throw an error. Any  examples or suggestions are welcome.  Thanks again.
> 
> Robin
> Quoting Paul Spencer <pagameba at magma.ca>:
> 
> 
>>Robin,
>>
>>the XML Theme Legend doesn't display classes. It is intended more for 
>>use with OGC layers (WMS) which don't have that level of information 
>>available.  I may extend it in the future but not right now.
>>
>>So your only resource now is to use the html legend template.  It should 
>>be relatively easy (if you know dhtml/css/javascript) to make expandable 
>>sections in a legend template file.  For instance, you can place layer 
>>names and classes into separate div elements in the template and use 
>>javascript to set the display to block or none to show/hide the classes. 
>>  Similarly you can use groups to do the same thing for layers.
>>
>>Cheers,
>>
>>Paul
>>
>>Robin Brown wrote:
>>
>>>Hi all,
>>>
>>>I am using an html legend template and I have a question.  Is there a way to make
>>
>>this
>>
>>>legend more dynamic?  I would like let the user expand and collapse the groups as
>>
>>my
>>
>>>legend is rather large.  I have tried doing this using the XML Theme legend but I
>>
>>want
>>
>>>to show layers as well as classes in my legend and I couldn't see how to do that
>>
>>with
>>
>>>the XML.  If anyone knows how to show layers and classes with XML this would also
>>
>>be
>>
>>>helpful since I think I may be able to get expanding and collapsing using this
>>
>>method. 
>>
>>>BTW, I do know that by only placing one layer in each group with xml you get the
>>
>>look
>>
>>>of layers displaying in the legend, but I haven't seen any solution for classes.
>>>
>>>Thanks for any help you can give!
>>>
>>>Robin Brown
>>
>>-- 
>>  -----------------------------------------------------------------
>>|Paul Spencer                           pspencer at dmsolutions.ca   |
>>|-----------------------------------------------------------------|
>>|Applications & Software Development                              |
>>|DM Solutions Group Inc                 http://www.dmsolutions.ca/|
>>  -----------------------------------------------------------------
>>
>>
> 
> 
> 

-- 
  -----------------------------------------------------------------
|Paul Spencer                           pspencer at dmsolutions.ca   |
|-----------------------------------------------------------------|
|Applications & Software Development                              |
|DM Solutions Group Inc                 http://www.dmsolutions.ca/|
  -----------------------------------------------------------------



More information about the Chameleon mailing list