在高级图表中，如果我第一次添加标志，批注并将其添加到系列中，并且在单击弹出窗口进行删除时，将显示取消，但是在更新后，我将基于savechartoptions调用setannotations函数，然后便会存储批注并标记未存储，因此再次在updatechartdata函数上，我将fags推入系列，然后在更新图表数据后将其还原，但未显示标记弹出窗口。单击标志时，出现错误无法读取未定义的属性'popup'。
问题2：-标记彼此之间生成两次，同时也需要将它们都删除。关于此的任何见解将非常有帮助。
savedChartOptions = {
chart: {
height: $(window).height() - ($(".modal-dialog").outerHeight(true) - $(".modal-dialog").innerHeight()) - $(".modal-header").outerHeight(),
width: $('.modal-header').outerWidth(true),
},
navigation: {
bindings: {
measure: {
annotationsOptions: {
typeOptions: {
background: {
fill: 'rgba(207, 219, 253, 0.5)'
},
label: {
style: {
color: 'Gray40'
}
}
}
}
}
}
},
plotOptions: {
series: {
dataGrouping: {
forced: true
},
lineWidth: 1
}
},
yAxis: [{
gridLineWidth: 0.4,
gridLineColor: '#4d4d4d',
labels: {
align: 'left',
format: '{value:.2f}'
},
height: '80%',
resize: {
enabled: true
}
},
{
gridLineWidth: 0.4,
reversed:false,
labels: {
align: 'left',
format: '{value:.2f}'
},
top: '80%',
height: '20%',
tickAmount :3,
tickPixelInterval:10,
offset: 0
}
],
tooltip: {
shape: 'square',
headerShape: 'callout',
borderWidth: 0,
shadow: false,
enabled: true,
split: true,
shared: true,
useHTML: true,
valueDecimals: 2,
// valueSuffix: ' mm',
formatter: formatToolTip,
positioner: function(width, height, point) {
var chart = this.chart,
position;
if (point.isHeader) {
position = {
x: Math.max(
// Left side limit
chart.plotLeft,
Math.min(
point.plotX + chart.plotLeft - width / 2,
// Right side limit
chart.chartWidth - width - chart.marginRight
)
),
y: point.plotY
};
} else {
position = {
x: point.series.chart.plotLeft,
y: point.series.yAxis.top - chart.plotTop
};
}
return position;
}
},
series: [{
type: scope.chartSeriesType || 'line',
id: 'primary-chart-series',
name: scope.metaData.primaryApplicationChartName || 'Data',
data: scope.primaryApplicationChartData,
dataGrouping:{
approximation: timeIntervalType,
forced: true,
units: [
[scope.timeInterval.timeUnit || 'day', [scope.timeInterval.timeDelta || 1]]
]
}
},
{
type: 'line',
id: 'secondary-chart-series',
name: scope.metaData.secondaryApplicationChartName || 'Data',
data: scope.secondaryApplicationChartData,
dataGrouping:{
approximation: timeIntervalType,
forced: true,
units: [
[scope.timeInterval.timeUnit || 'day', [scope.timeInterval.timeDelta || 1]]
]
},
yAxis: 1
},
{
type: scope.chartSeriesType || 'line',
id: 'compare-primary-chart-series',
name: 'Compare '+scope.metaData.primaryApplicationChartName || 'Data',
data: scope.primaryCompareApplicationChartData,
dataGrouping:{
approximation: timeIntervalType,
forced: true,
units: [
[scope.timeInterval.timeUnit || 'day', [scope.timeInterval.timeDelta || 1]]
]
}
}
],
// saves chart annotations and flags to be later restored
function setChartAnnotations() {
var navigation = stockChart.navigationBindings,
navChart = navigation.chart,
indicators = [],
flags = [];
options = JSON.parse(JSON.stringify(savedChartOptions));//pushing flags into series if type is flags.
navChart.series.forEach(function(series) {
if (series.type === 'flags') {
options.series.push(series.userOptions);
}
});
navChart.yAxis.forEach(function(yAxis) {
if (navigation.utils.isNotNavigatorYAxis(yAxis)) {
options.yAxis.push(yAxis.options);
}
});
navChart.annotations.forEach(function(annotation, index) { //if there is no annotations in options making annotations array empty.
if (!options.annotations) {
options.annotations = [];
}
options.annotations.push(annotation.userOptions);//pushing annotations into annotations array
});
options.navigation.bindings.measure.annotationsOptions.typeOptions.background.fill = 'rgba(207, 219, 253, 0.5)';
}
function updateChartData() {
var series_array = [];
angular.forEach(options.series , function(seriestypeobj){
if(seriestypeobj.type== "flags")
{
series_array.push(seriestypeobj);
}
});
options.series = [{
type: scope.chartSeriesType || 'line',
id: 'aapl-ohlc',
name: scope.metaData.primaryApplicationChartName || 'Data',
data: scope.primaryApplicationChartData,
dataGrouping:{
approximation: timeIntervalType,
forced: true,
units: [
[scope.timeInterval.timeUnit || 'day', [scope.timeInterval.timeDelta || 1]]
]
}
},
{
type: 'line',
id: 'aapl-volume',
name: scope.metaData.secondaryApplicationChartName || 'Data',
data: scope.secondaryApplicationChartData,
dataGrouping:{
approximation: timeIntervalType,
forced: true,
units: [
[scope.timeInterval.timeUnit || 'day', [scope.timeInterval.timeDelta || 1]]
]
},
yAxis: 1
},
{
type: scope.chartSeriesType || 'line',
id: 'compare-primary-chart-series',
name: 'Compare ' + scope.metaData.primaryApplicationChartName || 'Data',
data: scope.primaryCompareApplicationChartData,
dataGrouping:{
approximation: timeIntervalType,
forced: true,
units: [
[scope.timeInterval.timeUnit || 'day', [scope.timeInterval.timeDelta || 1]]
]
}
}
];
options.annotations = options.annotations.concat(series_array);
}
