聚合值的 HighCharts 图表

发布于 2024-10-31 06:28:38 字数 285 浏览 0 评论 0原文

我正在尝试在 Highcharts 中创建具有以下性质的柱形图

X 轴:以秒为单位的时间 Y 轴:特定时间值出现的次数。

换句话说,我希望能够输入以下数据系列:

[50,50,30]

,并且它应该创建一个具有以下值的柱形图:

x: 30 ,y:1 x: 50, y: 2

这种类型的功能在 Highcharts 中可行吗?

谢谢你!

I'm trying to create a column graph in Highcharts of the following nature:

X Axis: Time in seconds
Y Axis: how many times the particular time value appears.

In other words, I want to be able to have the following data series entered in:

[50,50,30]

and it should create a column chart with the following values:

x: 30, y: 1
x: 50, y: 2

Is this type of functionality possible in Highcharts?

Thank you!

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

杀お生予夺 2024-11-07 06:28:38

这是可能的,但与 highcharts 没有直接关系。

您只需在调用 highcharts 函数之前创建一个 javascript 代码片段,以所需的格式分割数据,然后在 highcharts 中使用它(系列和总计/值)。
没有图表库可以为您完成这项工作。

javascript 片段应该如下所示:

var options = {
     chart: {
         renderTo: 'container',
         defaultSeriesType: 'column'
     },
     title: {
         text: 'Fruit Consumption'
     },
     xAxis: {
         categories: []
     },
     yAxis: {
         title: {
             text: 'Units'
         }
     },
     series: []
 };

var items = [50,30,50];
var series = {
             data: []
         };
var notfound;

items.sort();
 for(var i=0; i < items.length; i++) {
   notfound= true;
   for(var j=0; j < options.xAxis.categories.length && notfound; j++) {       
     if (items[i] === options.xAxis.categories[j]) {
       notfound= false;
     }
   }
  if (notfound) {
     options.xAxis.categories.push(items[i]);
    series.data[j]= 1;
  } else {
    series.data[j]++;
  }
 }

 $(document).ready(function() {
   var chart = new Highcharts.Chart(options);
 }

类似这样的东西。我希望它有帮助。

问候

It is possible but it's not directly related to highcharts.

You just have to create a javascript snippet before calling highcharts functions to spliut your data in the format you want and then use it in highcharts (series and totals/values).
No charting library will do that work for you.

the javascript snippet should look like this :

var options = {
     chart: {
         renderTo: 'container',
         defaultSeriesType: 'column'
     },
     title: {
         text: 'Fruit Consumption'
     },
     xAxis: {
         categories: []
     },
     yAxis: {
         title: {
             text: 'Units'
         }
     },
     series: []
 };

var items = [50,30,50];
var series = {
             data: []
         };
var notfound;

items.sort();
 for(var i=0; i < items.length; i++) {
   notfound= true;
   for(var j=0; j < options.xAxis.categories.length && notfound; j++) {       
     if (items[i] === options.xAxis.categories[j]) {
       notfound= false;
     }
   }
  if (notfound) {
     options.xAxis.categories.push(items[i]);
    series.data[j]= 1;
  } else {
    series.data[j]++;
  }
 }

 $(document).ready(function() {
   var chart = new Highcharts.Chart(options);
 }

Something like this. I hope it helps.

Regards

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文