<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:w="urn:schemas-microsoft-com:office:word" xmlns:st1="urn:schemas-microsoft-com:office:smarttags" xmlns="http://www.w3.org/TR/REC-html40">
<head>
<meta http-equiv=Content-Type content="text/html; charset=us-ascii">
<meta name=Generator content="Microsoft Word 11 (filtered medium)">
<!--[if !mso]>
<style>
v\:* {behavior:url(#default#VML);}
o\:* {behavior:url(#default#VML);}
w\:* {behavior:url(#default#VML);}
.shape {behavior:url(#default#VML);}
</style>
<![endif]--><o:SmartTagType
namespaceuri="urn:schemas-microsoft-com:office:smarttags" name="State"/>
<o:SmartTagType namespaceuri="urn:schemas-microsoft-com:office:smarttags"
name="place"/>
<!--[if !mso]>
<style>
st1\:*{behavior:url(#default#ieooui) }
</style>
<![endif]-->
<style>
<!--
/* Font Definitions */
@font-face
{font-family:Tahoma;
panose-1:2 11 6 4 3 5 4 4 2 4;}
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
{margin:0in;
margin-bottom:.0001pt;
font-size:12.0pt;
font-family:"Times New Roman";
color:black;}
a:link, span.MsoHyperlink
{color:blue;
text-decoration:underline;}
a:visited, span.MsoHyperlinkFollowed
{color:blue;
text-decoration:underline;}
pre
{margin:0in;
margin-bottom:.0001pt;
font-size:10.0pt;
font-family:"Courier New";
color:black;}
span.EmailStyle17
{mso-style-type:personal;
font-family:Arial;
color:navy;}
span.EmailStyle19
{mso-style-type:personal-reply;
font-family:Arial;
color:navy;}
@page Section1
{size:8.5in 11.0in;
margin:1.0in 1.25in 1.0in 1.25in;}
div.Section1
{page:Section1;}
-->
</style>
<!--[if gte mso 9]><xml>
<o:shapedefaults v:ext="edit" spidmax="1026" />
</xml><![endif]--><!--[if gte mso 9]><xml>
<o:shapelayout v:ext="edit">
<o:idmap v:ext="edit" data="1" />
</o:shapelayout></xml><![endif]-->
</head>
<body bgcolor=white lang=EN-US link=blue vlink=blue>
<div class=Section1>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>I use a DataView(ExtJS) in the left
panel(where the current observations are) and handle the click event from it. I
then lookup what observation was clicked, go grab the time series out from my
jsonstore for that obs and add that series to the graph. I’ve just
started playing with the Highcharts stuff the past couple of days. It’s a
cool little package, the wrapper for ExtJS is still buggy but the guy continues
to work on it. At first I was thinking of using the Google visualization, but I
don’t like the fact you can’t host the javascript file yourself. <o:p></o:p></span></font></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'><o:p> </o:p></span></font></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>What I wanted to do with this incarnation
is make every buoy an object. They are driven via a geoJSON file that I then
take and create a GeoExt.vectorStore out of.<o:p></o:p></span></font></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'><o:p> </o:p></span></font></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>I’m happy to share whatever I’ve
done. <o:p></o:p></span></font></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'><o:p> </o:p></span></font></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>Dan<o:p></o:p></span></font></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'><o:p> </o:p></span></font></p>
<div>
<div class=MsoNormal align=center style='text-align:center'><font size=3
color=black face="Times New Roman"><span style='font-size:12.0pt;color:windowtext'>
<hr size=2 width="100%" align=center tabindex=-1>
</span></font></div>
<p class=MsoNormal><b><font size=2 color=black face=Tahoma><span
style='font-size:10.0pt;font-family:Tahoma;color:windowtext;font-weight:bold'>From:</span></font></b><font
size=2 color=black face=Tahoma><span style='font-size:10.0pt;font-family:Tahoma;
color:windowtext'> Ryan Williams [mailto:rwilliams@paqinteractive.com] <br>
<b><span style='font-weight:bold'>Sent:</span></b> Friday, October 22, 2010
11:08 AM<br>
<b><span style='font-weight:bold'>To:</span></b> users@geoext.org;
dan@inlet.geol.sc.edu<br>
<b><span style='font-weight:bold'>Subject:</span></b> Re: [Users]
Transparencyslider on rightclick</span></font><font color=black><span
style='color:windowtext'><o:p></o:p></span></font></p>
</div>
<p class=MsoNormal><font size=3 color=black face="Times New Roman"><span
style='font-size:12.0pt'><o:p> </o:p></span></font></p>
<p class=MsoNormal><font size=3 color=black face="Times New Roman"><span
style='font-size:12.0pt'>Hey Dan, nice map. looks like an interesting project.
I really, really - really- like the way the buoy information works inside
the popup window - with the charts changing based on what you hover over. Is
that all part of the highcharts package or is that something you did custom? <br>
Nice.<br>
<br>
Ryan<br>
<br>
On 10/22/2010 9:21 AM, Dan Ramage wrote: <o:p></o:p></span></font></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>Here: <a
href="http://rcoos.org/carolinasrcoosrev2/secoora_interactive_tst.html"
moz-do-not-send=true>http://rcoos.org/carolinasrcoosrev2/secoora_interactive_tst.html</a>
is my testing site.<u1:p></u1:p></span></font><o:p></o:p></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>The main javascript is here: <a
href="http://rcoos.org/carolinasrcoosrev2/lib/secoora_interactive_tst.js"
moz-do-not-send=true>http://rcoos.org/carolinasrcoosrev2/lib/secoora_interactive_tst.js</a>,
but most of the code dealing with the tree is here:<u1:p></u1:p></span></font><o:p></o:p></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'><a
href="http://rcoos.org/carolinasrcoosrev2/lib/olMap1.0.js"
moz-do-not-send=true>http://rcoos.org/carolinasrcoosrev2/lib/olMap1.0.js</a><u1:p></u1:p></span></font><o:p></o:p></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'><u1:p> </u1:p></span></font><o:p></o:p></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'> The slider is here: <a
href="http://rcoos.org/carolinasrcoosrev2/lib/GeoExt-1.0/lib/GeoExt/widgets/tree/LayerOpacitySliderPlugin.js"
moz-do-not-send=true>http://rcoos.org/carolinasrcoosrev2/lib/GeoExt-1.0/lib/GeoExt/widgets/tree/LayerOpacitySliderPlugin.js</a><u1:p></u1:p></span></font><o:p></o:p></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>The mixin to make it work is here:</span></font>
<font size=2 face=Arial><span style='font-size:10.0pt;font-family:Arial'><a
href="http://rcoos.org/carolinasrcoosrev2/lib/GeoExt-1.0/lib/GeoExt/widgets/tree/TreeNodeUIEventMixinExtended.js">http://rcoos.org/carolinasrcoosrev2/lib/GeoExt-1.0/lib/GeoExt/widgets/tree/TreeNodeUIEventMixinExtended.js</a><u1:p></u1:p></span></font><o:p></o:p></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>For my mixin, I basically just copied the
base one, I couldn’t seem to get the Ext.extend() working and
didn’t want to spend a lot of time on that just yet.<u1:p></u1:p></span></font><o:p></o:p></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'><u1:p> </u1:p></span></font><o:p></o:p></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>When I create my layers I have a couple of
hash tags I add in the options parameter to specify whether I want the slider
or not.<u1:p></u1:p></span></font><o:p></o:p></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>In the olMap1.0.js, at the very top is my
GeoExt.tree.layerLoaderExtended where I make sure only the tree nodes that have
the option set to have a slider get them. If I didn’t do this, every
layer in that layercontainer node would have a slider.<u1:p></u1:p></span></font><o:p></o:p></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'><u1:p> </u1:p></span></font><o:p></o:p></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>In the LayerOpacitySliderPlugin.js, the
onRenderNode is where most of the work gets done. I used the
RadioButtonPlugin.js as a guide on how to go about doing this. I used the
Ext.Slider() widget.<u1:p></u1:p></span></font><o:p></o:p></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'><u1:p> </u1:p></span></font><o:p></o:p></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>This was a big learning experience for me,
I am still not anywhere as knowledgeable about javascript as I would like.<u1:p></u1:p></span></font><o:p></o:p></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'><u1:p> </u1:p></span></font><o:p></o:p></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'><u1:p> </u1:p></span></font><o:p></o:p></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>Dan<u1:p></u1:p></span></font><o:p></o:p></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'><u1:p> </u1:p></span></font><o:p></o:p></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'><u1:p> </u1:p></span></font><o:p></o:p></p>
<div>
<div class=MsoNormal align=center style='text-align:center'><font size=3
color=black face="Times New Roman"><span style='font-size:12.0pt'>
<hr size=2 width="100%" align=center tabindex=-1>
</span></font></div>
<p class=MsoNormal><b><font size=2 color=black face=Tahoma><span
style='font-size:10.0pt;font-family:Tahoma;font-weight:bold'>From:</span></font></b><font
size=2 face=Tahoma><span style='font-size:10.0pt;font-family:Tahoma'> Viggo
Lunde [<a href="mailto:viggo.lunde@gmail.com">mailto:viggo.lunde@gmail.com</a>]
<br>
<b><span style='font-weight:bold'>Sent:</span></b> Friday, October 22, 2010
8:21 AM<br>
<b><span style='font-weight:bold'>To:</span></b> Dan Ramage<br>
<b><span style='font-weight:bold'>Subject:</span></b> Re: [Users]
Transparencyslider on rightclick</span></font><u1:p></u1:p><o:p></o:p></p>
</div>
<p class=MsoNormal><font size=3 color=black face="Times New Roman"><span
style='font-size:12.0pt'><u1:p> </u1:p><o:p></o:p></span></font></p>
<p class=MsoNormal><font size=3 color=black face="Times New Roman"><span
style='font-size:12.0pt'>Sure, do you have example-code or a description<u1:p></u1:p><o:p></o:p></span></font></p>
<div>
<p class=MsoNormal style='margin-bottom:12.0pt'><font size=3 color=black
face="Times New Roman"><span style='font-size:12.0pt'>Viggo <u1:p></u1:p><o:p></o:p></span></font></p>
<div>
<p class=MsoNormal><font size=3 color=black face="Times New Roman"><span
style='font-size:12.0pt'>2010/10/22 Dan Ramage <<a
href="mailto:dan@inlet.geol.sc.edu" moz-do-not-send=true>dan@inlet.geol.sc.edu</a>><u1:p></u1:p><o:p></o:p></span></font></p>
<div link=blue vlink=purple>
<div>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>I implement a slider in the layer tree.
Not sure if that is helpful or not.</span></font><u1:p></u1:p><o:p></o:p></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'> </span></font><u1:p></u1:p><o:p></o:p></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>Dan</span></font><u1:p></u1:p><o:p></o:p></p>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'> </span></font><u1:p></u1:p><o:p></o:p></p>
<div>
<div class=MsoNormal align=center style='text-align:center'><font size=3
color=black face="Times New Roman"><span style='font-size:12.0pt'>
<hr size=2 width="100%" align=center>
</span></font></div>
<p class=MsoNormal><b><font size=2 color=black face=Tahoma><span
style='font-size:10.0pt;font-family:Tahoma;font-weight:bold'>From:</span></font></b><font
size=2 face=Tahoma><span style='font-size:10.0pt;font-family:Tahoma'> <a
href="mailto:users-bounces@geoext.org" target="_blank" moz-do-not-send=true>users-bounces@geoext.org</a>
[mailto:<a href="mailto:users-bounces@geoext.org" target="_blank"
moz-do-not-send=true>users-bounces@geoext.org</a>] <b><span style='font-weight:
bold'>On Behalf Of </span></b>Viggo Lunde<br>
<b><span style='font-weight:bold'>Sent:</span></b> Friday, October 22, 2010
2:38 AM<br>
<b><span style='font-weight:bold'>To:</span></b> <a
href="mailto:users@geoext.org" target="_blank" moz-do-not-send=true>users@geoext.org</a><br>
<b><span style='font-weight:bold'>Subject:</span></b> [Users] Transparencyslider
on rightclick</span></font><u1:p></u1:p><o:p></o:p></p>
</div>
<div>
<div>
<p class=MsoNormal><font size=3 color=black face="Times New Roman"><span
style='font-size:12.0pt'> <u1:p></u1:p><o:p></o:p></span></font></p>
<p class=MsoNormal><font size=3 color=black face="Times New Roman"><span
style='font-size:12.0pt'>Hi<u1:p></u1:p><o:p></o:p></span></font></p>
<div>
<p class=MsoNormal><font size=3 color=black face="Times New Roman"><span
style='font-size:12.0pt'>Nice, then we have the min/max scale. <u1:p></u1:p><o:p></o:p></span></font></p>
</div>
<div>
<p class=MsoNormal><font size=3 color=black face="Times New Roman"><span
style='font-size:12.0pt'>Is there anyone who implemented the transparencyslider
on rightclick as vell?<u1:p></u1:p><o:p></o:p></span></font></p>
</div>
<div>
<p class=MsoNormal><font size=3 color=black face="Times New Roman"><span
style='font-size:12.0pt'>Looking forward to get rid of MapFish in the client.<u1:p></u1:p><o:p></o:p></span></font></p>
</div>
<div>
<p class=MsoNormal><font size=3 color=black face="Times New Roman"><span
style='font-size:12.0pt'> <u1:p></u1:p><o:p></o:p></span></font></p>
</div>
<div>
<p class=MsoNormal><font size=3 color=black face="Times New Roman"><span
style='font-size:12.0pt'>Viggo Lunde<u1:p></u1:p><o:p></o:p></span></font></p>
</div>
<div>
<p class=MsoNormal><font size=3 color=black face="Times New Roman"><span
style='font-size:12.0pt'> <u1:p></u1:p><o:p></o:p></span></font></p>
</div>
</div>
</div>
</div>
</div>
</div>
<p class=MsoNormal><font size=3 color=black face="Times New Roman"><span
style='font-size:12.0pt'><u1:p> </u1:p><o:p></o:p></span></font></p>
</div>
<pre wrap=""><font size=2 color=black face="Courier New"><span
style='font-size:10.0pt'><o:p> </o:p></span></font></pre><pre><fieldset class="mimeAttachmentHeader"></fieldset><font
size=2 color=black face="Courier New"><span style='font-size:10.0pt'><o:p> </o:p></span></font></pre><pre><font
size=2 color=black face="Courier New"><span style='font-size:10.0pt'>_______________________________________________<o:p></o:p></span></font></pre><pre><font
size=2 color=black face="Courier New"><span style='font-size:10.0pt'>Users mailing list<o:p></o:p></span></font></pre><pre><font
size=2 color=black face="Courier New"><span style='font-size:10.0pt'><a
href="mailto:Users@geoext.org">Users@geoext.org</a><o:p></o:p></span></font></pre><pre><font
size=2 color=black face="Courier New"><span style='font-size:10.0pt'><a
href="http://www.geoext.org/cgi-bin/mailman/listinfo/users">http://www.geoext.org/cgi-bin/mailman/listinfo/users</a><o:p></o:p></span></font></pre><pre><font
size=2 color=black face="Courier New"><span style='font-size:10.0pt'> <o:p></o:p></span></font></pre>
<p class=MsoNormal><font size=3 color=black face="Times New Roman"><span
style='font-size:12.0pt'><br>
<br>
<o:p></o:p></span></font></p>
<pre><font size=2 color=black face="Courier New"><span style='font-size:10.0pt'>-- <o:p></o:p></span></font></pre><pre><font
size=2 color=black face="Courier New"><span style='font-size:10.0pt'>Ryan Williams, GISP<o:p></o:p></span></font></pre><pre><font
size=2 color=black face="Courier New"><span style='font-size:10.0pt'>GIS Analyst / Programmer<o:p></o:p></span></font></pre><pre><font
size=2 color=black face="Courier New"><span style='font-size:10.0pt'>PAQ Interactive Inc.<o:p></o:p></span></font></pre><pre><st1:State
w:st="on"><st1:place w:st="on"><font size=2 color=black face="Courier New"><span
style='font-size:10.0pt'>Monticello</span></font></st1:place></st1:State>, IL <o:p></o:p></pre></div>
</body>
</html>