91 lines
1.9 KiB
JavaScript
91 lines
1.9 KiB
JavaScript
Component({
|
||
properties: {
|
||
canvasId: {
|
||
type: String,
|
||
value: 'ec-canvas'
|
||
},
|
||
ec: {
|
||
type: Object,
|
||
value: {}
|
||
},
|
||
disableTouch: {
|
||
type: Boolean,
|
||
value: false
|
||
}
|
||
},
|
||
|
||
data: {
|
||
isNew: true
|
||
},
|
||
|
||
ready() {
|
||
console.log('ec-canvas ready')
|
||
|
||
if (!this.data.ec) {
|
||
console.warn('组件需绑定 ec 对象')
|
||
return
|
||
}
|
||
|
||
if (!this.data.ec.onInit) {
|
||
console.warn('ec 对象需包含 onInit 方法')
|
||
return
|
||
}
|
||
|
||
const query = this.createSelectorQuery()
|
||
query.select(`#${this.data.canvasId}`)
|
||
.fields({ node: true, size: true })
|
||
.exec((res) => {
|
||
console.log('Canvas query 结果:', res)
|
||
|
||
if (!res || !res[0]) {
|
||
console.error('Canvas 节点未找到')
|
||
return
|
||
}
|
||
|
||
const canvasNode = res[0].node
|
||
const ctx = canvasNode.getContext('2d')
|
||
|
||
const dpr = wx.getSystemInfoSync().pixelRatio
|
||
const width = res[0].width
|
||
const height = res[0].height
|
||
|
||
console.log('Canvas 尺寸信息:', { width, height, dpr })
|
||
|
||
canvasNode.width = width * dpr
|
||
canvasNode.height = height * dpr
|
||
ctx.scale(dpr, dpr)
|
||
|
||
const canvas = {
|
||
width: width * dpr, // 使用缩放后的宽度
|
||
height: height * dpr, // 使用缩放后的高度
|
||
getContext: () => ctx,
|
||
node: canvasNode
|
||
}
|
||
|
||
console.log('准备调用 onInit，canvas 对象:', canvas)
|
||
this.chart = this.data.ec.onInit(canvas, width, height, res)
|
||
console.log('onInit 返回的 chart:', this.chart)
|
||
})
|
||
},
|
||
|
||
methods: {
|
||
touchStart(e) {
|
||
if (this.chart && this.chart.touchStart) {
|
||
this.chart.touchStart(e)
|
||
}
|
||
},
|
||
|
||
touchMove(e) {
|
||
if (this.chart && this.chart.touchMove) {
|
||
this.chart.touchMove(e)
|
||
}
|
||
},
|
||
|
||
touchEnd(e) {
|
||
if (this.chart && this.chart.touchEnd) {
|
||
this.chart.touchEnd(e)
|
||
}
|
||
}
|
||
}
|
||
})
|