0
すべてのマーカーをクリアしてから再び追加すると、アーティファクトで終わる。下の画像はアーティファクトを示しています。 5つのボタンは1つのマーカーを追加し、さらに最大5つのマーカーを追加します。新しいマーカーを追加する前にすべてのマーカーをクリアします。ボタン5,4,3,2,1をクリックすると、下の画像が表示されます。ズームアウトとバックjfxpanelを使用してマーカーを描画正しくマーカーを削除/追加するとアーティファクトが残る
スイングアプリで：
import java.awt.BorderLayout;
import java.awt.Dimension;
import java.net.MalformedURLException;
import java.net.URL;
import java.nio.file.Paths;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javafx.application.Platform;
import javafx.embed.swing.JFXPanel;
import javafx.scene.Scene;
import javafx.scene.web.WebEngine;
import javafx.scene.web.WebView;
import netscape.javascript.JSObject;
@SuppressWarnings("serial")
public class FrmMap2 extends JFrame {
private final JFXPanel jfxPanel = new JFXPanel();
private WebEngine engine;
private FrmMap2 me = null;
protected String sBounds;
public FrmMap2() {
me = this;
jbInit();
}
protected void jbInit() {
createScene();
JPanel pnl = new JPanel();
pnl.setLayout(new BorderLayout());
pnl.add(jfxPanel, BorderLayout.CENTER);
JButton btn = new JButton("Clear");
btn.addActionListener(evt -> onClear(0));
JPanel pnl2 = new JPanel();
pnl2.add(btn);
for (int x=1; x<6;x++) {
JButton btn1 = new JButton(""+x);
final int y = x;
btn1.addActionListener(evt -> onClear(y));
pnl2.add(btn1);
}
pnl.add(pnl2, BorderLayout.NORTH);
setDefaultCloseOperation(JFrame.DISPOSE_ON_CLOSE);
setPreferredSize(new Dimension(1400, 1000));
getContentPane().add(pnl);
pack();
setLocationRelativeTo(null);
}
protected void onClear(int level) {
Platform.runLater(() -> { engine.executeScript("clearMarkers()"); });
if (level > 0)
onAddMarkers(level);
}
protected void onAddMarkers(int level) {
Platform.runLater(() -> { engine.executeScript("addMarker(33.90748,-117.187289,'Test Location 1','white','Test Location 1',-1)"); });
if (level > 0)
Platform.runLater(() -> { engine.executeScript("addMarker(33.9134997,-117.1915758,'Test Location 2','green','Test Location 2',957)"); });
if (level > 1)
Platform.runLater(() -> { engine.executeScript("addMarker(33.9123479,-117.1915805,'Test Location 3','green','Test Location 3',958)"); });
if (level > 2)
Platform.runLater(() -> { engine.executeScript("addMarker(33.913082,-117.1915775,'Test Location 4','green','Test Location 4',959)"); });
if (level > 3)
Platform.runLater(() -> { engine.executeScript("addMarker(33.912805,-117.192108,'Test Location 5','green','Test Location 5',960)"); });
if (level > 4)
Platform.runLater(() -> { engine.executeScript("addMarker(33.9177624,-117.203623,'Test Location 6','green','Test Location 6',1335)"); });
}
protected void createScene() {
Platform.runLater(new Runnable() {
@Override
public void run() {
WebView view = new WebView();
engine = view.getEngine();
URL urlGoogleMaps = null;
try {
urlGoogleMaps = Paths.get("mapview3.html").toUri().toURL();
} catch (MalformedURLException e1) {
e1.printStackTrace();
return;
}
engine.load(urlGoogleMaps.toExternalForm());
JSObject window = (JSObject) engine.executeScript("window");
window.setMember("app", me);
jfxPanel.setScene(new Scene(view));
}
});
}
public void logit(String str) {
System.out.println(str);
}
public static void main(String[] args) {
FrmMap2 map = new FrmMap2();
map.setVisible(true);
}
}
HTML： 地図 HTML、本体{ 高さ：100％ ; マージン：0; パディング：0; }たぶん
#map {
height: 100%;
}
</style>
</head>
<body onLoad="initMap()">
<div id="map">
<script src="https://maps.googleapis.com/maps/api/js?v=3&key=AIzaSyCcdMK5ngbSNxXno9ZRlOivVHvLoX6XyH0&libraries=places"></script>
<script>
var map;
var markers = [];
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center : {
lat : 33.90748,
lng : -117.187289
},
zoom : 15
});
}
// Removes the markers from the map, but keeps them in the array.
function clearMarkers2() {
for (var i = 0; i < markers.length; i++) {
markers[i].setMap(null);
}
}
function clearMarkers1() {
markers.forEach(function(marker) {
marker.setMap(null);
});
}
function clearMarkers() {
clearMarkers1();
//clearMarkers2();
markers = [];
app.logit("MARKERS CLEARED");
}
function addMarker(lat, long, name, color, popover, id) {
app.logit("ADDING MARKER: " + lat + "," + long + "," + name + "," + color + "," + id);
var marker = createMarker("", name, new google.maps.LatLng(lat, long), popover, id);
markers.push(marker);
}
function createMarker(iconname, placename, location, popover, mid) {
// Create a marker for each place.
var marker = new google.maps.Marker({
map : map,
title : placename,
position : location
});
var infobulle = new google.maps.InfoWindow({
content : popover
});
google.maps.event.addListener(marker, 'mouseover', function() {
infobulle.open(map, marker);
});
google.maps.event.addListener(marker, 'mouseout', function() {
infobulle.close();
});
return marker;
}
</script>
</div>
</body>
</html>