时间戳

首页 > 解决方案 > Highstock：如何禁用 rangeSelector 响应规则以在元素之间断线？

javascript - Highstock：如何禁用 rangeSelector 响应规则以在元素之间断线？

问题描述

我正在尝试开发一个非常紧凑的图表，可以在同一条线上同时buttons显示inputSelect。rangeSelector我还有一个控制器来显示/隐藏 stocktools gui 界面（这是错误的来源）。

显示 gui 会生成一个buttons向右移动的动画，因为两个元素之间的距离大于响应规则条件（我想）它们保持在同一条线上，但是当我单击隐藏 gui 时，动画会触发并强制inputSelect中断一条线。

我曾尝试使用参数chart:{animation:false}，但由于某种原因，我遇到了反问题。当我单击以显示 gui 界面inputSelect时会换行，当我将其隐藏时，它会返回同一行。

这是一个现场演示。

我想知道我是否可以访问该响应规则并禁用它，但我在 API 文档中的任何地方都找不到它。我也尝试使用rangeSelectorAPI 中的默认参数，但似乎它们无法帮助触发该 gui 动画。
该结果的任何解决方案都是有效的，我只是认为这是可行的。

更新

我找到了这个论坛主题https://www.highcharts.com/forum/viewtopic.php?t=41142。这是一个可行的解决方法，我尝试实现它以使两者input都向右和buttons向左移动，这样就更难满足他们的断线条件。这是解决方法：

chart: {
  events: {
    load: function(){
      let marginRight;
      let marginLeft;
      let marginLeft;
      let this = chart;

      marginRight = chart.marginRight - chart.spacing[1];
      marginLeft = chart.plotLeft + chart.spacing[3];

      chart.update({
        rangeSelector: {
          inputPosition: {
            align: "right",
            x: marginRight,
          },
          buttonPosition: {
            align: "left",
            x: marginLeft,
          }
        }
      });
    }
  },

它仅适用于marginRight由于某种原因图表对象没有 marginLeft 属性，我想知道是否有任何其他方法来计算轴标题和标签宽度以作为这个 x 偏移量传递。

标签： javascripthighcharts

解决方案

推荐阅读