JavaFX에서 onMouseEntered 이벤트로 SVG 경로를 다시 채우기

Question

.fxml 문서 (NetBeans가있는 .svg 파일로 생성 됨)가 포함 된 개인 프로젝트에서 작업하고 있습니다. 여기서 볼 수 있듯이 Map이 있습니다. 또한 모든 지역은 .fxml 파일의 SVG 경로로 변환됩니다. 문제는 내가 컨트롤러 클래스와 함께 JavaFX 씬 빌더를 사용하여 마우스 이벤트를 처리 할 수 ​​있지만 마우스를 입력 할 때마다 리필 (또는 다른 말로 다시 칠하거나 강조 표시)하고 싶습니다. 다음은 메인 클래스입니다.

public class JavaFXApplication1 extends Application { 

    @Override 
    public void start(Stage primaryStage) throws IOException { 
     Parent root = FXMLLoader.load(getClass().getResource("Risk3.fxml")); 

     Scene scene = new Scene(root); 

     primaryStage.setScene(scene); 
     primaryStage.show(); 
    } 

    /** 
    * The main() method is ignored in correctly deployed JavaFX application. 
    * main() serves only as fallback in case the application can not be 
    * launched through deployment artifacts, e.g., in IDEs with limited FX 
    * support. NetBeans ignores main(). 
    * 
    * @param args the command line arguments 
    */ 
    public static void main(String[] args) { 
     launch(args); 
    } 
} 

두 번째로 MouseEventListener가 포함 된 컨트롤러 클래스입니다.

import java.net.URL; 
import java.util.ResourceBundle; 
import javafx.fxml.Initializable; 
import javafx.event.ActionEvent; 
import javafx.fxml.FXML; 
import javafx.scene.input.MouseEvent; 


public class RiskControllerClass implements Initializable { 

    @FXML 
    private void onMouseEntered(MouseEvent event){ 

     System.out.println("Entered"); 
    } 


    @Override // This method is called by the FXMLLoader when initialization is complete 
    public void initialize(URL fxmlFileLocation, ResourceBundle resources) { 

     // initialize your logic here: all @FXML variables will have been injected 

    } 

} 

마지막 risk3.fxml 코드의 작은 조각은 (는 약 400 라인을 포함 원인 난 전체 코드를 삽입하지 않았다) 마우스가 그 지역에 입력 될 때마다 지역 :

