Select to view content in your preferred language

GET RID OF LEGEND?

778
2
Jump to solution
05-01-2013 01:29 PM
JuneAcosta
Frequent Contributor
I downloaded the simple viewer, but I need to get rid of the legend. I modified the the desktop.css by setting display: none for the selector, but when I set the display: none on the #leftpane the about button as well as the legend goes away.

My questions are: how do I get rid of the legend? Should I be controlling it in the .css? How do I get rid of the legend in the ipad.css, but still keep the about button?

thanks in advance!
0 Kudos
1 Solution

Accepted Solutions
by Anonymous User
Not applicable
Hi June,

In the layout.js file you would want to comment out:

    if (dojo.byId('legendButton')) {       dojo.byId('legendButton').innerHTML = i18n.viewer.buttons.legend;       dojo.byId('listItemLegend').innerHTML = i18n.viewer.buttons.legend;     }


   var legendDijit = new esri.dijit.Legend({       map       :map,       layerInfos:layerInfo     }, 'legendDiv');     legendDijit.startup();


    // 'Legend' button     var legendTooBarButton = new dojox.mobile.ToolBarButton({       id     :'legendToolbarButton',       toggle :true,       icon   :'images/legendIcon.png',       style  :{         float        :'right',         width        :'44px',         'padding-top':'2px'       },       onClick:function () {         legendButtonSelectionHandler();       }     });     // for smartphones only, add the legend toolbar button to the right side of the header     if (isSmartPhone)       dijit.byId('rightPanelHeader').addChild(legendTooBarButton);


    if (isSmartPhone) {       var legendBackground = dojo.create('div', null, dojo.byId('rightPane'));       dojo.attr(legendBackground, 'id', 'legendBackgroundDiv');       dojo.setStyle(legendBackground, 'bottom', '2px');       dojo.setStyle(legendBackground, 'height', '180px');       dojo.setStyle(legendBackground, 'right', '5px');       dojo.setStyle(legendBackground, 'left', '5px');       dojo.setStyle(legendBackground, 'background-color', '#FFF');       dojo.setStyle(legendBackground, 'position', 'absolute');       dojo.setStyle(legendBackground, 'z-index', '10');       dojo.setStyle(legendBackground, 'opacity', '.8');       dojo.setStyle(legendBackground, 'overflow', 'scroll');       dojo.setStyle(legendBackground, '-webkit-border-radius', '6px');       dojo.setStyle(legendBackground, '-moz-border-radius', '6px');       dojo.setStyle(legendBackground, 'border-radius', '6px');       dojo.place('legendDiv', 'legendBackgroundDiv', 'first');       dojo.setStyle('legendDiv', 'margin', '1px');       dojo.setStyle('legendDiv', 'padding', '1px');       dojo.setStyle('legendDiv', 'font-size', '0.7em');       dojo.setStyle(legendBackground, 'display', 'none');     }


And also no need to keep the
legendButtonSelectionHandler()


In the FixedSplitterfragment1.html you would need to comment out:

<li id="listItemLegend" data-dojo-type="dojox.mobile.TabBarButton" moveTo="legendSubView" selected="true"></li>


  <div id="legendSubView" data-dojo-type="dojox.mobile.ScrollableView" selected="true">     <div id="legendContainer">       <div id="legendHeader"></div>       <div id="legendDiv"></div>     </div>   </div>


It's also worth checking out the sample here.  It has an 'About' button and you would then only need to add logic/design for a desktop version.

View solution in original post

0 Kudos
2 Replies
by Anonymous User
Not applicable
Hi June,

In the layout.js file you would want to comment out:

    if (dojo.byId('legendButton')) {       dojo.byId('legendButton').innerHTML = i18n.viewer.buttons.legend;       dojo.byId('listItemLegend').innerHTML = i18n.viewer.buttons.legend;     }


   var legendDijit = new esri.dijit.Legend({       map       :map,       layerInfos:layerInfo     }, 'legendDiv');     legendDijit.startup();


    // 'Legend' button     var legendTooBarButton = new dojox.mobile.ToolBarButton({       id     :'legendToolbarButton',       toggle :true,       icon   :'images/legendIcon.png',       style  :{         float        :'right',         width        :'44px',         'padding-top':'2px'       },       onClick:function () {         legendButtonSelectionHandler();       }     });     // for smartphones only, add the legend toolbar button to the right side of the header     if (isSmartPhone)       dijit.byId('rightPanelHeader').addChild(legendTooBarButton);


    if (isSmartPhone) {       var legendBackground = dojo.create('div', null, dojo.byId('rightPane'));       dojo.attr(legendBackground, 'id', 'legendBackgroundDiv');       dojo.setStyle(legendBackground, 'bottom', '2px');       dojo.setStyle(legendBackground, 'height', '180px');       dojo.setStyle(legendBackground, 'right', '5px');       dojo.setStyle(legendBackground, 'left', '5px');       dojo.setStyle(legendBackground, 'background-color', '#FFF');       dojo.setStyle(legendBackground, 'position', 'absolute');       dojo.setStyle(legendBackground, 'z-index', '10');       dojo.setStyle(legendBackground, 'opacity', '.8');       dojo.setStyle(legendBackground, 'overflow', 'scroll');       dojo.setStyle(legendBackground, '-webkit-border-radius', '6px');       dojo.setStyle(legendBackground, '-moz-border-radius', '6px');       dojo.setStyle(legendBackground, 'border-radius', '6px');       dojo.place('legendDiv', 'legendBackgroundDiv', 'first');       dojo.setStyle('legendDiv', 'margin', '1px');       dojo.setStyle('legendDiv', 'padding', '1px');       dojo.setStyle('legendDiv', 'font-size', '0.7em');       dojo.setStyle(legendBackground, 'display', 'none');     }


And also no need to keep the
legendButtonSelectionHandler()


In the FixedSplitterfragment1.html you would need to comment out:

<li id="listItemLegend" data-dojo-type="dojox.mobile.TabBarButton" moveTo="legendSubView" selected="true"></li>


  <div id="legendSubView" data-dojo-type="dojox.mobile.ScrollableView" selected="true">     <div id="legendContainer">       <div id="legendHeader"></div>       <div id="legendDiv"></div>     </div>   </div>


It's also worth checking out the sample here.  It has an 'About' button and you would then only need to add logic/design for a desktop version.
0 Kudos
JuneAcosta
Frequent Contributor
Thanks Chris!
0 Kudos