로티이미지는 gif보다 가벼운 용량으로 애니메이션 효과를 줄수 있는 이미지이다. 로티이미지는 json형태로 배포되기도 한다. 이때 단순한 이미지의 색을 변경하고 싶을 수 있다. 이때 json 내부의 스타일을 변경해서 문제를 해결할수 있다.
#lottie 이미지 json 데이터
{"v":"5.3.4","fr":60,"ip":0,"op":90,"w":1200,"h":1200,"nm":"image upload","ddd":0,"assets":[],"layers":[{"ddd":0,"ind":1,"ty":4,"nm":"tick","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":80,"s":[0],"e":[100]},{"t":90.0000036657751}],"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[599.9999999999997,599.9999999999997,0],"ix":2},"a":{"a":0,"k":[256,256,0],"ix":1},"s":{"a":0,"k":[99.99999999999994,99.99999999999994,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[118.858,-107.5],[-50.33,107.5],[-118.857,20.442]],"c":false},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"st","c":{"a":0,"k":[0.058823529411764705,0.29411764705882354,0.5686274509803921,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":40,"ix":5},"lc":2,"lj":2,"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"tr","p":{"a":0,"k":[258.857,267.611],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"tick","np":2,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":150.000006109625,"op":150.000006109625,"st":0,"bm":0,"hidden":0},{"ddd":0,"ind":2,"ty":4,"nm":"Shape Layer 1","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":65,"s":[100],"e":[0]},{"t":80.0000032584668}],"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":1,"k":[{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"n":"0p833_0p833_0p167_0p167","t":10,"s":[599.9999999999997,807.9999999999994,0],"e":[600,409,0],"to":[0,-66.5,0],"ti":[0,66.5,0]},{"t":60.0000024438501}],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":1,"k":[{"i":{"x":[0.833,0.833,0.833],"y":[0.833,0.833,0.833]},"o":{"x":[0.167,0.167,0.167],"y":[0.167,0.167,0.167]},"n":["0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167"],"t":0,"s":[0,99.99999999999994,100],"e":[119.99999999999996,99.99999999999994,100]},{"i":{"x":[0.833,0.833,0.833],"y":[0.833,0.833,0.833]},"o":{"x":[0.167,0.167,0.167],"y":[0.167,0.167,0.167]},"n":["0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167"],"t":10,"s":[119.99999999999996,99.99999999999994,100],"e":[119.99999999999996,99.99999999999994,100]},{"i":{"x":[0.833,0.833,0.833],"y":[0.833,0.833,0.833]},"o":{"x":[0.167,0.167,0.167],"y":[0.167,0.167,0.167]},"n":["0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167","0p833_0p833_0p167_0p167"],"t":65,"s":[119.99999999999996,99.99999999999994,100],"e":[0,99.99999999999994,100]},{"t":80.0000032584668}],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[562.727,33.344],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":20,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,1,1,1],"ix":4,"x":"var $bm_rt;\n$bm_rt = thisComp.layer('image ready').content('image frame').content('sun').content('Fill 1').color;"},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[-0.637,-9.328],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle 1","np":2,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":150.000006109625,"st":0,"bm":0},{"ddd":0,"ind":3,"ty":4,"nm":"image ready","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":80,"s":[100],"e":[0]},{"t":90.0000036657751}],"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[599.9999999999997,599.9999999999997,0],"ix":2},"a":{"a":0,"k":[256,256,0],"ix":1},"s":{"a":0,"k":[99.99999999999994,99.99999999999994,100],"ix":6}},"ao":0,"hasMask":true,"masksProperties":[{"inv":false,"mode":"a","pt":{"a":1,"k":[{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"n":"0p833_0p833_0p167_0p167","t":10,"s":[{"i":[[0,0],[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0],[0,0]],"v":[[0,476],[0,476.001],[512,476.001],[512,476]],"c":true}],"e":[{"i":[[0,0],[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0],[0,0]],"v":[[0,36],[0,476.001],[512,476.001],[512,36]],"c":true}]},{"t":60.0000024438501}],"ix":1},"o":{"a":0,"k":100,"ix":3},"x":{"a":0,"k":0,"ix":4},"nm":"Mask 1"}],"shapes":[{"ty":"gr","it":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[-11.028,0],[0,-11.028],[11.028,0],[0,11.028]],"o":[[11.028,0],[0,11.028],[-11.028,0],[0,-11.028]],"v":[[0,-20],[20,0],[0,20],[-20,0]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ind":1,"ty":"sh","ix":2,"ks":{"a":0,"k":{"i":[[-33.084,0],[0,33.084],[33.084,0],[0,-33.084]],"o":[[33.084,0],[0,-33.084],[-33.084,0],[0,33.084]],"v":[[0,60],[60,0],[0,-60],[-60,0]],"c":true},"ix":2},"nm":"Path 2","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"mm","mm":1,"nm":"Merge Paths 1","mn":"ADBE Vector Filter - Merge","hd":false},{"ty":"fl","c":{"a":0,"k":[0.058823529411764705,0.29411764705882354,0.5686274509803921,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[140,168],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"sun","np":4,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false},{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[0,0],[0,22.056],[0,0],[-22.056,0],[0,0],[0,-22.056],[0,0],[0,0],[6.037,-0.091],[3.723,-4.736],[0,0],[0,0],[6.202,0],[0,0],[3.784,-4.919],[0,0],[-8.755,-6.735],[-6.734,8.755],[0,0],[0,0]],"o":[[-22.056,0],[0,0],[0,-22.056],[0,0],[22.056,0],[0,0],[0,0],[-3.87,-4.618],[-6.024,0.094],[0,0],[0,0],[-3.786,-4.913],[0,0],[-6.206,0.003],[0,0],[-6.734,8.755],[8.757,6.735],[0,0],[0,0],[0,0]],"v":[[-176,180],[-216,140],[-216,-140],[-176,-180],[176,-180],[216,-140],[216,-14.993],[137.327,-108.848],[121.687,-115.998],[106.278,-108.362],[-47.84,87.664],[-100.16,19.789],[-116,11.999],[-116.01,11.999],[-131.853,19.805],[-175.868,77.023],[-172.21,105.07],[-144.163,101.413],[-115.984,64.78],[-27.168,180]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ind":1,"ty":"sh","ix":2,"ks":{"a":0,"k":{"i":[[11.046,0],[0,-11.046],[22.056,0],[0,0],[0,0],[0,0],[0,0],[-0.205,-0.226],[0,0],[-0.025,-0.027],[-2.315,-1.079],[-2.776,-0.092],[-0.051,-0.001],[-0.008,-0.001],[-1.413,0.27],[0,0],[-0.064,0.013],[-0.026,0.005],[-0.054,0.012],[-0.03,0.007],[-0.049,0.011],[-0.034,0.009],[-0.043,0.01],[-0.038,0.009],[-0.041,0.01],[-0.038,0.01],[-0.042,0.011],[-0.038,0.01],[0,0],[-0.04,0.011],[-0.039,0.011],[-0.033,0.01],[-0.048,0.015],[-0.026,0.008],[-0.05,0.016],[-0.03,0.01],[-0.049,0.016],[-0.023,0.007],[-0.055,0.018],[-0.021,0.008],[-0.056,0.021],[-0.018,0.007],[-0.061,0.023],[0,0],[-0.068,0.027],[-0.004,0.002],[-0.073,0.031],[-0.844,0.499],[-0.012,0.007],[-0.057,0.035],[-0.932,0.842],[-0.017,0.015],[-0.015,0.013],[-1.085,2.33],[-0.088,2.788],[-0.001,0.036],[0,0.022],[-0.001,0.068],[0,0],[0,0.106],[0,0],[44.112,0],[0,0],[0,-44.113],[0,0],[-44.112,0],[0,0],[-0.047,0],[-0.063,0.001],[0,0],[0,44.112]],"o":[[-11.046,0],[0,22.056],[0,0],[0,0],[0,0],[0,0],[0.195,0.236],[0,0],[0.024,0.027],[1.821,1.989],[2.378,1.112],[0.051,0.002],[0.009,0],[1.429,0.036],[0,0],[0.063,-0.012],[0.024,-0.005],[0.054,-0.011],[0.03,-0.007],[0.05,-0.011],[0.035,-0.008],[0.044,-0.01],[0.038,-0.009],[0.041,-0.01],[0.038,-0.01],[0.042,-0.011],[0.038,-0.01],[0,0],[0.041,-0.012],[0.04,-0.011],[0.032,-0.009],[0.049,-0.015],[0.027,-0.008],[0.05,-0.015],[0.03,-0.01],[0.049,-0.016],[0.023,-0.008],[0.055,-0.019],[0.021,-0.007],[0.057,-0.019],[0.018,-0.007],[0.062,-0.023],[0,0],[0.068,-0.026],[0.004,-0.001],[0.073,-0.029],[0.889,-0.362],[0.012,-0.007],[0.057,-0.034],[1.078,-0.654],[0.017,-0.014],[0.015,-0.014],[2.005,-1.829],[1.115,-2.387],[0.001,-0.037],[0,-0.023],[0.001,-0.068],[0,0],[0.001,-0.105],[0,0],[0,-44.112],[0,0],[-44.112,0],[0,0],[0,44.112],[0,0],[0.047,0],[0.063,0],[0,0],[44.112,0],[0,-11.047]],"v":[[236,120],[216,140],[176,180],[23.335,180],[-22.65,120.344],[122.497,-64.274],[220.563,52.717],[221.163,53.411],[221.184,53.435],[221.258,53.516],[227.534,58.125],[235.322,59.987],[235.475,59.992],[235.501,59.992],[239.777,59.643],[239.83,59.633],[240.018,59.596],[240.094,59.58],[240.256,59.546],[240.346,59.526],[240.493,59.492],[240.597,59.468],[240.729,59.437],[240.842,59.409],[240.966,59.378],[241.079,59.348],[241.204,59.315],[241.318,59.284],[241.436,59.252],[241.558,59.217],[241.676,59.182],[241.773,59.154],[241.92,59.109],[242,59.083],[242.149,59.036],[242.239,59.007],[242.387,58.958],[242.456,58.935],[242.622,58.878],[242.685,58.855],[242.854,58.794],[242.908,58.775],[243.092,58.706],[243.123,58.694],[243.327,58.615],[243.339,58.609],[243.558,58.521],[246.161,57.229],[246.197,57.208],[246.368,57.105],[249.389,54.855],[249.439,54.811],[249.484,54.77],[254.127,48.458],[255.988,40.641],[255.991,40.534],[255.992,40.466],[255.996,40.26],[255.996,40.255],[255.997,39.939],[255.997,-140],[175.997,-220],[-176,-220],[-256,-140],[-256,140],[-176,220],[13.374,220],[13.515,220.001],[13.703,220],[176,220],[256,140]],"c":true},"ix":2},"nm":"Path 2","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"mm","mm":1,"nm":"Merge Paths 1","mn":"ADBE Vector Filter - Merge","hd":false},{"ty":"fl","c":{"a":0,"k":[1,1,1,1],"ix":4,"x":"var $bm_rt;\n$bm_rt = content('image frame').content('sun').content('Fill 1').color;"},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[256,256],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"image","np":4,"cix":2,"ix":2,"mn":"ADBE Vector Group","hd":false},{"ty":"tr","p":{"a":0,"k":[256,256.001],"ix":2},"a":{"a":0,"k":[256,256.001],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"image frame","np":2,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":150.000006109625,"st":0,"bm":0},{"ddd":0,"ind":4,"ty":4,"nm":"image","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":80,"s":[15],"e":[5]},{"t":90.0000036657751}],"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[599.9999999999997,599.9999999999997,0],"ix":2},"a":{"a":0,"k":[256,256,0],"ix":1},"s":{"a":0,"k":[99.99999999999994,99.99999999999994,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[-11.028,0],[0,-11.028],[11.028,0],[0,11.028]],"o":[[11.028,0],[0,11.028],[-11.028,0],[0,-11.028]],"v":[[0,-20],[20,0],[0,20],[-20,0]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ind":1,"ty":"sh","ix":2,"ks":{"a":0,"k":{"i":[[-33.084,0],[0,33.084],[33.084,0],[0,-33.084]],"o":[[33.084,0],[0,-33.084],[-33.084,0],[0,33.084]],"v":[[0,60],[60,0],[0,-60],[-60,0]],"c":true},"ix":2},"nm":"Path 2","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"mm","mm":1,"nm":"Merge Paths 1","mn":"ADBE Vector Filter - Merge","hd":false},{"ty":"fl","c":{"a":0,"k":[0.109999997008,0.109999997008,0.109999997008,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[140,168],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"sun","np":4,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false},{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[0,0],[0,22.056],[0,0],[-22.056,0],[0,0],[0,-22.056],[0,0],[0,0],[6.037,-0.091],[3.723,-4.736],[0,0],[0,0],[6.202,0],[0,0],[3.784,-4.919],[0,0],[-8.755,-6.735],[-6.734,8.755],[0,0],[0,0]],"o":[[-22.056,0],[0,0],[0,-22.056],[0,0],[22.056,0],[0,0],[0,0],[-3.87,-4.618],[-6.024,0.094],[0,0],[0,0],[-3.786,-4.913],[0,0],[-6.206,0.003],[0,0],[-6.734,8.755],[8.757,6.735],[0,0],[0,0],[0,0]],"v":[[-176,180],[-216,140],[-216,-140],[-176,-180],[176,-180],[216,-140],[216,-14.993],[137.327,-108.848],[121.687,-115.998],[106.278,-108.362],[-47.84,87.664],[-100.16,19.789],[-116,11.999],[-116.01,11.999],[-131.853,19.805],[-175.868,77.023],[-172.21,105.07],[-144.163,101.413],[-115.984,64.78],[-27.168,180]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ind":1,"ty":"sh","ix":2,"ks":{"a":0,"k":{"i":[[11.046,0],[0,-11.046],[22.056,0],[0,0],[0,0],[0,0],[0,0],[-0.205,-0.226],[0,0],[-0.025,-0.027],[-2.315,-1.079],[-2.776,-0.092],[-0.051,-0.001],[-0.008,-0.001],[-1.413,0.27],[0,0],[-0.064,0.013],[-0.026,0.005],[-0.054,0.012],[-0.03,0.007],[-0.049,0.011],[-0.034,0.009],[-0.043,0.01],[-0.038,0.009],[-0.041,0.01],[-0.038,0.01],[-0.042,0.011],[-0.038,0.01],[0,0],[-0.04,0.011],[-0.039,0.011],[-0.033,0.01],[-0.048,0.015],[-0.026,0.008],[-0.05,0.016],[-0.03,0.01],[-0.049,0.016],[-0.023,0.007],[-0.055,0.018],[-0.021,0.008],[-0.056,0.021],[-0.018,0.007],[-0.061,0.023],[0,0],[-0.068,0.027],[-0.004,0.002],[-0.073,0.031],[-0.844,0.499],[-0.012,0.007],[-0.057,0.035],[-0.932,0.842],[-0.017,0.015],[-0.015,0.013],[-1.085,2.33],[-0.088,2.788],[-0.001,0.036],[0,0.022],[-0.001,0.068],[0,0],[0,0.106],[0,0],[44.112,0],[0,0],[0,-44.113],[0,0],[-44.112,0],[0,0],[-0.047,0],[-0.063,0.001],[0,0],[0,44.112]],"o":[[-11.046,0],[0,22.056],[0,0],[0,0],[0,0],[0,0],[0.195,0.236],[0,0],[0.024,0.027],[1.821,1.989],[2.378,1.112],[0.051,0.002],[0.009,0],[1.429,0.036],[0,0],[0.063,-0.012],[0.024,-0.005],[0.054,-0.011],[0.03,-0.007],[0.05,-0.011],[0.035,-0.008],[0.044,-0.01],[0.038,-0.009],[0.041,-0.01],[0.038,-0.01],[0.042,-0.011],[0.038,-0.01],[0,0],[0.041,-0.012],[0.04,-0.011],[0.032,-0.009],[0.049,-0.015],[0.027,-0.008],[0.05,-0.015],[0.03,-0.01],[0.049,-0.016],[0.023,-0.008],[0.055,-0.019],[0.021,-0.007],[0.057,-0.019],[0.018,-0.007],[0.062,-0.023],[0,0],[0.068,-0.026],[0.004,-0.001],[0.073,-0.029],[0.889,-0.362],[0.012,-0.007],[0.057,-0.034],[1.078,-0.654],[0.017,-0.014],[0.015,-0.014],[2.005,-1.829],[1.115,-2.387],[0.001,-0.037],[0,-0.023],[0.001,-0.068],[0,0],[0.001,-0.105],[0,0],[0,-44.112],[0,0],[-44.112,0],[0,0],[0,44.112],[0,0],[0.047,0],[0.063,0],[0,0],[44.112,0],[0,-11.047]],"v":[[236,120],[216,140],[176,180],[23.335,180],[-22.65,120.344],[122.497,-64.274],[220.563,52.717],[221.163,53.411],[221.184,53.435],[221.258,53.516],[227.534,58.125],[235.322,59.987],[235.475,59.992],[235.501,59.992],[239.777,59.643],[239.83,59.633],[240.018,59.596],[240.094,59.58],[240.256,59.546],[240.346,59.526],[240.493,59.492],[240.597,59.468],[240.729,59.437],[240.842,59.409],[240.966,59.378],[241.079,59.348],[241.204,59.315],[241.318,59.284],[241.436,59.252],[241.558,59.217],[241.676,59.182],[241.773,59.154],[241.92,59.109],[242,59.083],[242.149,59.036],[242.239,59.007],[242.387,58.958],[242.456,58.935],[242.622,58.878],[242.685,58.855],[242.854,58.794],[242.908,58.775],[243.092,58.706],[243.123,58.694],[243.327,58.615],[243.339,58.609],[243.558,58.521],[246.161,57.229],[246.197,57.208],[246.368,57.105],[249.389,54.855],[249.439,54.811],[249.484,54.77],[254.127,48.458],[255.988,40.641],[255.991,40.534],[255.992,40.466],[255.996,40.26],[255.996,40.255],[255.997,39.939],[255.997,-140],[175.997,-220],[-176,-220],[-256,-140],[-256,140],[-176,220],[13.374,220],[13.515,220.001],[13.703,220],[176,220],[256,140]],"c":true},"ix":2},"nm":"Path 2","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"mm","mm":1,"nm":"Merge Paths 1","mn":"ADBE Vector Filter - Merge","hd":false},{"ty":"fl","c":{"a":0,"k":[0.109999997008,0.109999997008,0.109999997008,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[256,256],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"image","np":4,"cix":2,"ix":2,"mn":"ADBE Vector Group","hd":false},{"ty":"tr","p":{"a":0,"k":[256,256.001],"ix":2},"a":{"a":0,"k":[256,256.001],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"image frame","np":2,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":150.000006109625,"st":0,"bm":0}],"markers":[]}위 데이터는 로티 이미지의 코드이다. 여기 데이터에서 color를 검색해보면 아래와 같은 코드를 찾을수 있다.
{"ty":"fl","c":{"a":0,"k":[0.470588237047,0.878431379795,0.560784339905,1],"ix":4,"x":"var $bm_rt;\n$bm_rt = thisComp.layer('image ready').content('image frame').content('sun').content('Fill 1').color;"}여기서 "k"다음에 나오는 항목이 색에 관한 항목이다.
파란색을 나타낸다.
"k":[0.470588237047,0.878431379795,0.560784339905,1]
검은색을 나타낸다.
"k":[0,0,0,1]
흰색을 나타낸다.
"k":[1,1,1,1]여기서 몇가지 속성들을 더 설명하면 다음과 같다.
c: 이것은 "컬러(color)"의 약자로, 여기서는 색상 관련 정보가 포함되어 있습니다.
a: "알파(alpha)"의 약자로, 색상의 투명도를 나타냅니다. 여기서는 0으로 설정되어 있으므로 완전히 불투명한 색상임을 의미합니다.
k: 실제 색상 값이 포함된 배열입니다. RGBA 형식으로 표현되며, 여기서는 [0.470588237047, 0.878431379795, 0.560784339905, 1]으로 설정되어 있습니다. 각 숫자는 빨간색, 녹색, 파란색, 알파(투명도) 값을 나타냅니다. 이 경우에는 각각의 값이 0에서 1 사이의 실수로 표현됩니다.
ix: 이것은 "인덱스(index)"의 약자로, 일반적으로 해당 속성의 인덱스를 나타냅니다. 여기서는 4로 설정되어 있습니다.
x: 이것은 표현식의 일부로, 색상 값을 동적으로 설정할 때 사용됩니다. 여기서는 변수 $bm_rt를 사용하여 다른 레이어의 특정 요소의 색상 값을 가져오고 있습니다. 그리고 이 값을 이 색상에 적용하고 있습니다.
마음맘은 히피인 일꾼러