Javascript 本地库中的chartjs4.4.2和chartjsplugin注解

我是Chartjs的新手，所以请原谅我:-) 在Debian 12上，我已经安装了NPM的chart.js和chartjs-plugin-Annotation

版本:chartjs-v4.4.2 chartjs-plugin-注解-v1.0.3

使用本地库中的上述库，没有可见的矩形.

使用外部库

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.4.0/Chart.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/chartjs-plugin-annotation/0.5.7/chartjs-plugin-annotation.js"></script>

所需的矩形可见.

如果使用

<script src="javascript/chartjs/chart.umd.js"></script> 
<script src="javascript/chartjs-plugin-annotation/chartjs-plugin-annotation.min.js"></script>

该矩形不可见.

Chrome DevTool没有显示错误.

矩形:

<script>                                                                        
const tempData = {                                                              
labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
datasets: [{                                                                
    label: 'Temp',                                                          
    fill: false,                                                            
    data: [-5, 0, 5, -10, -5, 12, 15, 20, 15, 10, 5, 0],                    
}]                                                                          
};                                                                              
const chartOptions = {                                                          
annotation: {                                                               
    annotations: [{                      
        drawTime: "beforeDatasetsDraw",                                     
        type: "box",                                                        
        xScaleID: "x-axis-0",                                               
        yScaleID: "y-axis-0",                                               
        borderWidth: 0,                                                     
        yMin: 18,                                                           
        yMax: 32,                                                           
        backgroundColor: "rgba(46, 204, 113, 0.3)"                          
    }]                                                                      
                                                                            
}                                                                           
};                                                                              
const chartConfig = {                                                           
type: 'line',                                                               
options: chartOptions,                                                      
data: tempData,                                                             
}                                                                               
// Create the chart                                                             
var ctx =   document.getElementById('tempChart').getContext('2d');                
new Chart(ctx, chartConfig);                                                    
</script>                                                                       

谁能提供一个使用本 map 书管理员和chartjs-4.4.2的工作示例？