0 Replies - 2520 Views - Last Post: 20 September 2011 - 08:02 AM

#1 jhoog  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 29
  • Joined: 13-June 11

Trying to add a red line in the middle of a graph

Posted 20 September 2011 - 08:02 AM

I drew a bar graph in visual studio out of divs, and I am trying to add a solid static red line down the middle of it to act as a goal point being my 100% level: Here is the code I used in the aspx page to draw the divs along with the cs page on how i drew in the bars, any help would be great. Thank You
<div id="Name1Div" style="float: left; width: 900px; height: 50px; border: 1px solid black;
                background-image: url('Images/CalendarLine.jpg'); background-repeat: repeat-y;"
                runat="server">
            </div>
            <div id="Name2Div" style="float: left; width: 900px; height: 50px; border: 1px solid black;
                background-image: url('Images/CalendarLine.jpg'); background-repeat: repeat-y;"
                runat="server">
            </div>
            <br />
            <div id="Name3Div" style="float: left; width: 900px; height: 50px; border: 1px solid black;
                background-image: url('Images/CalendarLine.jpg'); background-repeat: repeat-y;"
                runat="server">
            </div>
            <br />
            <div id="Name4Div" style="float: left; width: 900px; height: 50px; border: 1px solid black;
                background-image: url('Images/CalendarLine.jpg'); background-repeat: repeat-y;"
                runat="server">
            </div>
            <br />
            <div id="Name5Div" style="float: left; width: 900px; height: 50px; border: 1px solid black;
                background-image: url('Images/CalendarLine.jpg'); background-repeat: repeat-y;"
                runat="server">
            </div>
            <br />
            <div id="Name6Div" style="float: left; width: 900px; height: 50px; border: 1px solid black;
                background-image: url('Images/CalendarLine.jpg'); background-repeat: repeat-y;"
                runat="server">
            </div>
            <br />
            <div id="Name7Div" style="float: left; width: 900px; height: 50px; border: 1px solid black;
                background-image: url('Images/CalendarLine.jpg'); background-repeat: repeat-y;"
                runat="server">
            </div>
            <br />
            <div id="Name8Div" style="float: left; width: 900px; height: 50px; border: 1px solid black;
                background-image: url('Images/CalendarLine.jpg'); background-repeat: repeat-y;"
                runat="server">
            </div>



Name1Div.InnerHtml += "<div id=\"Container1Div" + "\">" +
                      "<div id=\"SpacingDiv" + "\" style=\"width: 0px; margin: 0px; height: 0px;  background-image: url('Images/CalendarLine.jpg'); background-repeat: repeat-y;\">" +
                      "</div>" +
                      "<div id=\"NameDiv" + "\" style=\"width: 425px; margin: 0px; height: 49px; text-align: center; background-color: LightBlue; border: 1px solid px;\">" +
                          "Jason - 1300  " +
                      "</div>" +
                   "</div>";

        Name2Div.InnerHtml += "<div id=\"Container1Div" + "\">" +
              "<div id=\"SpacingDiv" + "\" style=\"width: 0px; margin: 0px; height: 0px;  background-image: url('Images/CalendarLine.jpg'); background-repeat: repeat-y;\">" +
              "</div>" +
              "<div id=\"NameDiv" + "\" style=\"width: 500px; margin: 0px; height: 49px;  text-align: center; background-color: LightBlue; border: 1px solid px;\">" +
                  "Chad - 650  " +
              "</div>" +
           "</div>";

        Name3Div.InnerHtml += "<div id=\"Container1Div" + "\">" +
              "<div id=\"SpacingDiv" + "\" style=\"width: 10px; margin: 0px; height: 0px; text-align: center; background-image: url('Images/CalendarLine.jpg'); background-repeat: repeat-y;\">" +
              "</div>" +
              "<div id=\"NameDiv" + "\" style=\"width: 325px; margin: 0px; height: 49px;  text-align: center; background-color: Lime; border: 1px solid px;\">" +
                  "Brandon - 875  " +
              "</div>" +
           "</div>";


        Name4Div.InnerHtml += "<div id=\"Container1Div" + "\">" +
              "<div id=\"SpacingDiv" + "\" style=\"width: 10px; margin: 0px; height: 0px; text-align: center; background-image: url('Images/CalendarLine.jpg'); background-repeat: repeat-y;\">" +
              "</div>" +
              "<div id=\"NameDiv" + "\" style=\"width: 450px; margin: 0px; height: 49px;  text-align: center; background-color: LightBlue; border: 1px solid px;\">" +
                  "Michael - 800  " +
              "</div>" +
           "</div>";


        Name5Div.InnerHtml += "<div id=\"Container1Div" + "\">" +
              "<div id=\"SpacingDiv" + "\" style=\"width: 10px; margin: 0px; height: 0px; text-align: center; background-image: url('Images/CalendarLine.jpg'); background-repeat: repeat-y;\">" +
              "</div>" +
              "<div id=\"NameDiv" + "\" style=\"width: 650px; margin: 0px; height: 49px;  text-align: center; background-color: LightBlue; border: 1px solid px;\">" +
                  "Matt - 1450  " +
              "</div>" +
           "</div>";

        Name6Div.InnerHtml += "<div id=\"Container1Div" + "\">" +
             "<div id=\"SpacingDiv" + "\" style=\"width: 10px; margin: 0px; height: 0px; text-align: center; background-image: url('Images/CalendarLine.jpg'); background-repeat: repeat-y;\">" +
             "</div>" +
             "<div id=\"NameDiv" + "\" style=\"width: 225px; margin: 0px; height: 49px;  text-align: center; background-color: LightBlue; border: 1px solid px;\">" +
                 "Katrina - 725  " +
             "</div>" +
          "</div>";

        Name7Div.InnerHtml += "<div id=\"Container1Div" + "\">" +
             "<div id=\"SpacingDiv" + "\" style=\"width: 10px; margin: 0px; height: 0px; text-align: center; background-image: url('Images/CalendarLine.jpg'); background-repeat: repeat-y;\">" +
             "</div>" +
             "<div id=\"NameDiv" + "\" style=\"width: 125px; margin: 0px; height: 49px;  text-align: center; background-color: LightBlue; border: 1px solid px;\">" +
                 "Joe - 500  " +
             "</div>" +
          "</div>";

        Name8Div.InnerHtml += "<div id=\"Container1Div" + "\">" +
             "<div id=\"SpacingDiv" + "\" style=\"width: 10px; margin: 0px; height: 0px; text-align: center; background-image: url('Images/CalendarLine.jpg'); background-repeat: repeat-y;\">" +
             "</div>" +
             "<div id=\"NameDiv" + "\" style=\"width: 315px; margin: 0px; height: 49px;  text-align: center; background-color: LightBlue; border: 1px solid px;\">" +
                 "Bob - 350  " +
             "</div>" +
          "</div>";

This post has been edited by modi123_1: 20 September 2011 - 08:05 AM
Reason for edit:: code tags - they are your friends!


Is This A Good Question/Topic? 0
  • +

Page 1 of 1