缩放图表的饼图不会在传单弹出窗口中向下钻取到其他级别

我正在编写一个简单的应用程序，其中包含传单地图、标记和标记弹出式饼图。如果我把饼图放在弹出窗口中，它会显示饼图，但当我点击饼图切片时，它不会显示子值，当我把饼图放在一个简单的页面中时，代码就可以工作了。传单弹出窗口中是否有任何预定义的限制？谢谢

var mymap = L.map('mapid').setView([51.505, -0.09], 13);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 19,
attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(mymap);;
var popup = L.popup().setContent("")
var marker = L.marker([51.5, -0.09]).bindPopup(popup).addTo(mymap);
marker.setPopupContent('')
chart= new PieChart({
"pie": {
"innerRadius": 0
},
"container": "demo",
"data": [
{
"url": "https://zoomcharts.com/data/browsers-extended.json"
}
],
"toolbar": {
"fullscreen": true,
"enabled": true
},
"interaction": {
"resizing": {
"enabled": false
}
}
})
var htmltext = '<div>I am a standalone popup.</div> <hr><div id="test">loading chart</div>'
marker.on("click", onClick);
function onClick(e) {
marker.setPopupContent(htmltext)
var chart2 = new PieChart({
"pie": {
"innerRadius": 0
},
"container": "test",
"data": [
{
"url": "https://zoomcharts.com/data/browsers-extended.json"
}
],
"toolbar": {
"fullscreen": true,
"enabled": true
},
"interaction": {
"resizing": {
"enabled": false
}
}
})
}
#mapid { height: 500px; }
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css"
integrity="sha512-xodZBNTC5n17Xt2atTPuE1HxjVMSvLVW9ocqUKLsCC5CXdbqCmblAshOMAS6/keqq/sMZMZ19scR4PsZChSR7A=="
crossorigin=""/>
<script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js"
integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA=="
crossorigin=""></script>   
<script src="https://cdn.zoomcharts-cloud.com/1/latest/zoomcharts.js"></script>
<div id="demo"> Loading Pie Chart</div>
<div id="mapid"></div>