0

对于你们中的一些人来说，这听起来像是一个非常简单的问题，但我是一个非常新的编程。我正在使用 SPServices GetListItems 从 SharePoint 列表中提取数据。这是js：

$(document).ready(function () {
var colors = ["#5179D6", "#66CC66", "#EF2F41", "#FFC700", "#61BDF2", "#FF7900",  "#7588DD", "#2F5E8C", "#07BACE", "#BAE55C", "#BA1871", "#FFFFCC",   "#BDE6FC", "#C7C7C7", "#ADA8FF", "#2FA675"];
$().SPServices({
    operation: "GetListItems",
    async: false,
    listName: "Test",
    CAMLViewFields: "<ViewFields><FieldRef Name='Person' /><FieldRef Name='Age' /><FieldRef Name='Earnings' /><FieldRef Name='Names' /></ViewFields>",
    completefunc: function (xData, Status) {
        $(xData.responseXML).SPFilterNode("z:row").each(function () {
            var theheight = $(this).attr("ows_Earnings") + 'px';
            var barras = '<div class="barras" style="height:' + theheight + '">' + $(this).attr("ows_Names") + '</div>';
            $('#graficos').append(barras);
            ////////


            $('.barras').each(function (idx) {
                $(this).css({ 'background': colors[idx % 16] });
            });
            });
    } //end of completeFunc

}); //end of SPServices
}); //end of jQuery function

这是 HTML：

<div id="graficos" style="height:500px"></div>

我可以毫无问题地提取数据并创建条形图。我遇到的问题是这些条看起来“颠倒”：

在此处输入图像描述

我希望“平坦”部分位于底部。如果这看起来像是一个没有受过教育的问题（确实是这样！），我深表歉意，但我无法弄清楚。谢谢！

4

1 回答 1

1

正如您知道每个 div 的确切高度一样，您可以使用边距进行调整：

'<div class="barras" style="height:' + theheight + 'px; margin-top:' + (500-theheight) + 'px;">'

这里的概念证明：http: //jsfiddle.net/EGCyU/

重要的！在 html 中，id 是唯一的，所以你不应该创建多个 id 为“barras”的元素。

于 2014-05-23T05:07:36.620 回答