nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Gradient effect when turn on/off layers

XintaoLiu

Is it possible to implement the gradient effect when turn on/off a layer by using ArcGIS API for flex? Thanks!

Finde mehr Beiträge mit dem Tag

Accepted answers

DasaPaddock

Here's an example that uses the Fade effect to animate the alpha property of a layer.
http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/spark/effects/Fade.html

<?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"                xmlns:s="library://ns.adobe.com/flex/spark"                xmlns:esri="http://www.esri.com/2008/ags">      <fx:Script>         <![CDATA[             private function visibleCheckBox_clickHandler(event:MouseEvent):void             {                 if (visibleCheckBox.selected)                 {                     fadeInEffect.end();                     fadeInEffect.play();                 }                 else                 {                     fadeOutEffect.end();                     fadeOutEffect.play();                 }             }         ]]>     </fx:Script>      <fx:Declarations>         <s:Fade id="fadeInEffect"                 alphaFrom="0"                 alphaTo="1"                 effectEnd="imageLayer.visible = true"                 target="{imageLayer}"/>         <s:Fade id="fadeOutEffect"                 alphaFrom="1"                 alphaTo="0"                 effectEnd="imageLayer.visible = false"                 target="{imageLayer}"/>     </fx:Declarations>      <s:controlBarContent>         <s:CheckBox id="visibleCheckBox"                     click="visibleCheckBox_clickHandler(event)"                     label="Image layer visibility"                     selected="{imageLayer.visible}"/>     </s:controlBarContent>      <esri:Map>         <esri:extent>             <esri:Extent xmin="-13486000" ymin="5713000" xmax="-13200000" ymax="5823000">                 <esri:SpatialReference wkid="102100"/>             </esri:Extent>         </esri:extent>         <esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer"/>         <esri:ArcGISImageServiceLayer id="imageLayer"                                       noData="0"                                       url="http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Portland/CascadeLandsat/ImageServer"/>     </esri:Map>  </s:Application>

All comments

XintaoLiu

Thanks! It works good.

DasaPaddock

Here's an example that uses the Fade effect to animate the alpha property of a layer.
http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/spark/effects/Fade.html

<?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"                xmlns:s="library://ns.adobe.com/flex/spark"                xmlns:esri="http://www.esri.com/2008/ags">      <fx:Script>         <![CDATA[             private function visibleCheckBox_clickHandler(event:MouseEvent):void             {                 if (visibleCheckBox.selected)                 {                     fadeInEffect.end();                     fadeInEffect.play();                 }                 else                 {                     fadeOutEffect.end();                     fadeOutEffect.play();                 }             }         ]]>     </fx:Script>      <fx:Declarations>         <s:Fade id="fadeInEffect"                 alphaFrom="0"                 alphaTo="1"                 effectEnd="imageLayer.visible = true"                 target="{imageLayer}"/>         <s:Fade id="fadeOutEffect"                 alphaFrom="1"                 alphaTo="0"                 effectEnd="imageLayer.visible = false"                 target="{imageLayer}"/>     </fx:Declarations>      <s:controlBarContent>         <s:CheckBox id="visibleCheckBox"                     click="visibleCheckBox_clickHandler(event)"                     label="Image layer visibility"                     selected="{imageLayer.visible}"/>     </s:controlBarContent>      <esri:Map>         <esri:extent>             <esri:Extent xmin="-13486000" ymin="5713000" xmax="-13200000" ymax="5823000">                 <esri:SpatialReference wkid="102100"/>             </esri:Extent>         </esri:extent>         <esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer"/>         <esri:ArcGISImageServiceLayer id="imageLayer"                                       noData="0"                                       url="http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Portland/CascadeLandsat/ImageServer"/>     </esri:Map>  </s:Application>

XintaoLiu

Where you want that effect, Can you please provide further detail or snapshot of what you want to achieve.

Thanks for your reply! What I meant is when you turn on a layer in Flex, it slowly shows up; when you turn off a layer, it slowly disappears. It sounds like the effect in slides.

omega_cancer

Where you want that effect, Can you please provide further detail or snapshot of what you want to achieve.

XintaoLiu

Is it possible to implement the gradient effect when turn on/off a layer by using ArcGIS API for flex? Thanks!

Any of your comments are highly anticipated and appreciated.

Nimm an der Unterhaltung teil

Angemeldete Mitglieder können Beiträge verfassen, Updates folgen und mehr. Neu hier? Registriere ein kostenloses Konto.

Schnellzugriffe

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.