我想创建68000点的线性图表。 实际创建的图表没有任何问题，并且每秒动态更新。
这是示例xhtml文件：
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
xmlns:h="http://xmlns.jcp.org/jsf/html">
<h:form id="statistics-form">
<p:dialog header="Statistics"
id="statistics"
onHide="closeDialog('side-menu-form:sm-statistics');"
widgetVar="statistics"
width="700" height="auto"
showEffect="fade" hideEffect="fade"
resizable="false">
<div class="dialog-content">
<p:tabView>
<p:tab title="System">
<p:accordionPanel>
<p:tab title="Memory">
<h:panelGrid cellpadding="10">
<p:poll interval="1"
global="false"
update="chartMemory"
listener="#{memoryChartBean.init}"/>
<p:chart type="line"
model="#{memoryChartBean.lineModel}"
id="chartMemory"
style="height:210px;width:600px;"/>
</h:panelGrid>
</p:tab>
<p:tab title="Cpu">
<h:panelGrid cellpadding="10">
<p:poll interval="1"
global="false"
update="chartCpu"
listener="#{cpuChartBean.init}"/>
<p:chart type="line"
model="#{cpuChartBean.lineModel}"
id="chartCpu"
style="height:190px;width:600px;"/>
<p:poll interval="1" global="false" update="chartLoadAvg"
listener="#{loadAvgChartBean.init}"/>
<p:chart type="line"
model="#{loadAvgChartBean.lineModel}"
widgetVar="chart"
id="chartLoadAvg"
style="height:190px;width:600px;"/>
</h:panelGrid>
</p:tab>
</p:accordionPanel>
</p:tab>
</p:tabView>
</div>
</p:dialog>
</h:form>
<script type="text/javascript">
function loadAvgChartExtender() {
this.cfg.shadow = false;
this.cfg.title = 'Load Average';
this.cfg.seriesColors = ['#003eff', '#7d9800', '#5bab77'];
this.cfg.grid = {
background: '#ffffff',
borderColor: '#ffffff',
gridLineColor: '#e8e8e8',
shadow: false
};
this.cfg.legend = {
show: true,
position: 'sw'
};
this.cfg.axesDefaults = {
borderWidth: 0.1,
borderColor: '#bdbdbd',
tickRenderer: $.jqplot.CanvasAxisTickRenderer,
tickOptions: {
fontSize: '8pt'
}
};
this.cfg.seriesDefaults = {
shadow: false,
lineWidth: 0.7,
smooth: true,
markerOptions: {
shadow: false,
size: 1
}
};
this.cfg.series = [
{
label: '1 minute'
},
{
label: '5 minute'
},
{
label: '15 minute'
}
];
this.cfg.axes = {
yaxis: {
pad: 0,
min: 0,
numberTicks: 11,
tickOptions: {
formatString: "%d"
}
},
xaxis: {
renderer: $.jqplot.DateAxisRenderer,
tickRenderer: $.jqplot.CanvasAxisTickRenderer,
autoscale: true,
min: this.cfg.axes.xaxis.min,
max: this.cfg.axes.xaxis.max,
numberTicks: 24,
tickOptions: {
angle: 70,
showGridline: false,
formatString: '%H:%M:%S'
}
}
};
}
function cpuChartExtender() {
this.cfg.shadow = false;
this.cfg.title = 'CPU Statistics';
this.cfg.seriesColors = ['#97cd96', '#000000', '#807990', '#003eff'];
this.cfg.grid = {
background: '#ffffff',
borderColor: '#ffffff',
gridLineColor: '#e8e8e8',
shadow: false
};
this.cfg.legend = {
show: true,
position: 'sw'
};
this.cfg.axesDefaults = {
borderWidth: 0.1,
borderColor: '#bdbdbd',
tickRenderer: $.jqplot.CanvasAxisTickRenderer,
tickOptions: {
fontSize: '8pt'
}
};
this.cfg.seriesDefaults = {
shadow: false,
lineWidth: 0.3,
smooth: true,
markerOptions: {
shadow: false,
size: 1
}
};
this.cfg.series = [
{
fill: true,
label: 'User'
},
{
label: 'System'
},
{
label: 'Idle'
}
];
this.cfg.axes = {
yaxis: {
pad: 0,
min: 0,
max: 100,
numberTicks: 11,
tickOptions: {
formatString: "%d"
}
},
xaxis: {
renderer: $.jqplot.DateAxisRenderer,
tickRenderer: $.jqplot.CanvasAxisTickRenderer,
autoscale: true,
min: this.cfg.axes.xaxis.min,
max: this.cfg.axes.xaxis.max,
numberTicks: 24,
tickOptions: {
angle: 70,
showGridline: false,
formatString: '%H:%M:%S'
}
}
}
}
function memoryChartExtender() {
this.cfg.shadow = false;
this.cfg.title = 'Memory and Swap Usage';
this.cfg.seriesColors = ['#807990', '#ff9c59', '#ff9c59', '#000000'];
this.cfg.grid = {
background: '#ffffff',
borderColor: '#ffffff',
gridLineColor: '#e8e8e8',
shadow: false
};
this.cfg.legend = {
show: true,
position: 'sw'
};
this.cfg.axesDefaults = {
borderWidth: 0.1,
borderColor: '#bdbdbd',
tickRenderer: $.jqplot.CanvasAxisTickRenderer,
tickOptions: {
fontSize: '8pt'
}
};
this.cfg.seriesDefaults = {
shadow: false,
lineWidth: 1,
smooth: true,
markerOptions: {
shadow: false,
size: 1
}
};
this.cfg.series = [
{
fill: true,
label: 'Memory Usage'
},
{
label: 'Swap Usage'
}
];
this.cfg.axes = {
yaxis: {
min: 0,
max: this.cfg.axes.yaxis.max,
numberTicks: 10
},
xaxis: {
renderer: $.jqplot.DateAxisRenderer,
tickRenderer: $.jqplot.CanvasAxisTickRenderer,
autoscale: true,
min: this.cfg.axes.xaxis.min,
max: this.cfg.axes.xaxis.max,
numberTicks: 24,
tickOptions: {
angle: 70,
showGridline: false,
formatString: '%H:%M:%S'
}
}
}
}
</script>
</ui:composition>
我的问题是，当我在手风琴面板上更改标签时，浏览器将在大约7分钟后挂起。 我用echarts或highchart比较这个点数，库没有这个问题但是primefaces使用jqplot而这个javascript库无法处理！（也许问题是另一回事） （抱歉英文不好） 有什么问题？ 怎么解决这个问题？
尝试在进行ajax调用之前销毁轮询器中的图表。
确保给你的图表一个widgetVar，如widgetVar =“chartCpuWidget”
<p:poll interval="1"
global="false"
update="chartCpu"
onstart="PF('chartCpuWidget').destroy();"
listener="#{cpuChartBean.init}"/>