refactor:去除3D组件对旋转属性的监测(冗余),修改g2图表默认perspective值

main
zhu.yawen 1 year ago
parent ee94bca432
commit dade1b89fd

@ -71,50 +71,6 @@ export default {
this.changeStyle(this.config, true)
}
}
},
'config.rotateX': {
deep: true,
handler (val) {
const dom = document.querySelector('#' + this.config.code)
const rotate = `rotateX(${this.config.rotateX}deg) rotateY(${this.config.rotateY}deg) rotateZ(${this.config.rotateZ}deg)`
const regex = /rotateX\(\d+deg\) rotateY\(\d+deg\) rotateZ\(\d+deg\)/g
// transform
const result = dom.style.transform.replace(regex, '')
dom.style.transform = result + ' ' + rotate
}
},
'config.rotateY': {
deep: true,
handler (val) {
const dom = document.querySelector('#' + this.config.code)
const rotate = `rotateX(${this.config.rotateX}deg) rotateY(${this.config.rotateY}deg) rotateZ(${this.config.rotateZ}deg)`
const regex = /rotateX\(\d+deg\) rotateY\(\d+deg\) rotateZ\(\d+deg\)/g;
const result = dom.style.transform.replace(regex, '')
dom.style.transform = result + ' ' + rotate
}
},
'config.rotateZ': {
deep: true,
handler (val) {
const dom = document.querySelector('#' + this.config.code)
const rotate = `rotateX(${this.config.rotateX}deg) rotateY(${this.config.rotateY}deg) rotateZ(${this.config.rotateZ}deg)`
const regex = /rotateX\(\d+deg\) rotateY\(\d+deg\) rotateZ\(\d+deg\)/g
const result = dom.style.transform.replace(regex, '')
dom.style.transform = result + ' ' + rotate
}
},
'config.perspective': {
deep: true,
handler (val) {
const dom = document.querySelector('#' + this.config.code)
// translate
const translateReg = /translate\((.*?)\)/
const translateResult = dom.style.transform.match(translateReg)
const rotateReg = /rotateX\(\d+deg\) rotateY\(\d+deg\) rotateZ\(\d+deg\)/g
const rotateResult = dom.style.transform.match(rotateReg)
const transform = translateResult[0] + ' ' + 'perspective(' + this.config.perspective + 'px)' + ' ' + rotateResult[0]
dom.style.transform = transform
}
}
},
mounted () {

@ -44,7 +44,7 @@ function getPlotList (files) {
rotateX: config.rotateX || 0,
rotateY: config.rotateY || 0,
rotateZ: config.rotateZ || 0,
perspective: config.perspective || 500,
perspective: config.perspective || 0,
type: 'customComponent',
chartType: config.chartType,
loading: false,

Loading…
Cancel
Save