音波修改

src/page-instrument/view-evaluat-report/component/share-top/index.tsx

@@ -123,10 +123,10 @@ export default defineComponent({
 			canvasDom.width = width
 			canvasDom.height = height
 			// audio
-			let audioCtx : AudioContext | null = null
-			let analyser : AnalyserNode | null = null
-			let source : MediaElementAudioSourceNode | null = null
-			const dataArray = new Uint8Array(fftSize / 2)
+			// let audioCtx : AudioContext | null = null
+			// let analyser : AnalyserNode | null = null
+			// let source : MediaElementAudioSourceNode | null = null
+			// const dataArray = new Uint8Array(fftSize / 2)
 			const draw = (data: Uint8Array, ctx: CanvasRenderingContext2D, { lineGap, canvWidth, canvHeight, canvFillColor, lineColor }: propsType) => {
 				if (!ctx) return
 				const w = canvWidth
@@ -173,8 +173,8 @@ export default defineComponent({
 			}
 			const requestAnimationFrameFun = () => {
 				requestAnimationFrame(() => {
-					analyser?.getByteFrequencyData(dataArray)
-					draw(dataArray, canvasCtx, {
+					//analyser?.getByteFrequencyData(dataArray)
+					draw(generateMixedData(48), canvasCtx, {
 						lineGap: 2,
 						canvWidth: width,
 						canvHeight: height,
@@ -188,14 +188,14 @@ export default defineComponent({
 			}
 			let isPause = true
 			const playVisualDraw = () => {
-				if (!audioCtx) {
-					audioCtx = new AudioContext()
-					source = audioCtx.createMediaElementSource(audioDom)
-					analyser = audioCtx.createAnalyser()
-					analyser.fftSize = fftSize
-					source?.connect(analyser)
-					analyser.connect(audioCtx.destination)
-				}
+				// if (!audioCtx) {
+				// 	audioCtx = new AudioContext()
+				// 	source = audioCtx.createMediaElementSource(audioDom)
+				// 	analyser = audioCtx.createAnalyser()
+				// 	analyser.fftSize = fftSize
+				// 	source?.connect(analyser)
+				// 	analyser.connect(audioCtx.destination)
+				// }
 				//audioCtx.resume()  // 重新更新状态   加了暂停和恢复音频音质发生了变化  所以这里取消了
 				isPause = false
 				requestAnimationFrameFun()
@@ -214,7 +214,18 @@ export default defineComponent({
 				pauseVisualDraw
 			}
 		}
-
+    function generateMixedData(size:number) {
+      const dataArray = new Uint8Array(size);
+      const noiseAmplitude = 30;
+      const frequency = 0.1;
+      const amplitude = 128;
+      for (let i = 0; i < size; i++) {
+          const noise = Math.floor(Math.random() * noiseAmplitude);
+          const wave = amplitude * (0.5 + 0.5 * Math.sin(frequency * i));
+          dataArray[i] = Math.min(255, Math.max(0, Math.floor(wave + noise)));
+      }
+      return dataArray;
+    }
     return () => (
       <>
         <div class={[styles.headerTop, browserInfo.android && styles.android]}>
@@ -233,7 +244,7 @@ export default defineComponent({
 
           {/* 音准、节奏、完整度纬度 */}
 
-          <div class={[styles.middle, isPad.value && styles.padMiddle]}>
+          <div class={[styles.middle, isPad && styles.padMiddle]}>
             {state.isPercussion ? null : (
               <div onClick={() => handleChange("intonation")} class={[styles.cItem, "evaluting-report-1", itemType.value === "intonation" && styles.active]}>
                 <span class={styles.mScore}>{scoreData.value.intonation}分</span>
@@ -436,7 +447,7 @@ export default defineComponent({
               shareData._plrl?.pause();
             }}
           >
-            <div class={[styles.playerBox, isPad.value && styles.padPlayerBox]}>
+            <div class={[styles.playerBox, isPad && styles.padPlayerBox]}>
               {mediaType.value === "audio" ? (
                 <div class={styles.audioBox}>
                   <canvas class={styles.audioVisualizer} id="audioVisualizer"></canvas>