如何处理复杂数据结构的列表

【问题标题】：How to process a list of complex data structures如何处理复杂数据结构的列表
【发布时间】：2016-07-14 07:23:37
【问题描述】：

在高图表中，我有一个如下数组， 但是，如果我尝试通过返回数组的最高值来设置图表的极端值，它会显示 NaN 错误。

function aoDashboardData() {
var data = [

     {      type: "",
            data: [{
                x: 0.0,
                low: Date.UTC(2016, 2, 15),
                high: Date.UTC(2016, 4, 10),
                color: "#4B0081"
            },
            {
                x: 0.0,
                low: Date.UTC(2016, 4, 15),
                high: Date.UTC(2016, 6, 15),
                color: "#00BFFE"
            },
            {
                x: 0.0,
                low: Date.UTC(2016, 6, 20),
                high: Date.UTC(2016, 8, 0),
                color: "#0047AB"
            },
            {
                x: 0.0,
                low: Date.UTC(2016, 8, 5),
                high: Date.UTC(2016, 10, 15),
                color: "#4682B4"
            },
            {
                x: 0.0,
                low: Date.UTC(2016, 10, 20),
                high: Date.UTC(2016, 12, 31),
                color: "#008081"
            }]
        },
        {
            type: 'line',
            data: [
                {
                    x: 0.0,
                    y: Date.UTC(2016, 2, 15),
                    marker: {
                        symbol: 'url(/../Content/Img/monitor.png)',
                    }
                },
                {
                    x: 0.0,
                    y: Date.UTC(2016, 4, 10),
                    marker: {
                        symbol: 'url(/../Content/Img/optimise.png)',
                    }
                },
                {
                    x: 0.0,
                    y: Date.UTC(2016, 6, 15),
                    marker: {
                        symbol: 'url(/../Content/Img/pilot.png)',
                    }
                },
                {
                    x: 0.0,
                    y: Date.UTC(2016, 8, 5),
                    marker: {
                        symbol: 'url(/../Content/Img/model.png)',
                    }
                },
                {
                    x: 0.0,
                    y: Date.UTC(2016, 10, 15),
                    marker: {
                        symbol: 'url(/../Content/Img/deploy.png)',
                    }
                }

            ]
        },



        {
            type: "",
            data: [{
                x: 1.0,
                low: Date.UTC(2016, 2, 15),
                high: Date.UTC(2016, 4, 10),
                color: "#4B0081"
            },
            {
                x: 1.0,
                low: Date.UTC(2016, 4, 15),
                high: Date.UTC(2016, 6, 15),
                color: "#00BFFE"
            },
            {
                x: 1.0,
                low: Date.UTC(2016, 6, 20),
                high: Date.UTC(2016, 8, 0),
                color: "#0047AB"
            },
            {
                x: 1.0,
                low: Date.UTC(2016, 8, 5),
                high: Date.UTC(2016, 10, 15),
                color: "#4682B4"
            },
            {
                x: 1.0,
                low: Date.UTC(2016, 10, 20),
                high: Date.UTC(2016, 12, 31),
                color: "#008081"
            }]
        },
        {
            type: 'line',
            data: [
                {
                    x: 1.0,
                    y: Date.UTC(2016, 2, 15),
                    marker: {
                        symbol: 'url(/../Content/Img/monitor.png)',
                    }
                },
                {
                    x: 1.0,
                    y: Date.UTC(2016, 4, 10),
                    marker: {
                        symbol: 'url(/../Content/Img/optimise.png)',
                    }
                },
                {
                    x: 1.0,
                    y: Date.UTC(2016, 6, 15),
                    marker: {
                        symbol: 'url(/../Content/Img/pilot.png)',
                    }
                },
                {
                    x: 1.0,
                    y: Date.UTC(2016, 8, 5),
                    marker: {
                        symbol: 'url(/../Content/Img/model.png)',
                    }
                },
                {
                    x: 1.0,
                    y: Date.UTC(2016, 10, 15),
                    marker: {
                        symbol: 'url(/../Content/Img/deploy.png)',
                    }
                }

            ]
        },

         {
             type: "",
             data: [{
                 x: 2.0,
                 low: Date.UTC(2016, 2, 15),
                 high: Date.UTC(2016, 4, 10),
                 color: "#4B0081"
             },
             {
                 x: 2.0,
                 low: Date.UTC(2016, 4, 15),
                 high: Date.UTC(2016, 6, 15),
                 color: "#00BFFE"
             },
             {
                 x: 2.0,
                 low: Date.UTC(2016, 6, 20),
                 high: Date.UTC(2016, 8, 0),
                 color: "#0047AB"
             },
             {
                 x: 2.0,
                 low: Date.UTC(2016, 8, 5),
                 high: Date.UTC(2016, 10, 15),
                 color: "#4682B4"
             },
             {
                 x: 2.0,
                 low: Date.UTC(2016, 10, 20),
                 high: Date.UTC(2016, 12, 31),
                 color: "#008081"
             }]
         },
         {
             type: 'line',
             data: [
                 {
                     x: 2.0,
                     y: Date.UTC(2016, 2, 15),
                     marker: {
                         symbol: 'url(/../Content/Img/monitor.png)',
                     }
                 },
                 {
                     x: 2.0,
                     y: Date.UTC(2016, 4, 10),
                     marker: {
                         symbol: 'url(/../Content/Img/optimise.png)',
                     }
                 },
                 {
                     x: 2.0,
                     y: Date.UTC(2016, 6, 15),
                     marker: {
                         symbol: 'url(/../Content/Img/pilot.png)',
                     }
                 },
                 {
                     x: 2.0,
                     y: Date.UTC(2016, 8, 5),
                     marker: {
                         symbol: 'url(/../Content/Img/model.png)',
                     }
                 },
                 {
                     x: 2.0,
                     y: Date.UTC(2016, 10, 15),
                     marker: {
                         symbol: 'url(/../Content/Img/deploy.png)',
                     }
                 }

             ]
         },


          {
              type: "",
              data: [{
                  x: 3.0,
                  low: Date.UTC(2016, 2, 15),
                  high: Date.UTC(2016, 4, 10),
                  color: "#4B0081"
              },
              {
                  x: 3.0,
                  low: Date.UTC(2016, 4, 15),
                  high: Date.UTC(2016, 6, 15),
                  color: "#00BFFE"
              },
              {
                  x: 3.0,
                  low: Date.UTC(2016, 6, 20),
                  high: Date.UTC(2016, 8, 0),
                  color: "#0047AB"
              },
              {
                  x: 3.0,
                  low: Date.UTC(2016, 8, 5),
                  high: Date.UTC(2016, 10, 15),
                  color: "#4682B4"
              },
              {
                  x: 3.0,
                  low: Date.UTC(2016, 10, 20),
                  high: Date.UTC(2016, 12, 31),
                  color: "#008081"
              }]
          },
          {
              type: 'line',
              data: [
                  {
                      x: 3.0,
                      y: Date.UTC(2016, 2, 15),
                      marker: {
                          symbol: 'url(/../Content/Img/monitor.png)',
                      }
                  },
                  {
                      x: 3.0,
                      y: Date.UTC(2016, 4, 10),
                      marker: {
                          symbol: 'url(/../Content/Img/optimise.png)',
                      }
                  },
                  {
                      x: 3.0,
                      y: Date.UTC(2016, 6, 15),
                      marker: {
                          symbol: 'url(/../Content/Img/pilot.png)',
                      }
                  },
                  {
                      x: 3.0,
                      y: Date.UTC(2016, 8, 5),
                      marker: {
                          symbol: 'url(/../Content/Img/model.png)',
                      }
                  },
                  {
                      x: 3.0,
                      y: Date.UTC(2016, 10, 15),
                      marker: {
                          symbol: 'url(/../Content/Img/deploy.png)',
                      }
                  }

              ]
          },

          {
              type: "",
              data: [{
                  x: 4.0,
                  low: Date.UTC(2016, 2, 15),
                  high: Date.UTC(2016, 4, 10),
                  color: "#4B0081"
              },
              {
                  x: 4.0,
                  low: Date.UTC(2016, 4, 15),
                  high: Date.UTC(2016, 6, 15),
                  color: "#00BFFE"
              },
              {
                  x: 4.0,
                  low: Date.UTC(2016, 6, 20),
                  high: Date.UTC(2016, 8, 0),
                  color: "#0047AB"
              },
              {
                  x: 1.0,
                  low: Date.UTC(2016, 8, 5),
                  high: Date.UTC(2016, 10, 15),
                  color: "#4682B4"
              },
              {
                  x: 4.0,
                  low: Date.UTC(2016, 10, 20),
                  high: Date.UTC(2016, 12, 31),
                  color: "#008081"
              }]
          },
          {
              type: 'line',
              data: [
                  {
                      x: 4.0,
                      y: Date.UTC(2016, 2, 15),
                      marker: {
                          symbol: 'url(/../Content/Img/monitor.png)',
                      }
                  },
                  {
                      x: 4.0,
                      y: Date.UTC(2016, 4, 10),
                      marker: {
                          symbol: 'url(/../Content/Img/optimise.png)',
                      }
                  },
                  {
                      x: 4.0,
                      y: Date.UTC(2016, 6, 15),
                      marker: {
                          symbol: 'url(/../Content/Img/pilot.png)',
                      }
                  },
                  {
                      x: 4.0,
                      y: Date.UTC(2016, 8, 5),
                      marker: {
                          symbol: 'url(/../Content/Img/model.png)',
                      }
                  },
                  {
                      x: 4.0,
                      y: Date.UTC(2016, 10, 15),
                      marker: {
                          symbol: 'url(/../Content/Img/deploy.png)',
                      }
                  }

              ]
          }

          ,

          {
              type: "",
              data: [{
                  x: 5.0,
                  low: Date.UTC(2016, 2, 15),
                  high: Date.UTC(2016, 4, 10),
                  color: "#4B0081"
              },
              {
                  x: 5.0,
                  low: Date.UTC(2016, 4, 15),
                  high: Date.UTC(2016, 6, 15),
                  color: "#00BFFE"
              },
              {
                  x: 5.0,
                  low: Date.UTC(2016, 6, 20),
                  high: Date.UTC(2016, 8, 0),
                  color: "#0047AB"
              },
              {
                  x: 5.0,
                  low: Date.UTC(2016, 8, 5),
                  high: Date.UTC(2016, 10, 15),
                  color: "#4682B4"
              },
              {
                  x: 5.0,
                  low: Date.UTC(2016, 10, 20),
                  high: Date.UTC(2016, 12, 31),
                  color: "#008081"
              }]
          },
          {
              type: 'line',
              data: [
                  {
                      x: 5.0,
                      y: Date.UTC(2016, 2, 15),
                      marker: {
                          symbol: 'url(/../Content/Img/monitor.png)',
                      }
                  },
                  {
                      x: 5.0,
                      y: Date.UTC(2016, 4, 10),
                      marker: {
                          symbol: 'url(/../Content/Img/optimise.png)',
                      }
                  },
                  {
                      x: 5.0,
                      y: Date.UTC(2016, 6, 15),
                      marker: {
                          symbol: 'url(/../Content/Img/pilot.png)',
                      }
                  },
                  {
                      x: 5.0,
                      y: Date.UTC(2016, 8, 5),
                      marker: {
                          symbol: 'url(/../Content/Img/model.png)',
                      }
                  },
                  {
                      x: 5.0,
                      y: Date.UTC(2016, 10, 15),
                      marker: {
                          symbol: 'url(/../Content/Img/deploy.png)',
                      }
                  }

              ]
          }
          ,

          {
              type: "",
              data: [{
                  x: 6.0,
                  low: Date.UTC(2016, 2, 15),
                  high: Date.UTC(2016, 4, 10),
                  color: "#4B0081"
              },
              {
                  x: 6.0,
                  low: Date.UTC(2016, 4, 15),
                  high: Date.UTC(2016, 6, 15),
                  color: "#00BFFE"
              },
              {
                  x: 6.0,
                  low: Date.UTC(2016, 6, 20),
                  high: Date.UTC(2016, 8, 0),
                  color: "#0047AB"
              },
              {
                  x: 6.0,
                  low: Date.UTC(2016, 8, 5),
                  high: Date.UTC(2016, 10, 15),
                  color: "#4682B4"
              },
              {
                  x: 6.0,
                  low: Date.UTC(2016, 10, 20),
                  high: Date.UTC(2016, 12, 31),
                  color: "#008081"
              }]
          },
          {
              type: 'line',
              data: [
                  {
                      x: 6.0,
                      y: Date.UTC(2016, 2, 15),
                      marker: {
                          symbol: 'url(/../Content/Img/monitor.png)',
                      }
                  },
                  {
                      x: 6.0,
                      y: Date.UTC(2016, 4, 10),
                      marker: {
                          symbol: 'url(/../Content/Img/optimise.png)',
                      }
                  },
                  {
                      x: 6.0,
                      y: Date.UTC(2016, 6, 15),
                      marker: {
                          symbol: 'url(/../Content/Img/pilot.png)',
                      }
                  },
                  {
                      x: 6.0,
                      y: Date.UTC(2016, 8, 5),
                      marker: {
                          symbol: 'url(/../Content/Img/model.png)',
                      }
                  },
                  {
                      x: 6.0,
                      y: Date.UTC(2016, 10, 15),
                      marker: {
                          symbol: 'url(/../Content/Img/deploy.png)',
                      }
                  }

              ]
          }
          ,

          {
              type: "",
              data: [{
                  x: 7.0,
                  low: Date.UTC(2016, 2, 15),
                  high: Date.UTC(2016, 4, 10),
                  color: "#4B0081"
              },
              {
                  x: 7.0,
                  low: Date.UTC(2016, 4, 15),
                  high: Date.UTC(2016, 6, 15),
                  color: "#00BFFE"
              },
              {
                  x: 7.0,
                  low: Date.UTC(2016, 6, 20),
                  high: Date.UTC(2016, 8, 0),
                  color: "#0047AB"
              },
              {
                  x: 1.0,
                  low: Date.UTC(2016, 8, 5),
                  high: Date.UTC(2016, 10, 15),
                  color: "#4682B4"
              },
              {
                  x: 7.0,
                  low: Date.UTC(2016, 10, 20),
                  high: Date.UTC(2016, 12, 31),
                  color: "#008081"
              }]
          },
          {
              type: 'line',
              data: [
                  {
                      x: 7.0,
                      y: Date.UTC(2016, 2, 15),
                      marker: {
                          symbol: 'url(/../Content/Img/monitor.png)',
                      }
                  },
                  {
                      x: 7.0,
                      y: Date.UTC(2016, 4, 10),
                      marker: {
                          symbol: 'url(/../Content/Img/optimise.png)',
                      }
                  },
                  {
                      x: 7.0,
                      y: Date.UTC(2016, 6, 15),
                      marker: {
                          symbol: 'url(/../Content/Img/pilot.png)',
                      }
                  },
                  {
                      x: 7.0,
                      y: Date.UTC(2016, 8, 5),
                      marker: {
                          symbol: 'url(/../Content/Img/model.png)',
                      }
                  },
                  {
                      x: 7.0,
                      y: Date.UTC(2016, 10, 15),
                      marker: {
                          symbol: 'url(/../Content/Img/deploy.png)',
                      }
                  }

              ]
          }
]

return data;

}

