Deliverable 1: Jie Wei Lin's Sunset

Below is a sunset I created to demonstrate the features of VML.

VML Code

<v:group id="sunset" style="position:relative; top:0px; left:0px; width:480px; height:300px"      coordorigin="0,0" coordsize="480,300" >
<v:rect
  fill="false"
  stroke="false"
  strokecolor="white"
  strokeweight="0.75pt"
  border="0"
  style="position:absolute; 
  top:0px; left:0; 
  width:480px;
  height:100px">
  <v:fill Type="Gradient"  
    Angle="360" 
    color="#ff6600"
    color2="yellow"
    Focus="50%" />
</v:rect>
<v:rect
  fill="true"
  stroke="true"
  strokecolor="yellow"
  strokeweight="0.75pt"
  border="0"
  border="0"
  style="position:absolute;
  top:100px; left:0; 
  width:480px;
  height:50px">
  <v:fill Type="Gradient"  
    Angle="360" 
    color="yellow"
    color2="#EFF8Ad"/>
</v:rect>
<v:rect
  fill="true"
  stroke="true"
  strokecolor="#EFF8Ad"
  strokeweight="0.75pt"
  style=" position:absolute;
  top:150px; left:0; 
  width:480px;
  height:50px">
  <v:fill Type="Gradient"  
    Angle="360" 
    color="#EFF8Ad"
    color2="#ADDE63"
     />
</v:rect>
<v:rect
  fill="true"
  stroke="true"
  strokecolor="#ADDE63"
  strokeweight="0.75pt"
  style="position:absolute; 
  top:200px; left:0; 
  width:480px;
  height:50px">
  <v:fill Type="Gradient"  Angle="360" 
    color="#ADDE63"
    color2="#218429"
     />
</v:rect>
<v:rect
  fill="true"
  stroke="true"
  strokecolor="#218429"
  strokeweight="0.75pt"
  style="position:absolute; 
  top:250px; left:0; 
  width:480px;
  height:100px">
  <v:fill Type="Gradient"  Angle="360" 
    color="#218429"
    color2="#186321"
     />
</v:rect>

<!-- sun -->
<v:oval filled="true" fillcolor="#ff3300" 
    stroke="true"
    strokecolor="red"
    strokeweight="0.75pt"
    style="top:50px; left:50px; width:70px;height:70px">
<v:fill Type="Gradient" 
    color="red"
    color2="#990000"
    focus="30%" />
</v:oval>


<!-- group components for the house together -->
<v:group id="house" style="position:absolute; top:50px; left:250px; width:100px; height:200px"
    coordorigin="0,0" coordsize="20, 40"
>
    <!-- roof -->
    <v:polyline filled="true" fillcolor="gray"
        points="0, 20, 20, 0, 40, 20"> 
        <v:fill Type="Gradient"  Angle="330" 
            color="silver"
            color2="gray"/>
    </v:polyline>
    
    <!-- chimmy -->
    <v:shapetype id="chimmy"
        coordsize="10, 3"
        fillcolor="black"
        path="M 28,12 L 28, 7 30,7 30,12 X E">
        <v:fill Type="Gradient"  Angle="330" 
            color="silver"
            color2="gray"/>
    </v:shapetype>
    <v:shape type="#chimmy" style="width:10px; height:3px" />
    
    <!-- small smoke -->
    <v:oval id="smoke1" filled="true" fillcolor="#ff3300" 
        stroke="true"
        strokecolor="white"
        strokeweight="0.75pt"
        style="height:2px; width:2px; top:5px; left:28px">
    <v:fill Type="Gradient" 
        color="white"
        color2="silver"
        focus="30%" />
    </v:oval>
    
    <!-- bigger smoke -->
    <v:oval id="smoke2" filled="true" fillcolor="#ff3300" 
        stroke="true"
        strokecolor="white"
        strokeweight="0.75pt"
        style="height:3px; width:3px; top:2px; left:28px">
    <v:fill Type="Gradient" 
        color="white"
        color2="silver"
        focus="30%" />
    </v:oval>
    
    <!-- wall -->
    <v:rect filled="true" fillcolor="gray" 
        style="height:20px; width:30px; top:20px; left:5px">
        <v:fill Type="Gradient"  Angle="330" 
            color="silver"
            color2="gray"/>
    </v:rect>
    
    <!-- window -->
    <v:rect filled="true" fillcolor="#ff9900" 
        style="height:7px; width:5px; top:25px; left:25px">
        <v:fill Type="Gradient"  Angle="80" 
            color="#ff9900"
            color2="yellow"/>
    </v:rect>
    
    <!-- door -->
    <v:rect filled="true" fillcolor="black" 
        style="height:15px; width:10px; top:25px; left:13px">
        <v:fill Type="Gradient"  Angle="330" 
            color="silver"
            color2="#404040"/>
    </v:rect>
</v:group> 
</v:group>