<Group id="Document" xmlns:fx="http://javafx.com/fxml" fx:controller="javafxapplication1.RiskControllerClass"> 
    <children> 
    <fx:define /> 
    <SVGPath id="path3619" content=" M 0.00 0.00 L 1227.00 0.00 L 1227.00 116.00 C 1193.33 116.02 1159.67 115.98 1126.01 115.98 C 1126.01 116.49 1126.01 117.51 1126.01 118.02 C 1159.67 118.02 1193.33 117.98 1227.00 118.00 L 1227.00 628.00 L 0.00 628.00 L 0.00 99.32 C 6.64 98.86 13.31 98.87 19.94 98.17 C 13.30 97.62 6.65 97.18 0.00 96.77 L 0.00 0.00 Z" fill="#fefefe" opacity="1" /> 
    <SVGPath id="Greenland" fx:id="NA_3" content=" M 490.36 12.46 C 498.61 10.77 507.24 11.00 515.18 14.01 C 521.63 16.48 528.57 16.75 535.40 16.59 C 528.77 19.68 518.49 18.59 515.31 26.31 C 513.31 35.41 505.40 42.75 496.05 43.54 C 494.29 43.74 492.54 43.89 490.79 44.07 C 492.13 45.12 493.49 46.14 494.88 47.13 C 497.56 48.99 500.21 50.91 502.59 53.15 C 496.88 54.51 492.53 49.95 487.23 48.96 C 487.58 50.14 487.97 51.32 488.35 52.50 C 487.09 53.33 485.84 54.19 484.61 55.05 C 487.66 55.42 490.74 55.44 493.82 55.39 C 494.59 56.15 495.36 56.91 496.14 57.67 C 488.33 59.20 480.53 60.86 472.60 61.64 C 466.66 61.37 461.70 64.93 456.76 67.65 C 450.04 72.64 440.50 70.51 434.09 76.10 C 427.61 80.45 425.88 89.18 418.99 93.04 C 416.46 95.26 413.44 92.97 410.93 92.14 C 407.42 90.63 403.72 88.42 402.32 84.66 C 401.17 81.34 401.99 77.81 401.87 74.40 C 401.93 71.95 401.45 69.18 403.02 67.07 C 406.32 62.99 412.51 61.72 414.69 56.70 C 415.51 53.13 412.52 50.23 410.80 47.42 C 407.58 42.35 406.54 34.86 400.01 33.00 C 392.79 31.70 385.33 32.99 378.16 31.22 C 378.29 29.53 378.41 27.84 378.51 26.15 C 384.59 25.44 390.80 25.25 396.67 23.34 C 404.51 21.11 411.56 16.40 419.84 15.70 C 432.46 14.02 445.07 18.87 457.65 15.30 C 458.82 15.12 461.15 14.76 462.32 14.58 C 469.97 13.18 477.81 11.76 485.61 12.75 C 486.79 12.68 489.17 12.53 490.36 12.46 Z" fill="#fefe00" onMouseEntered="#onMouseEntered" opacity="1" /> 
    <SVGPath id="path3623" content=" M 485.61 12.75 C 485.60 10.49 489.75 10.48 490.36 12.46 C 489.17 12.53 486.79 12.68 485.61 12.75 Z" fill="WHITE" opacity="1" /> 
    <SVGPath id="path3625" content=" M 457.65 15.30 C 457.43 12.99 461.58 12.55 462.32 14.58 C 461.15 14.76 458.82 15.12 457.65 15.30 Z" fill="WHITE" opacity="1" /> 
    <SVGPath id="path3627" content=" M 365.37 29.33 C 369.45 28.35 373.61 27.58 377.82 27.46 C 363.52 32.99 348.15 34.67 333.34 38.37 C 324.32 40.14 315.46 43.02 306.24 43.63 C 309.25 41.84 312.58 40.65 316.01 39.98 C 318.77 39.39 321.51 38.84 324.29 38.28 C 338.00 35.39 351.71 32.46 365.37 29.33 Z" opacity="1" /> 
    <SVGPath id="Siberia" content=" M 836.39 34.09 C 842.29 34.41 846.57 28.51 852.59 29.79 C 858.25 31.43 864.07 32.69 870.01 32.56 C 874.75 32.93 881.62 32.13 884.05 37.38 C 880.74 39.42 877.36 41.29 873.97 43.17 C 874.28 43.65 874.91 44.61 875.22 45.09 C 878.03 44.44 880.83 43.74 883.63 43.00 C 887.15 45.97 890.81 48.78 894.42 51.65 C 892.13 53.63 889.75 55.48 887.42 57.40 C 892.45 63.72 897.32 70.25 903.17 75.85 C 910.35 81.68 909.87 92.10 915.23 99.21 C 909.46 100.74 903.98 103.17 898.29 104.96 C 898.85 110.08 900.49 115.47 898.84 120.52 C 894.83 123.31 891.12 128.24 885.78 127.94 C 883.18 128.09 879.68 127.44 878.27 130.29 C 878.33 133.94 880.28 137.20 881.41 140.60 C 878.38 141.55 875.41 142.64 872.51 143.92 C 868.65 140.54 864.66 137.34 860.51 134.33 C 863.89 131.72 867.43 129.25 870.66 126.42 C 865.67 121.43 860.73 116.39 855.89 111.26 C 860.27 110.18 864.63 109.16 869.04 108.13 C 866.64 105.09 864.24 102.02 861.50 99.29 C 857.61 95.69 851.80 95.84 847.31 93.50 C 843.42 90.36 841.49 85.57 839.11 81.32 C 835.89 76.46 830.28 74.27 825.55 71.23 C 818.16 67.65 813.71 58.96 804.81 58.76 C 803.60 55.05 801.40 51.81 799.08 48.72 C 798.85 48.38 798.39 47.70 798.16 47.36 C 802.44 41.78 809.74 42.57 815.92 41.57 C 815.27 40.07 814.63 38.58 814.00 37.09 C 821.39 35.60 828.88 34.79 836.39 34.09 Z" opacity="1"> 
     <fill> 
     <Color blue="0.000" green="0.498" red="0.000" fx:id="x8" /> 
     </fill> 
    </SVGPath> 
     </children> 
</Group> 

그래서 내가 페인트 또는 지역 (그린란드 ID로)을 강조 할 것을 고려한다. 어쨌든 도와 주시면 감사하겠습니다.

Answer 1

글쎄, 좀 대답을 제안하겠습니다.

처럼 보이게하려면 장면에 CSS를 적용해야합니다. 그것이 어떻게 보일 것인가를 설명해 드리겠습니다.

""에 대한 CSS 참고 자료를보십시오. 이 유형은 노드에 적용 할 수있는 -fx 효과 속성 유형입니다. SVGPath는 모양이므로 노드입니다. 적용되는 방법을 내부 그림자에서 봐 : 당신이 그들이 공중 선회하는 때 SVGPaths에 (다른 효과는 지원되지 않음)이 적용해야

innershadow(<blur-type> , <color> , <number> , <number> , <number> , <number>) 

. "hover"는 그러한 의사 클래스의 이름입니다.

이제 SVGPath에 대한 선택기를 작성해야합니다. 불행히도 SVGPath에는 미리 정의 된 스타일 클래스가 없습니다. 따라서 fxml에 해당 스타일 클래스를 명시 적으로 설정해야합니다. 스타일 클래스 "svg-path"를 설정한다고 가정하십시오.

.svg-path:hover{-fx-effect:innershadow(...)}