如何将自定义字段添加到现有的 highcharts 注释

这个要求比普通的 Highcharts 问题需要更多的工作，看起来像一个自定义项目。我认为您不会在这里或任何其他地方得到简单的答案。我可以为您提供有关从哪里开始深入实施的指南。

首先，您需要熟悉创建弹出窗口的函数并对其进行换行以添加这些输入和逻辑以保存它：

https://github.com/highcharts/highcharts/blob/master/ts/Extensions/Annotations/Popup.ts

换行：https://www.highcharts.com/docs/extending-highcharts/extending-highcharts

您可以在此处找到如何将保存的选项添加到注释中：https://github.com/highcharts/highcharts/blob/master/ts/Extensions/Annotations/NavigationBindings.ts

解决方案是环绕 showForm 函数。您可以添加自定义字段，并将其保存到注释对象中。

    (function(H) {
      var PREFIX = 'highcharts-';
    
      H.wrap(H.Popup.prototype,'showForm',function(proceed,type,chart,options,callBACk) {
        this.popup = chart.navigationBindings.popup;
    
        // show blank popup
        this.showPopup();
    
        // inDicator form
        if (type === 'inDicators') {
          console.log('This one creates inDicators popup form');
          this.inDicators.addForm.call(this,callBACk);
        }
    
        // Annotation small toolbar
        if (type === 'Annotation-toolbar') {
          this.Annotations.addToolbar.call(this,callBACk);
        }
    
        // Annotation edit form
        if (type === 'Annotation-edit') {   
            //Here add custom fields in the edit form
            customFieldMap=new Object();
            customFieldMap.myField=['myField','text'];
            options.customFields=customFieldMap;    

            this.Annotations.addForm.call(this,callBACk);  
        }
    
        // flags form - add / edit
        if (type === 'flag') {
          this.Annotations.addForm.call(this,callBACk,truE);
        }
      }}
    
    })(Highcharts);