diff --git a/src/App.tsx b/src/App.tsx
index da08752..bd6943a 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,42 +1,35 @@
import { Outlet } from "react-router";
-import MyComponent from "./components/errorComp";
-// import MapUtl from "./components/map/mapUtil";
+import MapUtl from "./components/map/mapUtil";
import { useEffect } from "react";
-// const SocketService = require("./util/socket");
import SocketService from "./util/socket";
const socketService = SocketService.getInstance();
-const onMessage = (data: any) => {
- // console.log("message", data);
+const onMessage = (e: any) => {
+ let data = JSON.parse(e);
+ if (data.type === "accpt") {
+ let body = JSON.parse(data.content.body);
+ console.log(body);
+ MapUtl.addMaker({
+ lng: 103.55,
+ lat: 30.342,
+ title: body?.user_name,
+ users: body,
+ });
+ }
};
-socketService.on("message", onMessage);
-const onConnected = () => {
- console.log("connected");
-};
-socketService.on("connected", onConnected);
+console.log("init");
-// socketService.
-// socket.onmessage((e) => {
-// const data = JSON.parse(e.data);
-// if (data.type === "heartbeat") {
-// MapUtl.makerList[0].setPosition([103.55, 30.342]);
-// var m = MapUtl.amap;
-// var newIcon = new m.Icon({
-// image: "//a.amap.com/jsapi_demos/static/demo-center/icons/dir-marker.png", //Icon 的图像
-// size: new m.Size(25, 34), // 图标大小
-// anchor: new m.Pixel(12, 32), // 图标锚点
-// });
-// MapUtl.makerList[0].setIcon(newIcon);
-// }
-// });
+socketService.on("message", onMessage);
const App = () => {
useEffect(() => {
- console.log("app mounted");
+ return () => {
+ console.log("uninstall");
+
+ socketService.off("message", onMessage);
+ };
}, []);
return (
<>
-
-
-
+
>
);
};
diff --git a/src/components/map/MapComponent.tsx b/src/components/map/MapComponent.tsx
index 1b767e6..48f2a64 100644
--- a/src/components/map/MapComponent.tsx
+++ b/src/components/map/MapComponent.tsx
@@ -18,7 +18,7 @@ export default function MapContainer() {
version: "2.0", // 指定要加载的 JSAPI 的版本,缺省时默认为 1.4.15
plugins: ["AMap.Scale"],
});
-
+
amap = new Amap.Map("container", {
viewMode: "2D", // 是否为3D地图模式
zoom: 11, // 初始化地图级别
@@ -27,7 +27,9 @@ export default function MapContainer() {
resizeEnable: true,
});
setmaps(amap);
- addMaket(Amap,amap);
+ // addMaket(Amap,amap);
+ MapUtl.loadMap = Amap;
+ MapUtl.amap = amap;
amap.setFitView();
};
const addMaket = (m,mp) => {
diff --git a/src/components/map/mapUtil.ts b/src/components/map/mapUtil.ts
index 1c50df9..d936deb 100644
--- a/src/components/map/mapUtil.ts
+++ b/src/components/map/mapUtil.ts
@@ -1,6 +1,41 @@
class MapUtl {
static makerList: any[] = [];
- static amap:any = null;
+ static amap: any = null;
+ static loadMap: any = null;
+
+ static addMaker(data: any) {
+ const { lng, lat, title, users } = data;
+ const marker = new MapUtl.loadMap.Marker({
+ position: new MapUtl.loadMap.LngLat(lng, lat),
+ title: title,
+ });
+ var content = [
+ "
姓名 :" + users?.user_name + "",
+ "职位 : " + users.pos_held,
+ "电话 : " + users.tel,
+ "
",
+ ];
+ var infoWindow = new MapUtl.loadMap.InfoWindow({
+ offset: new MapUtl.loadMap.Pixel(0, -30),
+ autoMove: true,
+ content: content.join("
"),
+ });
+ marker.on("click", (e) => {
+ infoWindow.open(MapUtl.amap, e.target.getPosition());
+ });
+ MapUtl.amap?.add(marker);
+ }
+ static setMakericon = (maker) => {
+ maker.setPosition([103.55, 30.342]);
+ var m = MapUtl.amap;
+ var newIcon = new m.Icon({
+ image: "//a.amap.com/jsapi_demos/static/demo-center/icons/dir-marker.png", //Icon 的图像
+ size: new m.Size(25, 34), // 图标大小
+ anchor: new m.Pixel(12, 32), // 图标锚点
+ });
+ maker.setIcon(newIcon);
+ }
+
}
export default MapUtl;
\ No newline at end of file
diff --git a/src/util/config.ts b/src/util/config.ts
index cb7ee90..064af0c 100644
--- a/src/util/config.ts
+++ b/src/util/config.ts
@@ -3,10 +3,10 @@ class Config {
// static uploadUrl = "https://rw.quwanya.cn/";
// static ws = "wss://rw.quwanya.cn/ws";
- // static ws = "wss://rw.quwanya.cn/ws?id=admin";
+ static ws = "ws://127.0.0.1:12214/ws?id=admin";
static baseUrl = "http://127.0.0.1:12214/";
static uploadUrl = "http://127.0.0.1:12214/";
- static ws = "wss://rw.quwanya.cn/ws";
+ // static ws = "wss://rw.quwanya.cn/ws";
}
export default Config;
diff --git a/src/util/webRtc.ts b/src/util/webRtc.ts
index 66d4c9b..9786b68 100644
--- a/src/util/webRtc.ts
+++ b/src/util/webRtc.ts
@@ -1,8 +1,6 @@
-// import SocketService from "./socket";
import Config from "./config";
-// const socketService = SocketService.getInstance();
class WebRtc {
private mediaStream: MediaStream | Blob | null = null;
private pee: RTCPeerConnection | null = null;