我试图获得最大值的代码是：

MinAssortmentValue = Math.min.apply(Math, chartlength);

这里是更新的 jsFiddle 链接：http://jsfiddle.net/sarav4gs/jbmk9tb1/3/

谁能帮我解决它？提前致谢！！

【问题讨论】：

  • 你从哪里得到chartlength？
  • 数组的最大值是什么意思，有点模糊你能解释一下吗？最高值？还是数组中的最后一个元素？
  • @guradio 抱歉，我的意思是最高价值
  • @NinaScholz 你可以参考这个小提琴的完整代码：jsfiddle.net/sarav4gs/L4fx5mbd/4
  • @DownVoter 请让我知道我的问题有什么问题？

标签： javascript arrays data-structures highcharts mapreduce


【解决方案1】：

...参考我的这个评论 - How to process a list of complex data structures - 草图方法可能看起来像这样，即使我仍然不知道您要比较的图表项目的对象属性是什么和/或提取...

var
    chart = $('#ao-projectssummry-chart').highcharts(),

    minMaxValues = chart.series.reduce(function (collector, item, idx/*, list*/) {
        var
            dataMin  = item.dataMin,
            dataMax  = item.dataMax,
            minValue = Math.min(collector.minValue, dataMin),
            maxValue = Math.max(collector.maxValue, dataMax);

        if (minValue == dataMin) {
            collector.minValue = dataMin;
            collector.minValueItemIndex = idx;
        }
        if (maxValue == dataMax) {
            collector.maxValue = dataMax;
            collector.maxValueItemIndex = idx;
        }
        return collector;

    }, {
        minValue: Number.POSITIVE_INFINITY,
        maxValue: Number.NEGATIVE_INFINITY,
        minValueItemIndex: -1,
        maxValueItemIndex: -1
    }),

    minAssortmentValue = minMaxValues.minValue,
    maxAssortmentValue = minMaxValues.maxValue;

console.log("minMaxValues : ", minMaxValues);
console.log("minAssortmentValue, maxAssortmentValue : ", minAssortmentValue, maxAssortmentValue);

将刚刚提供的代码粘贴到您提供的小提琴的控制台中会导致以下输出：

minMaxValues :  Object {
    minValue: 1458000000000,
    maxValue: 1485820800000,
    minValueItemIndex: 9,
    maxValueItemIndex: 14
}
minAssortmentValue, maxAssortmentValue :  1458000000000 1485820800000

【讨论】：

  • 首先非常感谢您的宝贵时间和帮助！！！让我在我的代码中试试这个 sn-p 看看我是否能实现我的场景:)
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2020-05-31
  • 2019-04-14
  • 1970-01-01
  • 2019-09-30
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多
热门标签
Java Python linux javascript Mysql C# Docker 算法 前端 SpringBoot Redis Vue spring 设计模式 .net core .net kubernetes c++ 数据库 数据结构 大数据 js 机器学习 微服务 Android Go 程序员 面试 JVM ASP.net core 云原生 人工智能 后端 PHP git CSS golang k8s Nginx Django mybatis 深度学习 多线程 React 架构 devops 爬虫 云计算 Spring Boot LeetCode