如何使用Javascript克隆Primefaces p:chart

我正在尝试将PF5折线图从一个xhtml页面（数据页面）克隆到另一个xhtml页面（报告页面）。图表如下：

<div id="lchart">
<p:chart id="ulinechart" type="line" rendered="#{chartDataBean.showLineChart}"
model="#{chartDataBean.userdatLineModel}" responsive="true"/>  
</div>


<button id="reportaction" class="controlbutton" 
type="button onclick="copyChart()">Add Chart
</button>

function copyChart() {
var idincrement = 0;
var original = document.getElementById('topform:ulinechart');

var reportchartholder = document.getElementById('rchartholder');
var clone = original.cloneNode(true);
clone.id = 'ulinechart' + ++idincrement;
reportchartholder.parentNode.appendChild(clone);

}

我无法找到这个错误是什么以及如何处理它。它似乎与primefaces chart.js文件有关

研究表明，类型错误通常发生在手动添加的jQuery文件和PF jQuery文件之间存在冲突的地方

我再次检查了我是否正在使用捆绑的pfjquery。接下来，我检查了chart.js文件本身是否有问题，发现如下：

我尝试应用建议的修复程序并添加：

<h:outputScript name="charts/charts.js" library="primefaces" />
<h:outputStylesheet name="charts/charts.css" library="primefaces" />

到我的模板页面。错误完全相同

1） 有关于错误的指导吗？2） 关于绘制图表的正确方法有什么建议吗？我应该使用第一个JS方法吗？第二种jQuery图像方法？另一种方法？

---

提前感谢您的建议

这个问题解决了。我认为jQuery错误是由于未正确读取元素div造成的。由于jQuery中的冒号是为jQuery选择器保留的，因此我必须使用escape键为元素div定义完整的PF路径，如下所示：

function copyChart() {

var imageData = jQuery('#topform\\:ulinechart').jqplotToImageStr({});
var imageElem = jQuery('<img/>').attr('src', imageData);
jQuery('#rchartholder').append(imageElem); 
}

函数copyChart（）{
var-imageData=jQuery（'#topform\\：ulinechart'）。jqplotToImageStr（{}）；
var imagelem=jQuery（'
我现在可以将图表克隆为图像。希望这有帮助

<h:outputScript name="charts/charts.js" library="primefaces" />
<h:outputStylesheet name="charts/charts.css" library="primefaces" />

function copyChart() {

var imageData = jQuery('#topform\\:ulinechart').jqplotToImageStr({});
var imageElem = jQuery('<img/>').attr('src', imageData);
jQuery('#rchartholder').append(imageElem); 
}