为了账号安全,请及时绑定邮箱和手机立即绑定

在数组中使用数组时替代已弃用的 Highcharts.each

在数组中使用数组时替代已弃用的 Highcharts.each

忽然笑 2022-10-21 10:21:21
我正在使用一个简单的 Highcharts 柱形图来显示一组数据。悬停在 Highcharts 外部的数组用于为每列生成工具提示。一年中的每个月都有一列。在工具提示 pointFormatter 中使用“Highcharts.each”功能时,一切都很好。每个月列显示该特定月份的正确股票代码:例如,将鼠标悬停在“一月”图表列上时,工具提示在顶行显示“一月”,在下一行显示“CMA、OMC、DIS、JPM”在工具提示中。注意:此时,一年中的最后 6 个月仍然是未来,这就是为什么 'tooltip_ticks' 数组中的最后 6 个元素具有空值的原因。var tooltip_ticks = [["CMA","OMC","DIS","JPM"],["TXN","ABBV","SPG"],["ENB","TJX","TGT","MMM","MSFT","VBR","ED","HD","AVGO","VTV"],["CMA","OMC","FXAIX","JPM"],["CVS","ABBV","TXN"],["ENB","WFC","PFE","TGT","MSFT","MMM","ED","HD"],"","","","","",""]...        tooltip: {            useHTML: true,            pointFormatter: function() {                var string = '';                Highcharts.each(tooltip_ticks[this.series.data.indexOf(this)], function(tick) {                     string += tick + ', '                });                return string;            }        }Highcharts.each 函数已被弃用。我花了将近 2 个小时和多次代码迭代试图弄清楚如何使用 js Array.forEach 函数复制上面的代码。一个例子:            pointFormatter: function() {                var string = '';                tooltip_ticks.forEach(function(tick) {                      string += tick + ', '                });                return string;            }这会为每个月创建一个工具提示,但每个月的工具提示都包含“tooltip_ticks”数组中的所有元素。我不知道如何获得正确的每月子数组索引,以便在每个工具提示中只显示单个月份的代码。换句话说,相当于这个tooltip_ticks[this.series.data.indexOf(this)]我是否需要在 forEach 函数中执行某种“For”循环,因为子数组需要循环并且子数组元素一个一个地提取?我会使用 js 和/或 Highcharts 图表库将我的经验水平归类为“初学者”,因此不完全是新手,但仍处于早期学习模式。任何帮助/建议将不胜感激。
查看完整描述

1 回答

?
HUWWW

TA贡献1874条经验 获得超12个赞

好吧,在发布了这个问题并在第二天重新阅读之后,我能够从一个新的角度看待它,并针对与我的情况相关的已弃用的 Highcharts.each 函数提出了以下解决方案。关键是使用 this.series.data.indexOf(this) 参数和 array.forEach 函数。顺便说一句,我还添加了一个简短的条件来处理因循环遍历每个数据点的最后一个子数组元素而产生的尾随逗号


                tooltip: {

                  useHTML: true,

                  headerFormat: '<b>{point.x}</b><br/>',

                  pointFormatter: function() {

                    var string = '';

                    var i = this.series.data.indexOf(this);

                    var ticks = tooltip_ticks[i];


                    ticks.forEach(function(tick, index) {

                          if (index != ticks.length - 1) {

                            string += tick + ', ';

                          } else {

                            string += tick;

                          }

                    });

                    return string;

                    

                  }

                }

//img1.sycdn.imooc.com//6352023d000129a603990275.jpg

查看完整回答
反对 回复 2022-10-21
  • 1 回答
  • 0 关注
  • 286 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号