|
@@ -71,6 +71,9 @@ export default {
|
|
|
//截面散点设置英文props
|
|
|
enChartInfo: {},
|
|
|
enEdblist:[],
|
|
|
+
|
|
|
+
|
|
|
+ chartSVGDataMap:{}
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
@@ -592,7 +595,8 @@ export default {
|
|
|
this.initChart(
|
|
|
`chart_${index}_${item.position}`,
|
|
|
this.optionMap[item.chartId],
|
|
|
- page
|
|
|
+ page,
|
|
|
+ item.chartId
|
|
|
)
|
|
|
}else{
|
|
|
//显示图表已被删除
|
|
@@ -604,7 +608,7 @@ export default {
|
|
|
|
|
|
});
|
|
|
},
|
|
|
- initChart(refName, options, page) {
|
|
|
+ initChart(refName, options, page,chartId="") {
|
|
|
console.log("refName", refName);
|
|
|
const index = this.pageList.findIndex((i) => i.id === page.id)
|
|
|
if(index===-1) return
|
|
@@ -743,6 +747,37 @@ export default {
|
|
|
...secialBarOpt
|
|
|
});
|
|
|
|
|
|
+
|
|
|
+ if(isPublish&&chartId){
|
|
|
+ const {clientWidth,clientHeight} = $(`#${refName}`)[0]
|
|
|
+ const {plotBackgroundColor} = chartTheme&&chartTheme.drawOption||{}
|
|
|
+ const svgData = chart.getSVG({
|
|
|
+ chart:{
|
|
|
+ width:clientWidth,
|
|
|
+ height:clientHeight,
|
|
|
+ backgroundColor:null,
|
|
|
+ plotBorderColor:null,
|
|
|
+ plotBackgroundColor:null,
|
|
|
+ plotBackgroundImage:null,
|
|
|
+ plotBorderWidth:null,
|
|
|
+ plotShadow:false,
|
|
|
+ animation: false,
|
|
|
+ }
|
|
|
+ })
|
|
|
+ let parser = new DOMParser();
|
|
|
+ let svgDoc = parser.parseFromString(svgData, 'image/svg+xml');
|
|
|
+
|
|
|
+ // 查找class为'background'的rect元素并修改fill属性
|
|
|
+ var rectElement = svgDoc.querySelector('rect.highcharts-plot-background');
|
|
|
+ if (rectElement) {
|
|
|
+ rectElement.setAttribute('fill', plotBackgroundColor);
|
|
|
+ }
|
|
|
+
|
|
|
+ // 将修改后的SVG文档转换回字符串
|
|
|
+ var serializer = new XMLSerializer();
|
|
|
+ var updatedSvgCode = serializer.serializeToString(svgDoc);
|
|
|
+ this.chartSVGDataMap[chartId] = updatedSvgCode
|
|
|
+ }
|
|
|
});
|
|
|
},
|
|
|
initImages(elements,page){
|