2012-07-26 3 views
0

두 개의 라파엘 요소가 서로 겹쳐 질 때 색이 바뀌려고합니다. 여기 내가 가진 코드가있다. 어떤 도움을 주시면 감사하겠습니다.병합 라파엘 직사각형 모양

var loge_1 = rsr.set(); 
loge_1a = rsr.rect(235.457, 287.645, 32.523, 45.486), 
loge_1b = rsr.rect(235.139, 277.626, 32.933, 6.701); 
loge_1.push(loge_1a,loge_1b); 
loge_1.attr(logeFill); 

답변

0

나는 언젠가 일부 대형 SVG 파일을 시도하고 그들은 당신에게 좋은 결과를 줄 것이다 ... 그들은 라파엘 변환을위한 아주 좋은 알고리즘을 가지고 당신이 ReadySetRaphael .... 의심의 코드를 가지고 가정 ... 어쨌든 이것을 시도하십시오 ...

loge_1.mouseover(function(){ 
    loge_1.attr({'fill':'your Desired Color'}); 
} 
loge_1.mouseout(function(){ 
    loge_1.attr({'fill':'original color'}); 
} 

이것은 두 rect의 색상을 변경해야합니다 .... 도움이 되길 바랍니다.

+0

응답 해 주셔서 감사합니다. 그러나 제가 찾고있는 것은 아닙니다. 당신은 이것이 ReadySetRaphael에서 나온 것이 맞습니다. 그러나이 두 사각형이 하나의 요소처럼 작동하도록하려고합니다. 그래서 하나의 사각형 위로 마우스를 가져 가면 색상이 바뀌고, 마우스가 바뀌면 양쪽 모두 정상으로 돌아갑니다. 결합하기가 매우 쉬운 경로를 사용하여이 작업을 수행 할 수 있었지만 직사각형은 좀 더 어려워졌습니다. [여기에 내 svg의 링크가 내가 무엇을하려고하는지에 대한 아이디어를 얻을 수 있습니다] (http://jsfiddle.net/knottAverage/ArKDp/37/) – user1431083

+0

여기에 귀하의 피들 http : // jsfiddle 빠른 수정입니다 .net/ArKDp/40/.... Raphael 세트는 당신이하고있는 것처럼 'this'로 참조 될 수 없습니다 ... 모양을 가지고 이것이 당신이 찾고있는 것이라면 저에게 알려주세요 .... 이벤트는 개별 요소에 묶여 있으므로 이벤트를 트리거하는 요소가 아니라 집합을 참조하지 않습니다. – Aukhan

+0

Yah 방법이 더 효과적이며 도움을 주셔서 감사합니다! – user1431083

0

검색 후에도 주제가별로 없습니다. 그래서 svg 요소를 읽고 "rect"를 "path"로 변경했습니다. And here is the jsfiddle with "path"

Here is the W3C svg documentation 난 그냥 어도비 AI에 SVG 파일을 열어 내 사각형 경로를 찾을 수 있습니다. 그런 다음 내 문서 단위가 픽셀로 설정되었는지 확인했습니다. 거기에서 내 정보 창이 열리고 내 사각형 x & y의 내 앵커 포인트가 복사되어 "경로"에 배치되고 presto에 2 개의 도형이 하나의 역할을합니다.