java - Java GUIアプリ-地図上の画像のオーバーレイ（背景画像）

Question

都市の地図を表示する簡単なGUIアプリケーションを作成したいと思います。

次に、ホテルやレストランなどのアイテム（アセット）をこのマップに画像としてプログラムで追加します。

擬似コードは次のようになります

[set up background object with map image covering entire form]

[create hotel1 object (image, label with icon or whatever]
hotel1.image = "hotel.png";
hotel1.size-x = 30;
hotel1.size-y = 30;
hotel1.location-x = 450; (pixels)
hotel1.location-y = 300;
background-object.add(hotel1);

[create restaurant1 object (image, label with icon or whatever]
restaurant1 .image = "hotel.png";
restaurant1 .size-x = 30;
restaurant1 .size-y = 30;
restaurant1 .location-x = 600; (pixels)
restaurant1 .location-y = 400;
background-object.add(restaurant1);

[repeat for hotel2, hotel3, restaurant2 etc...]

このようにして、マップに任意の数のアセットを追加できます。私が必要とする他の機能は

• アセットの画像を変更します（たとえば、アセットに別の画像を表示するため）
  hotel1.image = "hotel_closed.png";

• オーバーラップするアセット（互いに接近している場合）

• アセットごとにクリックイベントハンドラーを登録する
• アセットの可視性を変更する
  hotel1.visible = false;

私は経験豊富な.Netプログラマーです。このタスクは.Netでは単純なタスクですが、Javaで上記を実行するための最良の方法がわかりません。誰かが上記を達成するための最良のアプローチを提案できますか？コンセプトが提案されたらGoogleに満足しています（完全にコード化されたソリューションは必要ありません!!）

どうもありがとう、イアン

Answer 1

要件全体を知らなくても（つまり、マップをダウンロードしたり、マップを並べて表示したりする必要がある場合）、開始できる場所はたくさんあります。概要については、いくつか提案するだけです。

私は（順不同で）読み飛ばすことから始めます

• JFC/Swingを使用したGUIの作成
• Swingでの並行性
• Swingのカスタムペインティング
• 2Dグラフィックス
• 基本的なI/O

また、 Javaチュートリアルに慣れることもできます。

上記のほとんどはGUI固有のものですが、私は次のようなことを読んでいます

• エッセンシャルクラス
• Java言語を学ぶ

Javaのどこでコーディングするかは問題ではないという理由だけで、これらは常に役立ちます。

幸せな読書:)

アップデート

ああ、そしてもちろん、すべての重要なAPIドキュメント（別名JavaDocs）

アップデート

これらすべてにある程度満足している場合は、 SwingX WSをチェックしてみてください。これには、GoogleとOpenStreetマップをプルする優れた例があります。

Answer 2

アプリケーションをWebベースではなくデスクトップにすることを想定しています。その場合、サードパーティのマッピングソリューションを使用する前に、同様のことを行いました（ただし、かなり複雑です）。残念ながら、そのソリューションにはライセンスが必要であり、とにかく利用できなくなりました。

デスクトップアプリケーションで単純なスクロール不可能なマップが必要な場合は、Swingソリューションから始めることをお勧めします。JComponentオブジェクトの拡張を見て、メソッドをオーバーライドします

public void paintComponent(Graphics g){
    // use g to draw things
}

グラフィックオブジェクトを使用して、マップイメージとアイコンをペイントします。このコンポーネントをSwingJFrameに追加し、正しいサイズとレイアウトを設定します。

あなたがこれをウェブページに入れたいのなら、他の誰かがあなたを助けるために配置されたほうがよいでしょう。

編集：

ここと他の投稿で与えられたフィードバックから、私はあなたがコードのスライスから利益を得るかもしれないと思うので、ここに行きます：

import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.Dimension;
import java.awt.Graphics;
import java.awt.image.BufferedImage;

import javax.swing.JFrame;
import javax.swing.JPanel;

public class SwingPaintDemo extends JPanel {

    private BufferedImage map = null;
    private BufferedImage pointer = null;

    public SwingPaintDemo() {
        this.setPreferredSize(new Dimension(200, 200));
        loadImagesFromFile(); 
    }

    private void loadImagesFromFile() {
        // load your images form file - these are fakes: 
        map = new BufferedImage(200, 200, BufferedImage.TYPE_3BYTE_BGR);
        pointer = new BufferedImage(10, 10, BufferedImage.TYPE_4BYTE_ABGR);

        Graphics g = map.getGraphics();
        g.setColor(Color.GREEN);
        g.fillRect(0, 0, 200, 200);

        g = pointer.getGraphics();
        g.setColor(Color.BLUE);
        g.fillOval(0, 0, 10, 10);
    }

    @Override
    protected void paintComponent(Graphics g) {
        super.paintComponent(g);
        // paint map
        g.drawImage(map, 0, 0, this);

        // paint pointers
        g.drawImage(pointer, 50, 75, this);
    }

    // this main is for testing the class but can be used as a reference
    public static void main(String... args) {
        JFrame jf = new JFrame();
        SwingPaintDemo mapper = new SwingPaintDemo();
        jf.getContentPane().setLayout(new BorderLayout());
        jf.getContentPane().add(mapper, BorderLayout.CENTER);
        jf.setVisible(true);
        jf.pack();
    }
}

これを編集して、ファイルから画像を読み込む必要があります。これを自己完結型で簡単に実行できるようにしたかったので、画像をインラインで作成しました。

Answer 3

まだ回答は受け付けていません。そこで、擬似コードを例として使用して、JavaFX 2を使用した簡単なオーバーレイの例をコーディングしました。WebViewは、前述のJPGファイルを使用してImageViewに簡単に置き換えることができます。

コードは次のとおりです。

package simple.map.overlay;

import java.io.InputStream;
import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.VBox;
import javafx.scene.web.WebEngine;
import javafx.scene.web.WebView;
import javafx.stage.Stage;

public class SimpleMapOverlay extends Application 
{

    @Override
    public void start(Stage primaryStage) 
    {               
        WebView mapView = new WebView();
        WebEngine webEngine = mapView.getEngine();
        String url = "http://maps.google.com/maps?q=Baramerica,+South+Alamo+Street,+San+Antonio,+TX&hl=en&ll=29.416647,-98.488655&spn=0.025196,0.035233&sll=29.416423,-98.489814&sspn=0.006299,0.008808&hq=Baramerica,&hnear=S+Alamo+St,+San+Antonio,+Texas&t=m&z=15";
        url += "&output=embed";
        webEngine.load(url);

        VBox vBox = new VBox(5);
        vBox.getChildren().add(mapView);

        InputStream instream = SimpleMapOverlay.class.getResourceAsStream("beer.png");
        Image beerImage = new Image(instream);        

        instream = SimpleMapOverlay.class.getResourceAsStream("food.jpg");
        Image foodImage = new Image(instream);

        Marker laTunaMarker = new Marker(beerImage, "La Tuna");
        laTunaMarker.setLayoutX(210);
        laTunaMarker.setLayoutY(480);

        Marker rosariosMarker = new Marker(foodImage, "Rosarios");
        rosariosMarker.setLayoutX(360);
        rosariosMarker.setLayoutY(300);

        Group root = new Group();
        root.getChildren().add(vBox);
        root.getChildren().add(laTunaMarker);
        root.getChildren().add(rosariosMarker);
        Scene scene = new Scene(root);        

        primaryStage.setTitle("Hello Map World with Markers!");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    public static void main(String[] args) 
    {
        launch(args);
    }

    class Marker extends Group
    {
        public Marker(Image image, String text)
        {
            ImageView imageView = new ImageView(image);            
            Label label = new Label(text);            
            VBox vbox = new VBox(5);
            vbox.getChildren().add(imageView);
            vbox.getChildren().add(label);
            getChildren().add(vbox);
        }
    }

}