Highcharts：如何显示图表。仅从日历

Question

我们在基于asp.net和vb.net的应用程序中实现了highcharts。实际上这个图表已经由我们以前的开发人员在我们的网站上实现。它从日历小部件中获取日期值。

这是我的asp.net代码。

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="Server">
<div class="page-title">
           <span id="widget">
                 <span id="widgetField" class="hover-glow">
                       <i class="icon-chevron-down"></i>
                  </span>
                  <span id="widgetCalendar">
                            <span id="applyCalendar">apply</span>
                  </span>
            </span>
 </div>
<div>
     <div id="visitChart" class="chart-spline">   </div>
 </div>
</asp:Content>

这是javascript中的代码

var setVisitChart = function () {

            var startMoment = moment(startDate);
            var startPoint = Date.UTC(startMoment.year(), startMoment.month(), startMoment.day());

            $.ajax({
                type: "POST",
                url: "/_services/AnalyticsService.asmx/AJVisits",
                data: "{'startdate':'" + moment(startDate).format('YYYY/MM/DD') + "','enddate':'" + moment(endDate).format('YYYY/MM/DD') + "'}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                cache: true,
                success: function (response) {
                    var visits = response.d;
                    renderDateSplineChart('visitChart', 'Visits', [{ name: 'views', data: visits.Visits }, { name: 'visits', data: visits.Unique }], startPoint);
                }
            });

 setDatePicker(setVisitChart);

 });

在此代码中，从日历窗口小部件中选择startdate和enddate。但我想把数据库和结束日期的startdate作为当前日期。

这样做我试图将startdate值放在变量中。

       //******************//
            var strdt = "<%= Vacancy.Created.ToString()%>";
            var startdt = moment(strdt);
            var startpt = Date.UTC(startdt.year(), startdt.month(), startdt.day());
        //******************//

并更改了这一行

                    data: "{'startdate':'" + moment(startDate).format('YYYY/MM/DD') + "','enddate':'" + moment(endDate).format('YYYY/MM/DD') + "'}",

到这个

                    data: "{'startdate':'" + moment(strdt).format('YYYY/MM/DD') + "','enddate':'" + moment(endDate).format('YYYY/MM/DD') + "'}",

然后图表消失并出错。

我做错了什么？

******************************为了您的信息************** ***************

 url: "/_services/AnalyticsService.asmx/AJVisits" 

指的是

    Public Function AJVisits(startdate As String, enddate As String) As VisitSumary

    Dim vquery As String = String.Format("EXEC  [dbo].[VisitsByDate]    @StartDate = N'{0}',    @EndDate = N'{1}',  @interval = 1,  @employerid = {2},  @userid = {3}", startdate, enddate, LocalHelper.UserEmployerID(), LocalHelper.UserID())
    Dim uquery As String = String.Format("EXEC  [dbo].[UniqueVisitsByDate]  @StartDate = N'{0}',    @EndDate = N'{1}',  @interval = 1,  @employerid = {2},  @userid = {3}", startdate, enddate, LocalHelper.UserEmployerID(), LocalHelper.UserID())
    Dim v As Integer() = Core.DB.GetDataArray(vquery)
    Dim u As Integer() = Core.DB.GetDataArray(uquery)

    Return New VisitSumary() With {.Visits = v, .Unique = u}

End Function

与此图表相关的javascript函数是

renderDateSplineChart = function (t, e, a, i) {
    new Highcharts.Chart({
        chart: {
            renderTo: t,
            backgroundColor: "#edf1f2",
            zoomType: "x",
            type: "spline"
        },
        title: {
            text: null
        },
        tooltip: {
            shared: !0,
            crosshairs: !0
        },
        legend: {
            align: "left",
            verticalAlign: "top",
            x: 0,
            y: -0,
            floating: !0,
            borderWidth: 0
        },
        plotOptions: {
            spline: {
                lineWidth: 2,
                states: {
                    hover: {
                        lineWidth: 3
                    }
                },
                marker: {
                    enabled: !1,
                    states: {
                        hover: {
                            enabled: !0,
                            symbol: "circle",
                            radius: 5,
                            lineWidth: 1
                        }
                    }
                }
            },
            series: {
                pointPadding: 0,
                groupPadding: 0,
                pointStart: i,
                pointInterval: 864e5
            }
        },
        xAxis: {
            type: "datetime",
            maxZoom: 12096e5,
            tickWidth: 0,
            gridLineWidth: 1,
            labels: {
                enabled: !1
            }
        },
        yAxis: [{
            title: {
                text: null
            },
            labels: {
                enabled: !1
            },
            gridLineWidth: 1,
            showFirstLabel: !1
        }],
        series: a
    })
},

var windowHeight = $(window).height(),
windowWidth = $(window).width(),
startDate, endDate, nRunning = !1;

function setDatePicker(t) {
function e() {
    $.cookie("_a_sd", startDate, {
        expires: 90
    }), $.cookie("_a_ed", endDate, {
        expires: 90
    }), $("#widgetField > span").html(startDate + " to " + endDate)
}

function a() {
    startDate = moment().subtract("months", 3).format("d MMMM, YYYY"), endDate = moment().format("d MMMM, YYYY"), null != $.cookie("_a_sd") && (startDate = $.cookie("_a_sd")), null != $.cookie("_a_ed") && (endDate = $.cookie("_a_ed")), e()
}
a(), $("#widgetCalendar").DatePicker({
    flat: !0,
    format: "d B, Y",
    date: [new Date(startDate), new Date(endDate)],
    calendars: 3,
    mode: "range",
    starts: 1,
    onChange: function (t) {
        $("#widgetField > span").html(t.join(" to ")), startDate = t[0], endDate = t[1], e()
    }
}), $("#widgetField").on("click", function () {
    return $("#widgetCalendar").stop().animate({
        height: $("#widgetCalendar div.datepicker").get(0).offsetHeight,
        opacity: 1
    }, 200), !1
}), $("#applyCalendar").on("click", function () {
    $("#widgetCalendar").stop().animate({
        height: 0,
        opacity: 0
    }, 300), t && "function" == typeof t && t()
}), t && "function" == typeof t && t()

}