代码之家  ›  专栏  ›  技术社区  ›  Organiccat

ngUpgrade Highcharts的两个版本,错误16

  •  0
  • Organiccat  · 技术社区  · 7 年前

    我有一个升级的应用程序可以使用ngUpgrade,目前为止它运行得很好,但我在尝试合并Highcharts时遇到了一个问题。

    最初的应用程序包含了不同版本的highcharts(AngularJS的旧版本)。

    使用Angular的新(混合记忆)应用程序有不同版本的highcharts。

    当两者都使用时,我遇到了一个错误#16,Highcharts已经实例化,这很有意义。

    我的问题是,我如何避免这种情况?

    如果我删除旧的高度图,旧应用程序将无法检测到新的角度高度图。如果我删除新的,尝试通过窗口对象访问highcharts引用将不起作用,因为highcharts似乎无法检测新角度的模板,也不知道如何使用它。

    有没有人把一个混合应用程序放在一起,在应用程序的两个部分(旧的和新的)都有高图?

    1 回复  |  直到 7 年前
        1
  •  1
  •   Kamil Kulig    7 年前

    Highcharts对象保存在 Highcharts 的属性 Window 对象Highcharts检查是否已在此属性中定义,如果为true,则抛出错误16。

    解决方案:

    您可以尝试将Highcharts的一个版本保存在其他属性中并清除 Window.Highcharts 加载其他版本之前:

    HTML:

    <script src="https://code.highcharts.com/4.2.2/highcharts.src.js"></script>
    <script>
      this.HighchartsOld = this.Highcharts;
      this.Highcharts = null;
    </script>
    <script src="https://code.highcharts.com/highcharts.src.js"></script>
    
    <div id="container1" style='height: 200px'></div>
    <div id="container2" style='height: 200px'></div>
    

    JS公司:

    var chart = Highcharts.chart('container1', {
      series: [{
        data: [1, 2]
      }]
    });
    
    var chart = HighchartsOld.chart('container2', {
      series: [{
        data: [1, 2]
      }]
    });
    

    现场演示: http://jsfiddle.net/BlackLabel/2x7ys9eo/

    推荐文章