Jquery浮动图表标签未显示

Jquery Flot Chart label not showing

本文关键字:标签 显示 Jquery      更新时间:2023-09-26

所以我正在学习flot图表,但在使用选项时,我很难显示标签或图例。某些选项会起作用(比如线条的填充和fillColor),但其他选项不行把头撞在桌子上

出于某种原因,它根本没有出现在jsfiddle中,但它出现在我的web应用程序中。

<h1>Flot Examples</h1>
<div id="placeholder" class="placeholder" style="width:500px; height:300px; background-color:darkcyan;"  runat="server">
<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);
    dataTime = [
        [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];
    options = {
        series: {
            //bars: { show: true }
            lines: {
                show: true,
                // fill: true,
                //fillColor: "#000000"
            },
        },
        xaxis: {
            mode: "time"
        },
        yaxis: {
            min: 1
        },
        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.ClientID %>'), data, options);
        chart1 = $.plot($(".placeholder"), data2, options);
    });
</script>![enter image description here][1]

我建议使用这个轴标签插件:https://github.com/markrcote/flot-axislabels.它可以让你为x和y轴添加一个标签,非常简单。