Question

我正在尝试构建一个非常简单的仪表板图表，以显示有多少未完成的项目。类似的东西：

item 1 ------------------ (54 items)
item 2 ---------------------------------(74 items)
item 2 -------(10 items)

理想情况下，我希望破折号被简单的彩色条代替。

我搜索了Google，但可能使用了错误的搜索字词。我更喜欢C＃解决方案，但如果需要，我很乐意使用JQuery。

Answer 1

我需要更多信息来具体解决这个问题，但这里提出了一些想法：

我假设您正在渲染某种类型的集合，例如在Repeater或Gridview中？

如果你没有使用它，我会推荐一个Repeater，因为它可以在这种情况下做相当具体的事情，这是一个例子：

   <asp:Repeater id=Repeater1 runat="server">
      <HeaderTemplate>
         <table>
      </HeaderTemplate>

      <ItemTemplate>
         <tr>
            <td> 
               <%# DataBinder.Eval(Container.DataItem, "Name") %>
               <span class='backgroundBar' style='width:<%# DataBinder.Eval(Container.DataItem, "Count") %>px;'>&nbsp;</span>
               (<%# DataBinder.Eval(Container.DataItem, "Count") %> items)
            </td>
         </tr>
      </ItemTemplate>

      <FooterTemplate>
         </table>
      </FooterTemplate>

   </asp:Repeater>

然后

Object[] values = new Object[];

Repeater1.DataSource = values;
Repeater1.DataBind();

你可以用某种带有背景图像的div替换虚线，或者用您喜欢的方式替换任何样式。

**确保在样式属性中使用单引号，因为双引号会引入内联代码错误**

简单的仪表板显示简单条形图中的项目计数

1 个答案: