designer

designer.html

<link rel="import" href="../core-drawer-panel/core-drawer-panel.html">
<link rel="import" href="../esri-html5/esri-legend.html">
<link rel="import" href="../esri-html5/esri-featurelist.html">
<link rel="import" href="../core-splitter/core-splitter.html">
<link rel="import" href="../esri-html5/esri-map.html">
<link rel="import" href="../esri-html5/esri-layer.html">
<link rel="import" href="../esri-html5/esri-infotemplate.html">
<link rel="import" href="../esri-html5/esri-home.html">
<link rel="import" href="../esri-html5/esri-locate.html">
<link rel="import" href="../esri-html5/esri-scalebar.html">

<polymer-element name="my-element">

  <template>
    <style>    
      :host {
        position: absolute;
        width: 100%;
        height: 100%;
        box-sizing: border-box;
      }
      #core_drawer_panel {
        position: absolute;
        top: 0px;
        right: 0px;
        bottom: 0px;
        left: 0px;
        width: 100%;
        height: 100%;
      }
      #section {
        box-shadow: rgba(0, 0, 0, 0.0980392) 0px 2px 4px, rgba(0, 0, 0, 0.0980392) 0px 0px 3px;
        background-color: rgb(250, 250, 250);
      }
      #section1 {
        height: 100%;
        box-sizing: border-box;
        background-color: rgb(221, 221, 221);
      }
      #map {
        height: 100%;
      }
      #kmlLayer {
        left: 1650px;
        top: 770px;
      }
    </style>
    <core-drawer-panel id="core_drawer_panel" touch-action>
      <section id="section" drawer>
        <esri-legend map="{{ $.map.map }}" id="esri_legend">
    		</esri-legend>
        <esri-featurelist features="{{ $.geoRSSLayer.layer.graphics }}" id="feature_list">
    </esri-featurelist>
        <core-splitter direction="up" id="core_splitter" class="horizontal"></core-splitter>
      </section>
      <section id="section1" main>
        <esri-map basemap="gray" autoresize latitude="-35.142871135367415" longitude="149.12868429997224" zoom="8" id="map">
          <esri-webtiledlayer id="webtiledLayer"></esri-webtiledlayer>
          <esri-featurelayer url="http://sampleserver5.arcgisonline.com/arcgis/rest/services/WorldTimeZones/MapServer/0" id="worldCitiesLayer"></esri-featurelayer>
          <esri-georsslayer id="geoRSSLayer">
            <esri-infotemplate title="Earthquakes - Last 7 days" id="wmsInfo">${*}</esri-infotemplate>
          </esri-georsslayer>
          <esri-home map="{{ $.map.map }}" id="esri_home"></esri-home>
          <esri-locate map="{{ $.map.map }}" id="esri_locate"></esri-locate>
          <esri-imageservicelayer id="modisLayer"></esri-imageservicelayer>
          <esri-scalebar id="esri_scalebar"></esri-scalebar>
          <esri-tiledmapservicelayer id="worldTopoLayer"></esri-tiledmapservicelayer>
          <esri-csvlayer url="/2.5_week.csv" id="csvLayer"></esri-csvlayer>
        </esri-map>
      </section>
    </core-drawer-panel>
  </template>

  <script>

    Polymer('my-element', {
      
    });

  </script>

</polymer-element>