Question

我有一个简单的HighChart极坐标图，显示了一些数据。问题是，我想要显示从DB中选择的每个数据的日期，如何做到这一点？

  series: [{
        name: 'Allocated Budget',
        data: [43000, 19000, 60000, 35000, 17000, 10000],
        pointPlacement: 'on'
    }]

http://jsfiddle.net/49Lkgdr0/

Answer 1

您可以将日期设置为类别（每个点的名称参数）

$('#table').DataTable({
    "order": [[0, "desc"]],
    "bStateSave": true,
    "fnStateSaveParams": function (oSettings, sValue) {

        $.cookie("CompanySearch", $("#CompanySearch").val(), { expires: 7 });
        $.cookie("PhoneSearch", $("#PhoneSearch").val().replace('-', ''), { expires: 7 });
        $.cookie("TreatmentByFilterDropDown", $("#TreatmentByFilterDropDown").val(), { expires: 7 });
        $.cookie("LastTreatmentByID", $("#LastTreatmentByID").val(), { expires: 7 });
        $.cookie("ReferenceSourceFilterDropDown", $("#ReferenceSourceFilterDropDown").val(), { expires: 7 });
        $.cookie("ProductClassificationFilterDropDown", $("#ProductClassificationFilterDropDown").val(), { expires: 7 });
        $.cookie("ImportanceFilterDropDown", $("#ImportanceFilterDropDown").val(), { expires: 7 });
        $.cookie("openStart", $("#openStart").val(), { expires: 7 });
        $.cookie("openEnd", $("#openEnd").val(), { expires: 7 });
        $.cookie("treatmentStart", $("#treatmentStart").val(), { expires: 7 });
        $.cookie("treatmentEnd", $("#treatmentEnd").val(), { expires: 7 });
        $.cookie("lastTreatmentStart", $("#lastTreatmentStart").val(), { expires: 7 });
        $.cookie("lastTreatmentEnd", $("#lastTreatmentEnd").val(), { expires: 7 });
        $.cookie("StatusFilterDropDown", $("#StatusFilterDropDown").val(), { expires: 7 });


        //alertify.log("States Saved");
    },
    "fnStateLoadParams": function (oSettings, oData) {
        $("#CompanySearch").val($.cookie("CompanySearch"));
        $("#PhoneSearch").val($.cookie("PhoneSearch"));
        $("#TreatmentByFilterDropDown").val($.cookie("TreatmentByFilterDropDown"));
        $("#LastTreatmentByID").val($.cookie("LastTreatmentByID"));
        $("#ReferenceSourceFilterDropDown").val($.cookie("ReferenceSourceFilterDropDown"));
        $("#ProductClassificationFilterDropDown").val($.cookie("ProductClassificationFilterDropDown"));
        $("#ImportanceFilterDropDown").val($.cookie("ImportanceFilterDropDown"));
        $("#openStart").val($.cookie("openStart"));
        $("#openEnd").val($.cookie("openEnd"));
        $("#treatmentStart").val($.cookie("treatmentStart"));
        $("#treatmentEnd").val($.cookie("treatmentEnd"));
        $("#lastTreatmentStart").val($.cookie("lastTreatmentStart"));
        $("#lastTreatmentEnd").val($.cookie("lastTreatmentEnd"));
        $("#StatusFilterDropDown").val($.cookie("StatusFilterDropDown"));

        //alertify.log("States load");
    },
    "sDom": 'T<"clear">lfrtip',
    "oTableTools": {
        "sSwfPath": "/Scripts/DataTables-1.10.4/extensions/TableTools/swf/copy_csv_xls.swf",
        "aButtons": [
            {
                "sExtends": "xls",
                "sButtonText": "Save Excel",
                "mColumns": "visible"
            }
        ]
    },
    "pagingType": "full_numbers",
    "language": {
        "sProcessing": "מעבד...",
        "sLengthMenu": "הצג _MENU_ פריטים",
        "sZeroRecords": "לא נמצאו רשומות מתאימות",
        "sInfo": "_START_ עד _END_ מתוך _TOTAL_ רשומות",
        "sInfoEmpty": "0 עד 0 מתוך 0 רשומות",
        "sInfoFiltered": "(מסונן מסך _MAX_  רשומות)",
        "sInfoPostFix": "",
        "sSearch": "חיפוש חופשי:",
        "sUrl": "",
        "oPaginate": {
            "sFirst": "ראשון",
            "sPrevious": "קודם",
            "sNext": "הבא",
            "sLast": "אחרון"
        }
    },
    "serverSide": true,
    "orderMulti":false,
    "ajax": {
        "url": "/Entreaties/GetEntreaties",
        "data": function (d) { 
            d.status = 0;
            d.firstLoad = firstLoad;                
            d.jAdvanceSearch = JSON.stringify(new AdvanceSearch());
        },
        "type": "POST",
        "dataType": "json",
        error: function (xhr, textStatus, errorThrown) {
            alertify.log(xhr.responseText);
        }
    },
    //"aaData": data,
    "columns": [
        { "data": "ID" },
        { "data": "OpenDate" },
        { "data": "NextContactDay" },
        { "data": "CompanyName" },
        { "data": "ContactName" },
        { "data": "Phone" },
        { "data": "CellPhone" },
        { "data": "Details" },
        { "data": "Status" },
        { "data": "TreatmentBy" },
        { "data": "TreatmentByID" },
        { "data": "ReferenceSourceID" },
        { "data": "ProductClassificationID" },
        { "data": "ImportanceID" },
        { "data": "StatusID"  },
        { "data": "LastTreatmentDate" },
        { "data": "LastTreatmentBy" },
        { "data": "LastTreatmentByID" }
    ],
    "columnDefs": [
        { "width": "10%", "targets": [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17] },
        {"type" : "date", "targets": [1]},
        {
            "targets": [10],
            "visible": false,
        },
        {
            "targets": [11],
            "visible": false
        },
        {
            "targets": [12],
            "visible": false
        },
        {
            "targets": [13],
            "visible": false
        },
        {
            "targets": [14],
            "visible": false
        },
        {
            "targets": [17],
            "visible": false
        },
        {
            "targets": [16],
            "visible": false
        },
        {
            "targets": [15],
            "visible": false
        }
    ],
    "fnInitComplete": function () {
        checkForHiddenFilters();
        $($('.panel')[1]).append($('.DTTT_container'));           
    }
});

然后在tooltip.pointFormat。

中提取该信息

data: [{name: "11.1.2016", y:43000}]

示例：http://jsfiddle.net/xqwu650b/

Highchart，极坐标图表中的多个值

1 个答案: