Flot Chart未显示带选项的图例

时间:2015-04-02 16:38:29

标签: javascript jquery asp.net charts flot

enter image description here我无法在此flot图表中显示任何内容的图例....我正在使用选项为占位符设置所有选项。有谁知道怎么让这个出现?正常的标签和工具提示也不起作用,如果有人知道如何让那些工作或我做错了,这将是惊人的。我现在一直在挣扎三天,试图找出问题所在。

jquery是版本1.10.2用于jquery和min文件,1.10.4用于ui。

   <script language="javascript" type="text/javascript" src="chartjs/jquery.js?v1.8"></script>
    <script language="javascript" type="text/javascript" src="chartjs/jquery.flot.mce.js?v1.8"></script>
    <script language="javascript" type="text/javascript" src="chartjs/jquery.flot.time.js?v1.8"></script>
    <script language="javascript" type="text/javascript" src="chartjs/jquery.flot.selection.js?v1.8"></script>
    <script language="javascript" type="text/javascript" src="chartjs/jquery.flot.categories.js?v1.8"></script>
    <script language="javascript" type="text/javascript" src="chartjs/jquery.flot.axislabels.js"></script>

    <h1>Flot Examples</h1>
<div id="placeholder" class="placeholder" style="width:500px; height:300px; background-color:darkcyan;"  runat="server"></div>

<script type="text/javascript">
    var data, data1, dataTime, options, chart;
    var date = new Date(); //2015
    var date1 = date.setDate(date.getDate());
    var date2 = date.setDate(date.getDate()-365); //2015
    var date3 = new Date(date.getFullYear() - 2, date.getMonth() - 5, date.getDate() - 6);

     data2 = [[date1, 1], [date2, 3], [date3, 6]];
   // data2 = [ dataTime];

    data1 = [ [1, 4], [2, 5], [3, 6], [4, 9], [5, 7], [6, 6], [7, 2], [8, 1], [9, 3]];
    //data = [data1];

    var dataset= [
        {
            label: "data w Times",
            data: data2,
          //  color: "#ffffff"
        } /*,
        {
            label: "data1",
            data: data1
        }*/
    ];

    options = {
        series: 
        {
            //bars: { show: true }
            lines: {
                show: true,
               // fill: true,
                //fillColor: "#000000"
            },

        },
        xaxis: {
            mode: "time",
            axisLabel: "foo"
        },
        yaxis: { 
            min: 1,
            axisLabel: "bar"
        },
        selection: { mode: "x" },
        grid: { show: true },
     //   clickable: true,
       // hoverable: true,
        shadowSize: 20,
        highlightColor: "#ffffff",  //this is the color of the circle that appears
        label: { string: "invisible" },
        tooltip: true,
        legend: {
            show: true,
            labelBoxBorderColor: "#ffffff",
            position: "ne",
            margin: 10,
            backgroundColor: "#66ccff",

        }

    };

    $(document).ready(function () {
        chart1 = $.plot($(".placeholder"), data2, options);
    });
</script>

0 个答案:

没有答案