0

我想创建一个带有 HighChart 的 BubbleChart，日期在 X 轴上，并带有自定义工具提示。

这是我的代码：

        public ActionResult BubbleChart(int id)
    {
        Project p = db.Projects.Find(id);
        Series Serie1 = new Series();
        List<object> obj1= new List<object>();
        foreach (Info info in p.Infos)
        {
            object a = new object[] {  info.Date, p.Amount, Amount/100 };
            obj1.Add(a);
        }
        Serie1.Data = new DotNet.Highcharts.Helpers.Data(obj1.ToArray());
        Serie1.Name = "Name1";
                    Highcharts chart = new Highcharts("chart")
            .InitChart(new Chart { Type = ChartTypes.Bubble, ZoomType = ZoomTypes.Xy, Width = 600, Height = 400 })
            .SetTitle(new Title { Text = "ProjectInfo" + p.Name })
            .SetXAxis(new XAxis { Type = AxisTypes.Datetime,  Title = new XAxisTitle { Text = "Date" } })
            .SetYAxis(new YAxis { Title = new YAxisTitle { Text = "Amount" } })
            .SetSeries(new[]
            {
                Serie1
            }).SetTooltip(new Tooltip
            {
                HeaderFormat = "<span style=\"font-size:11px\">{series.name}</span><br>",
                PointFormat = "<span style=\"color:{point.color}\">Date</span>: <b>{point.x}</b><br/><span style=\"color:{point.color}\">Amount</span>: <b>{point.y:.2f}</b>"
            });

        return View(chart);
    }

此代码显示在工具提示中：“日期：14002943820497398”但不是我想要的日期，如何解决？

我的第二个问题是关于在工具提示中添加数据（项目名称、描述等）我该怎么做？

谢谢

4

1 回答 1

0

Highcharts 期望时间以毫秒为单位的时间戳，但您以微秒为单位发送时间。此值14002943820497398以微秒为单位。以毫秒发送它将解决您的问题。

对于工具提示中的自定义数据，您应该按顺序填写数据： 

data: [ { y : 10, customData: 'something' },
{ y : 12, customData: 'something' },
{ y : 14, customData: 'something' } ]

并在工具提示的格式化程序功能中

 tooltip: {
 formatter: function() {
           return 'Addition info: <b>'+ this.point.customData+'</b>';
 }
}
于 2015-10-08T16:32:04.390 回答