d3函数没有附加在div id中

时间:2015-06-18 09:04:05

标签: javascript jquery html mysql d3.js

我正在尝试绘制MySQL返回的数据(' data'中返回的3列)。我在控制台中得到的结果很好,没有错误,但我仍然无法看到图表。此外,当我没有将变量传递给javascript以获取可变数据时,它工作正常。 (并且代码的d3部分绘制了预期的图形)然后我没有任何下拉,一个固定的图形显示。我调用" makeDataFromD3"是否有问题?功能。 我的HTML代码:

    <script type="text/javascript" src="/static/js/jquery-2.1.1.min.js"></script>
    <script type="text/javascript" src="/static/js/chart.js"></script>
    <script type="text/javascript" src="/static/js/d3.js"></script>

    <meta charset="utf-8">
        <style type="text/css">
            div.bar {
                display: inline-block;
                width: 20px;
                height: 75px;
                background-color: teal;
                margin-right: 2px;
            }

        </style>    

<script language="javascript" type="text/javascript">
            function dynamicdropdown(listindex)
            {
                document.getElementById("subcategory").length = 0;
                switch (listindex)
                {
                    .. create subcategory menu

                }
                return true;
            }    

            function myfunction(){

                a = document.getElementById("category").value;
                b = document.getElementById("subcategory").value;    

                if (document.getElementById("category").value == "All"){
                    b = "NA";
                }    

                document.write(a,b);
                MYLIBRARY.init([a,b]);
                MYLIBRARY.createChart();
            }    


       </script>

{% endblock %}
{% block content %}    

<div id="chartContainer1" >    

</div>
<div id="chartContainer2" >    

</div>
<div id="chartContainer3" >    

</div>
<div id="chartContainer4" >    

</div>
<div id="chartContainer5" >    

</div>
<div id="chartContainer6" >    

</div>    

<form id = "dimensions" ></form>    

<div class="category_div" id="category_div">Please specify Institution Type:
            <select name="category" class="required-entry" id="category" form = "dimensions" onchange="javascript: dynamicdropdown(this.options[this.selectedIndex].value);">
                <option value="">Select Institution Type</option>
                 .. some options
            </select>
        </div>
        <div class="sub_category_div" id="sub_category_div">Please select Institution:
            <script type="text/javascript" language="JavaScript">
                document.write('<select name="subcategory" id="subcategory"><option value="">Please select Institution</option></select>')
            </script>
            <noscript>
                <select name="subcategory" id="subcategory" form = "dimensions" >
                    <option value="">Please select Institution</option>
                </select>
            </noscript>
        </div>    

<div><br>
    <input type = "button" value = "Submit" id = "filter" form = "dimensions" onclick = "myfunction()">
</div>    

这是我的js档案:

    var MYLIBRARY = MYLIBRARY || (function(){
    //var _args = {}; // private    

     return {
        init : function(Args) {
            _args = Args;
            // some other initialising
            console.log(_args)
        },
        createChart : function() {    

            getData(_args);
            //alert('In createChart! -' + _args[0]);
        }
    };
}());    

function getData(_args){
    $.ajax({    

        url:"/getchartData?a="+_args[0]+"&b="+_args[1],
        type:"GET",
        success:function(data){    

            data = $.parseJSON(data);
            console.log(data);
            makeDataFromD3(data)
        },
        error:function(err,xhr,col){    

            console.log(err,xhr,col);
        }    

    });
}    

function makeDataFromD3(data){    

for (ctr =1 ; ctr <3; ctr ++){

... d3 chart code    

}
}

0 个答案:

没有答案