Javascript硬编码对象可以作为参数，但不能引用全局对象

Javascript hard-coded object works as parameter, but not reference to global object

本文关键字：对象 参数 但不能 引用 全局 编码 Javascript      更新时间：2023-09-26

JQuery Flot遇到一个奇怪的问题。

我一直在运行

var plot = null;
function initPlot () {
    plot = $.plot("#graph", myData, { /* my options here */ });
}

一切都很顺利。

我将我的期权数据移动到函数范围内的一个变量中

var plot = null;
function initPlot () {
    var myOptions = { /* my options here */ };
    plot = $.plot("#graph", myData, myOptions);
}

再说一遍，一切都很好。

然后我把这个变量移到了一个更大的范围（这样我就可以在其他函数中引用它）。

var plot = null;
var myOptions = { /* my options here */ };
function initPlot () {
    plot = $.plot("#graph", myData, myOptions);
}

突然间，它就无法正确地绘制了。更让我困惑的是，它得到了大多数选项的值——显示的是图形，而不是数据。

使用Chrome的调试器，我可以看到myOptions在调用$.plot()时具有正确的值。我还尝试设置一个局部变量o = myOptions，并用o而不是myOptions调用$.plot()，但这也无法绘制数据。

造成这种情况的原因是什么？我该如何解决？

我应该注意，我使用的是FlotGrow和Flot.Stack，但禁用它们不会改变结果。

编辑（再次）

根据评论，以下是我的代码的状态：

<body>
    <div id="graph" style="width: 100%; height: 800px;"></div>
    <script>
        var idMap = {};
        var yesData = [];
        var noData = [];
        var incData = [];
        var voteData = [{ label: "Yes votes", data: yesData },
                        { label: "No votes", data: noData },
                        { label: "Not met quorum", data: incData }];
        var ticks = [];
        var plot = null;
        var myOptions = {
            series: {
                //stack: true,
                lines: {
                    show: false,
                    fill: true,
                    steps: false,
                },
                bars: {
                    show: true,
                    barWidth: .8,
                    horizontal: true,
                },
                //grow: {
                //    active: false,
                //    steps: 20,
                //    stepDirection: "up",
                //    stepMode: "linear",
                //    valueIndex: 0,
                //    growings: [{
                //        valueIndex: 0,
                //    }]
                //},
            },
            yaxis: {
                min: -.2,
                max: 10, //dictLen(idMap),
                //ticks: ,
                //tickLength: 0,
            },
            xaxis: {
                min: 0,
                max: 200,
            },
            grid: {
                hoverable: true,
            },
        };
        function dictLen(obj) {
            var size = 0, key;
            for (key in obj) {
                if (obj.hasOwnProperty(key)) size++;
            }
            return size;
        };
        function setDataPoint(val) {
            var total = val.r["yes"] + val.r["no"];
            if (total < val.q) {
                incData.push([total, idMap[val.id]]);
            }
            else {
                yesData.push([val.r["yes"], idMap[val.id]]);
                noData.push([val.r["no"], idMap[val.id]]);
            }
        }
        function initData() {
            $.getJSON('/Vote/results', function (data) {
                $.each(data, function (key, val) {
                    idMap[val.id] = key;
                    ticks.push([key + .4, val.nm]);
                    setDataPoint(val);
                });
                initPlot();
            });
        }
        function initPlot() {
            plot = $.plot("#graph", voteData, myOptions);
        }
        $(document).ready(function () {
            initData();
        });
    </script>
</body>

原来我有点白痴。

问题是，在填充idMap之前，我正在计算myOptions.yaxis.max。然后，当我在这里等待答案时，我在数据库端进行了一些重构，结果得到了一个空的数据集。

当我修复数据库并将myOptions设置为仅静态值时，它运行良好。

相关文章：