이 애니메이션을하고 싶습니다. 바다에서 수위가 상승하여 구덩이가있는 작은 산을 삼키고 있습니다. 물이 빠져 나갈 때 일부는 주머니에 남아 있고 다시 수위가 상승하면 다시 하나가됩니다. 이 애니메이션은 무한정 계속됩니다. 이제는 두 가지 접근 방법을 사용하여이 작업을 시도했습니다.HTML5가 전체 합성 작업으로 모양을 겹치고 있습니다.
1) 바다에서 물의 흐름으로 수영장에서 물을 채우고 지우십시오. ctx.bezierCurveTo (x1, y1, x2, y2, end_x, end_y); 물의 흐름으로 첫 번째 및 두 번째 제어점을 변경하여 기저부를 거의 평면에서 구형으로 변경하거나 그 반대로 변경했습니다. 그러나 매끄럽지 않고 두 번째 구덩이는 불규칙한 기초를 가지고있어서 불가능합니다.
2) 물이 채워진 필요한 주머니를 만들고 물이 잠길 때 바닷물과 섞이도 록 불투명도로 연주했습니다. 다시 한번이 접근법은 매끄러운 외관을 제공하지 않습니다.
여기가 같아야 작업은 다음과 같습니다
기본 이미지는 캔버스의 배경이다, 난 그냥 물 흐름을 제어 할 수 있습니다.
할 일을 제안하십시오.
나는 산의 배경 이미지를 가지고 있으므로 그 바닷물과 핏빛 물, 둘 다 반투명. 코드 흐름 - 1) ctx.globalCompositeOperation = "source-out"; 2) 해수 도면 - 상승 및 감소 3) 구덩이 물. 구성 조건 중 어느 것도 일치하지 않으며, 둘 다 짙은 색을 형성하거나 장면에 투명한 구멍을 제공합니다. – user3275442
아 ... 알았어.도면에 알파 (불투명도)가 감소한 경우 축소 된 알파를 사용하여 합성됩니다. 결과는 당신이 얻는 색상 혼합입니다. 수정 : 감소 된 알파 색상을 100 % 알파와 동일한 색상으로 단순화해야합니다. – markE
설명해 주시겠습니까? – user3275442