augustine-jkmap 1.0.5 → 1.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/augustine-jkmap.common.js +1411 -1245
- package/dist/augustine-jkmap.common.js.map +1 -1
- package/dist/augustine-jkmap.umd.js +1411 -1245
- package/dist/augustine-jkmap.umd.js.map +1 -1
- package/dist/augustine-jkmap.umd.min.js +1 -1
- package/dist/augustine-jkmap.umd.min.js.map +1 -1
- package/package.json +1 -1
|
@@ -3507,62 +3507,62 @@ function judgmentMapDataType(type = '') {
|
|
|
3507
3507
|
* @returns {{x: number, y: number, spatialReference?: any} | null}
|
|
3508
3508
|
*/
|
|
3509
3509
|
function parseToPoint(input) {
|
|
3510
|
-
if (!input) return null
|
|
3510
|
+
if (!input) return null;
|
|
3511
3511
|
|
|
3512
3512
|
// 字符串 "lng,lat"
|
|
3513
|
-
if (typeof input ===
|
|
3514
|
-
const parts = input.split(
|
|
3513
|
+
if (typeof input === "string") {
|
|
3514
|
+
const parts = input.split(",").map((s) => parseFloat(s.trim()));
|
|
3515
3515
|
if (parts.length === 2 && !isNaN(parts[0]) && !isNaN(parts[1])) {
|
|
3516
|
-
return { x: parts[0], y: parts[1] }
|
|
3516
|
+
return { x: parts[0], y: parts[1] };
|
|
3517
3517
|
}
|
|
3518
3518
|
}
|
|
3519
3519
|
|
|
3520
3520
|
// 数组 [x, y]
|
|
3521
3521
|
if (Array.isArray(input) && input.length >= 2) {
|
|
3522
|
-
const x = parseFloat(input[0])
|
|
3523
|
-
const y = parseFloat(input[1])
|
|
3522
|
+
const x = parseFloat(input[0]);
|
|
3523
|
+
const y = parseFloat(input[1]);
|
|
3524
3524
|
if (!isNaN(x) && !isNaN(y)) {
|
|
3525
|
-
return { x, y }
|
|
3525
|
+
return { x, y };
|
|
3526
3526
|
}
|
|
3527
3527
|
}
|
|
3528
3528
|
|
|
3529
3529
|
// 对象 {x, y} 或 {longitude, latitude}
|
|
3530
|
-
if (typeof input ===
|
|
3531
|
-
let x, y
|
|
3532
|
-
if (
|
|
3533
|
-
x = parseFloat(input.x)
|
|
3534
|
-
y = parseFloat(input.y)
|
|
3535
|
-
} else if (
|
|
3536
|
-
x = parseFloat(input.longitude)
|
|
3537
|
-
y = parseFloat(input.latitude)
|
|
3538
|
-
} else if (
|
|
3539
|
-
x = parseFloat(input.lng)
|
|
3540
|
-
y = parseFloat(input.lat)
|
|
3530
|
+
if (typeof input === "object") {
|
|
3531
|
+
let x, y;
|
|
3532
|
+
if ("x" in input && "y" in input) {
|
|
3533
|
+
x = parseFloat(input.x);
|
|
3534
|
+
y = parseFloat(input.y);
|
|
3535
|
+
} else if ("longitude" in input && "latitude" in input) {
|
|
3536
|
+
x = parseFloat(input.longitude);
|
|
3537
|
+
y = parseFloat(input.latitude);
|
|
3538
|
+
} else if ("lng" in input && "lat" in input) {
|
|
3539
|
+
x = parseFloat(input.lng);
|
|
3540
|
+
y = parseFloat(input.lat);
|
|
3541
3541
|
}
|
|
3542
3542
|
if (!isNaN(x) && !isNaN(y)) {
|
|
3543
|
-
return { x, y, spatialReference: input.spatialReference }
|
|
3543
|
+
return { x, y, spatialReference: input.spatialReference };
|
|
3544
3544
|
}
|
|
3545
3545
|
}
|
|
3546
3546
|
|
|
3547
|
-
return null
|
|
3547
|
+
return null;
|
|
3548
3548
|
}
|
|
3549
3549
|
/**
|
|
3550
3550
|
* 尝试将 esri/geometry/Point 转为普通对象
|
|
3551
3551
|
*/
|
|
3552
3552
|
function tryConvertEsriPoint(obj) {
|
|
3553
3553
|
// 检查是否有 toJSON 方法(esri geometry 标准)
|
|
3554
|
-
if (obj && typeof obj.toJSON ===
|
|
3554
|
+
if (obj && typeof obj.toJSON === "function") {
|
|
3555
3555
|
try {
|
|
3556
|
-
const json = obj.toJSON()
|
|
3556
|
+
const json = obj.toJSON();
|
|
3557
3557
|
// 验证是否为点(有 x 和 y)
|
|
3558
|
-
if (typeof json.x ===
|
|
3559
|
-
return obj // 已是标准 ArcGIS JSON
|
|
3558
|
+
if (typeof json.x === "number" && typeof json.y === "number") {
|
|
3559
|
+
return obj; // 已是标准 ArcGIS JSON
|
|
3560
3560
|
}
|
|
3561
3561
|
} catch (error) {
|
|
3562
|
-
throw new Error(`esri.Point toJSON 失败: ${error}`)
|
|
3562
|
+
throw new Error(`esri.Point toJSON 失败: ${error}`);
|
|
3563
3563
|
}
|
|
3564
3564
|
}
|
|
3565
|
-
return null
|
|
3565
|
+
return null;
|
|
3566
3566
|
}
|
|
3567
3567
|
/**
|
|
3568
3568
|
* 将任意变量尝试转换为 ArcGIS 点格式 { x, y }
|
|
@@ -3574,56 +3574,60 @@ function tryConvertEsriPoint(obj) {
|
|
|
3574
3574
|
function toArcGISPoint(crPoint, strict = true) {
|
|
3575
3575
|
let x,
|
|
3576
3576
|
y,
|
|
3577
|
-
result = null
|
|
3577
|
+
result = null;
|
|
3578
3578
|
try {
|
|
3579
3579
|
// 1. 检查 ArcGIS API 是否加载
|
|
3580
3580
|
if (!window || !window.jkEsri || !window.jkEsri.Point) {
|
|
3581
|
-
console.warn(
|
|
3582
|
-
throw new Error(
|
|
3581
|
+
console.warn("[createText] ArcGIS API 未加载,跳过创建");
|
|
3582
|
+
throw new Error("[createText] ArcGIS API 未加载,跳过创建");
|
|
3583
3583
|
}
|
|
3584
3584
|
// 1. null / undefined
|
|
3585
3585
|
if (isEmpty(crPoint)) {
|
|
3586
|
-
throw new Error(
|
|
3586
|
+
throw new Error("转换异常,无经纬度点位数据");
|
|
3587
3587
|
}
|
|
3588
3588
|
// 2. 尝试作为 esri.Point 处理(优先级高)
|
|
3589
|
-
result = tryConvertEsriPoint(crPoint)
|
|
3589
|
+
result = tryConvertEsriPoint(crPoint);
|
|
3590
3590
|
if (result) {
|
|
3591
3591
|
// 成功解析为 {x, y, ...}
|
|
3592
|
-
return result
|
|
3592
|
+
return result;
|
|
3593
3593
|
} else {
|
|
3594
|
-
const transform_point = parseToPoint(crPoint)
|
|
3594
|
+
const transform_point = parseToPoint(crPoint);
|
|
3595
3595
|
|
|
3596
|
-
if (
|
|
3597
|
-
|
|
3596
|
+
if (
|
|
3597
|
+
isEmpty(transform_point) ||
|
|
3598
|
+
isEmpty(transform_point.x) ||
|
|
3599
|
+
isEmpty(transform_point.y)
|
|
3600
|
+
) {
|
|
3601
|
+
throw new Error("转换异常,无经纬度点位数据");
|
|
3598
3602
|
}
|
|
3599
|
-
x = transform_point.x
|
|
3600
|
-
y = transform_point.y
|
|
3603
|
+
x = transform_point.x;
|
|
3604
|
+
y = transform_point.y;
|
|
3601
3605
|
}
|
|
3602
3606
|
// 5. 仍未成功解析
|
|
3603
3607
|
if (isNaN(x) || isNaN(y)) {
|
|
3604
|
-
throw new Error(
|
|
3608
|
+
throw new Error("转换异常,无经纬度点位数据");
|
|
3605
3609
|
}
|
|
3606
3610
|
// 6. 【可选】经纬度范围校验
|
|
3607
3611
|
if (strict) {
|
|
3608
3612
|
if (x < -180 || x > 180) {
|
|
3609
|
-
throw new Error(
|
|
3613
|
+
throw new Error("转换异常,x < -180 || x > 180");
|
|
3610
3614
|
}
|
|
3611
3615
|
if (y < -90 || y > 90) {
|
|
3612
|
-
throw new Error(
|
|
3616
|
+
throw new Error("转换异常,y < -90 || y > 90");
|
|
3613
3617
|
}
|
|
3614
3618
|
}
|
|
3615
|
-
let wkid = crPoint.wkid ? crPoint.wkid : Number(x) > 1000 ? 102100 : 4326
|
|
3619
|
+
let wkid = crPoint.wkid ? crPoint.wkid : Number(x) > 1000 ? 102100 : 4326;
|
|
3616
3620
|
// 7. 返回标准 ArcGIS 点
|
|
3617
3621
|
return new window.jkEsri.Point(
|
|
3618
3622
|
Number(x),
|
|
3619
3623
|
Number(y),
|
|
3620
3624
|
new window.jkEsri.SpatialReference({
|
|
3621
|
-
wkid
|
|
3625
|
+
wkid,
|
|
3622
3626
|
})
|
|
3623
|
-
)
|
|
3627
|
+
);
|
|
3624
3628
|
} catch (error) {
|
|
3625
|
-
console.warn(
|
|
3626
|
-
throw new Error(`转换异常:${error}`)
|
|
3629
|
+
console.warn("error", error);
|
|
3630
|
+
throw new Error(`转换异常:${error}`);
|
|
3627
3631
|
}
|
|
3628
3632
|
}
|
|
3629
3633
|
/**
|
|
@@ -3645,18 +3649,24 @@ function toArcGISPoint(crPoint, strict = true) {
|
|
|
3645
3649
|
function mapJump(view, target, options = { zoom: 16 }) {
|
|
3646
3650
|
// 前置校验:ArcGIS API是否加载
|
|
3647
3651
|
if (!window.jkEsri) {
|
|
3648
|
-
return Promise.reject(
|
|
3652
|
+
return Promise.reject(
|
|
3653
|
+
new Error("[mapJump] ArcGIS API 未加载 (window.jkEsri missing)")
|
|
3654
|
+
);
|
|
3649
3655
|
}
|
|
3650
3656
|
// 前置校验:view有效性
|
|
3651
|
-
if (!view || typeof view.goTo !==
|
|
3652
|
-
return Promise.reject(
|
|
3657
|
+
if (!view || typeof view.goTo !== "function") {
|
|
3658
|
+
return Promise.reject(
|
|
3659
|
+
new Error("[mapJump] 无效的 view 对象(缺少 goTo 方法)")
|
|
3660
|
+
);
|
|
3653
3661
|
}
|
|
3654
3662
|
|
|
3655
3663
|
// 视图类型判断
|
|
3656
|
-
const isScene = view.declaredClass ===
|
|
3657
|
-
const isMap = view.declaredClass ===
|
|
3664
|
+
const isScene = view.declaredClass === "esri.views.SceneView";
|
|
3665
|
+
const isMap = view.declaredClass === "esri.views.MapView";
|
|
3658
3666
|
if (!isScene && !isMap) {
|
|
3659
|
-
return Promise.reject(
|
|
3667
|
+
return Promise.reject(
|
|
3668
|
+
new Error(`[mapJump] 不支持的 view 类型: ${view.declaredClass}`)
|
|
3669
|
+
);
|
|
3660
3670
|
}
|
|
3661
3671
|
|
|
3662
3672
|
// 合并配置项(新增重试、动画默认优化)
|
|
@@ -3664,16 +3674,22 @@ function mapJump(view, target, options = { zoom: 16 }) {
|
|
|
3664
3674
|
{
|
|
3665
3675
|
padding: 20,
|
|
3666
3676
|
animate: false, // 单点跳转默认关闭动画,减少中断(核心优化)
|
|
3667
|
-
pointZoom: Math.max(
|
|
3668
|
-
|
|
3677
|
+
pointZoom: Math.max(
|
|
3678
|
+
1,
|
|
3679
|
+
Math.min(20, options.pointZoom ? options.pointZoom : 15)
|
|
3680
|
+
), // 限制缩放级别范围
|
|
3681
|
+
pointScale: Math.max(
|
|
3682
|
+
100,
|
|
3683
|
+
Math.min(100000, options.pointScale ? options.pointScale : 5000)
|
|
3684
|
+
), // 限制相机高度
|
|
3669
3685
|
fallbackExtent: null,
|
|
3670
|
-
retryTimes: 1 // 中断时重试1次
|
|
3686
|
+
retryTimes: 1, // 中断时重试1次
|
|
3671
3687
|
},
|
|
3672
3688
|
options
|
|
3673
|
-
)
|
|
3689
|
+
);
|
|
3674
3690
|
|
|
3675
3691
|
// 防抖标记:避免短时间多次调用
|
|
3676
|
-
let isJumping = false
|
|
3692
|
+
let isJumping = false;
|
|
3677
3693
|
/**
|
|
3678
3694
|
* 工具函数:等待视图就绪(核心!解决视图未加载完成导致的中断)
|
|
3679
3695
|
* @returns {Promise<void>}
|
|
@@ -3681,11 +3697,11 @@ function mapJump(view, target, options = { zoom: 16 }) {
|
|
|
3681
3697
|
function waitViewReady() {
|
|
3682
3698
|
return new Promise((resolve) => {
|
|
3683
3699
|
if (view.ready) {
|
|
3684
|
-
resolve()
|
|
3700
|
+
resolve();
|
|
3685
3701
|
} else {
|
|
3686
|
-
view.when(() => resolve())
|
|
3702
|
+
view.when(() => resolve());
|
|
3687
3703
|
}
|
|
3688
|
-
})
|
|
3704
|
+
});
|
|
3689
3705
|
}
|
|
3690
3706
|
|
|
3691
3707
|
/**
|
|
@@ -3694,19 +3710,19 @@ function mapJump(view, target, options = { zoom: 16 }) {
|
|
|
3694
3710
|
* @returns {__esri.Geometry} 转换后的几何
|
|
3695
3711
|
*/
|
|
3696
3712
|
function projectGeometry(geom) {
|
|
3697
|
-
if (!geom || !geom.spatialReference) return geom
|
|
3713
|
+
if (!geom || !geom.spatialReference) return geom;
|
|
3698
3714
|
|
|
3699
3715
|
// 空间参考一致,无需转换
|
|
3700
3716
|
if (geom.spatialReference.wkid === view.spatialReference.wkid) {
|
|
3701
|
-
return geom
|
|
3717
|
+
return geom;
|
|
3702
3718
|
}
|
|
3703
3719
|
|
|
3704
3720
|
try {
|
|
3705
3721
|
// 使用ArcGIS投影工具转换空间参考
|
|
3706
|
-
return window.jkEsri.geometry.project(geom, view.spatialReference)
|
|
3722
|
+
return window.jkEsri.geometry.project(geom, view.spatialReference);
|
|
3707
3723
|
} catch (e) {
|
|
3708
|
-
console.warn(
|
|
3709
|
-
return geom
|
|
3724
|
+
console.warn("[projectGeometry] 空间参考转换失败,使用原几何:", e);
|
|
3725
|
+
return geom;
|
|
3710
3726
|
}
|
|
3711
3727
|
}
|
|
3712
3728
|
|
|
@@ -3716,9 +3732,9 @@ function mapJump(view, target, options = { zoom: 16 }) {
|
|
|
3716
3732
|
* @returns {boolean}
|
|
3717
3733
|
*/
|
|
3718
3734
|
function isPointGeometry(geometry) {
|
|
3719
|
-
if (!geometry) return false
|
|
3720
|
-
const type = geometry.type || (geometry.x && geometry.y ?
|
|
3721
|
-
return type ===
|
|
3735
|
+
if (!geometry) return false;
|
|
3736
|
+
const type = geometry.type || (geometry.x && geometry.y ? "point" : "");
|
|
3737
|
+
return type === "point" || type === "multipoint";
|
|
3722
3738
|
}
|
|
3723
3739
|
|
|
3724
3740
|
/**
|
|
@@ -3727,77 +3743,81 @@ function mapJump(view, target, options = { zoom: 16 }) {
|
|
|
3727
3743
|
* @returns {__esri.Geometry | null}
|
|
3728
3744
|
*/
|
|
3729
3745
|
function toEsriGeometry(geomJson) {
|
|
3730
|
-
if (!geomJson) return null
|
|
3746
|
+
if (!geomJson) return null;
|
|
3731
3747
|
|
|
3732
3748
|
// 已是API实例,直接返回
|
|
3733
|
-
if (geomJson.toJSON && typeof geomJson.toJSON ===
|
|
3734
|
-
return geomJson
|
|
3749
|
+
if (geomJson.toJSON && typeof geomJson.toJSON === "function") {
|
|
3750
|
+
return geomJson;
|
|
3735
3751
|
}
|
|
3736
3752
|
|
|
3737
3753
|
// 提取几何类型(兼容纯JSON无type字段的Point)
|
|
3738
|
-
let geomType = geomJson.type
|
|
3754
|
+
let geomType = geomJson.type;
|
|
3739
3755
|
if (!geomType && geomJson.x !== undefined && geomJson.y !== undefined) {
|
|
3740
|
-
geomType =
|
|
3756
|
+
geomType = "point";
|
|
3741
3757
|
}
|
|
3742
|
-
if (!geomType) return null
|
|
3758
|
+
if (!geomType) return null;
|
|
3743
3759
|
|
|
3744
3760
|
// 统一空间参考(优先用几何自身的,无则用视图的)
|
|
3745
|
-
const sr = geomJson.spatialReference || view.spatialReference
|
|
3761
|
+
const sr = geomJson.spatialReference || view.spatialReference;
|
|
3746
3762
|
|
|
3747
3763
|
try {
|
|
3748
3764
|
// 1. 点(核心:校验坐标合法性,避免NaN导致中断)
|
|
3749
|
-
if (geomType ===
|
|
3750
|
-
const x = Number(geomJson.x)
|
|
3751
|
-
const y = Number(geomJson.y)
|
|
3765
|
+
if (geomType === "point") {
|
|
3766
|
+
const x = Number(geomJson.x);
|
|
3767
|
+
const y = Number(geomJson.y);
|
|
3752
3768
|
// 坐标合法性校验(关键!NaN会导致goTo中断)
|
|
3753
3769
|
if (isNaN(x) || isNaN(y)) {
|
|
3754
|
-
console.error(
|
|
3755
|
-
return null
|
|
3770
|
+
console.error("[toEsriGeometry] 点坐标非法:", geomJson);
|
|
3771
|
+
return null;
|
|
3756
3772
|
}
|
|
3757
3773
|
return new window.jkEsri.Point({
|
|
3758
3774
|
x,
|
|
3759
3775
|
y,
|
|
3760
3776
|
z: geomJson.z ? Number(geomJson.z) : undefined,
|
|
3761
|
-
spatialReference: sr
|
|
3762
|
-
})
|
|
3763
|
-
} else if (geomType ===
|
|
3777
|
+
spatialReference: sr,
|
|
3778
|
+
});
|
|
3779
|
+
} else if (geomType === "multipoint") {
|
|
3764
3780
|
return new window.jkEsri.MultiPoint({
|
|
3765
|
-
points: geomJson.points
|
|
3766
|
-
spatialReference: sr
|
|
3767
|
-
})
|
|
3781
|
+
points: geomJson.points.map((pt) => pt.map(Number)) || [],
|
|
3782
|
+
spatialReference: sr,
|
|
3783
|
+
});
|
|
3768
3784
|
}
|
|
3769
3785
|
|
|
3770
3786
|
// 2. 线/多线
|
|
3771
|
-
else if (geomType ===
|
|
3787
|
+
else if (geomType === "polyline" || geomType === "multipolyline") {
|
|
3772
3788
|
return new window.jkEsri.Polyline({
|
|
3773
|
-
paths:
|
|
3774
|
-
|
|
3775
|
-
|
|
3789
|
+
paths:
|
|
3790
|
+
geomJson.paths.map((path) => path.map((pt) => pt.map(Number))) ||
|
|
3791
|
+
[],
|
|
3792
|
+
spatialReference: sr,
|
|
3793
|
+
});
|
|
3776
3794
|
}
|
|
3777
3795
|
|
|
3778
3796
|
// 3. 面/多面
|
|
3779
|
-
else if (geomType ===
|
|
3797
|
+
else if (geomType === "polygon" || geomType === "multipolygon") {
|
|
3780
3798
|
return new window.jkEsri.Polygon({
|
|
3781
|
-
rings:
|
|
3782
|
-
|
|
3783
|
-
|
|
3799
|
+
rings:
|
|
3800
|
+
geomJson.rings.map((ring) => ring.map((pt) => pt.map(Number))) ||
|
|
3801
|
+
[],
|
|
3802
|
+
spatialReference: sr,
|
|
3803
|
+
});
|
|
3784
3804
|
}
|
|
3785
3805
|
|
|
3786
3806
|
// 4. 范围
|
|
3787
|
-
else if (geomType ===
|
|
3807
|
+
else if (geomType === "extent") {
|
|
3788
3808
|
return new window.jkEsri.Extent({
|
|
3789
3809
|
xmin: Number(geomJson.xmin),
|
|
3790
3810
|
ymin: Number(geomJson.ymin),
|
|
3791
3811
|
xmax: Number(geomJson.xmax),
|
|
3792
3812
|
ymax: Number(geomJson.ymax),
|
|
3793
|
-
spatialReference: sr
|
|
3794
|
-
})
|
|
3813
|
+
spatialReference: sr,
|
|
3814
|
+
});
|
|
3795
3815
|
}
|
|
3796
3816
|
|
|
3797
|
-
return null
|
|
3817
|
+
return null;
|
|
3798
3818
|
} catch (e) {
|
|
3799
|
-
console.warn(`[toEsriGeometry] 转换${geomType}失败:`, e)
|
|
3800
|
-
return null
|
|
3819
|
+
console.warn(`[toEsriGeometry] 转换${geomType}失败:`, e);
|
|
3820
|
+
return null;
|
|
3801
3821
|
}
|
|
3802
3822
|
}
|
|
3803
3823
|
|
|
@@ -3807,30 +3827,30 @@ function mapJump(view, target, options = { zoom: 16 }) {
|
|
|
3807
3827
|
* @returns {__esri.Extent | null}
|
|
3808
3828
|
*/
|
|
3809
3829
|
function getGeometryExtent(geom) {
|
|
3810
|
-
if (!geom) return null
|
|
3830
|
+
if (!geom) return null;
|
|
3811
3831
|
|
|
3812
3832
|
// 步骤1:转换为API实例(解决纯JSON无extent问题)
|
|
3813
|
-
const esriGeom = toEsriGeometry(geom)
|
|
3814
|
-
if (!esriGeom) return null
|
|
3833
|
+
const esriGeom = toEsriGeometry(geom);
|
|
3834
|
+
if (!esriGeom) return null;
|
|
3815
3835
|
|
|
3816
3836
|
// 步骤2:API实例自带extent,直接返回
|
|
3817
3837
|
if (esriGeom.extent) {
|
|
3818
|
-
return esriGeom.extent
|
|
3838
|
+
return esriGeom.extent;
|
|
3819
3839
|
}
|
|
3820
3840
|
|
|
3821
3841
|
// 步骤3:极端降级 - 手动构建Point的范围(x/y相同)
|
|
3822
|
-
if (esriGeom.type ===
|
|
3842
|
+
if (esriGeom.type === "point") {
|
|
3823
3843
|
return new window.jkEsri.Extent({
|
|
3824
3844
|
xmin: esriGeom.x,
|
|
3825
3845
|
ymin: esriGeom.y,
|
|
3826
3846
|
xmax: esriGeom.x,
|
|
3827
3847
|
ymax: esriGeom.y,
|
|
3828
|
-
spatialReference: esriGeom.spatialReference
|
|
3829
|
-
})
|
|
3848
|
+
spatialReference: esriGeom.spatialReference,
|
|
3849
|
+
});
|
|
3830
3850
|
}
|
|
3831
3851
|
|
|
3832
|
-
console.warn(
|
|
3833
|
-
return null
|
|
3852
|
+
console.warn("[getGeometryExtent] 无法获取几何范围:", geom);
|
|
3853
|
+
return null;
|
|
3834
3854
|
}
|
|
3835
3855
|
|
|
3836
3856
|
/**
|
|
@@ -3839,42 +3859,45 @@ function mapJump(view, target, options = { zoom: 16 }) {
|
|
|
3839
3859
|
* @returns {__esri.Extent | null}
|
|
3840
3860
|
*/
|
|
3841
3861
|
function computeExtentFromGraphics(graphics) {
|
|
3842
|
-
if (!graphics || graphics.length === 0) return null
|
|
3862
|
+
if (!graphics || graphics.length === 0) return null;
|
|
3843
3863
|
|
|
3844
|
-
const validExtents = []
|
|
3864
|
+
const validExtents = [];
|
|
3845
3865
|
for (const graphic of graphics) {
|
|
3846
3866
|
// 跳过无几何的无效图形
|
|
3847
3867
|
if (!graphic || !graphic.geometry) {
|
|
3848
|
-
console.warn(
|
|
3849
|
-
continue
|
|
3868
|
+
console.warn("[computeExtentFromGraphics] 跳过无几何的图形:", graphic);
|
|
3869
|
+
continue;
|
|
3850
3870
|
}
|
|
3851
3871
|
|
|
3852
3872
|
// 获取单个图形的有效范围(自动转换纯JSON几何)
|
|
3853
|
-
const extent = getGeometryExtent(graphic.geometry)
|
|
3873
|
+
const extent = getGeometryExtent(graphic.geometry);
|
|
3854
3874
|
if (extent) {
|
|
3855
|
-
validExtents.push(extent)
|
|
3875
|
+
validExtents.push(extent);
|
|
3856
3876
|
} else {
|
|
3857
|
-
console.warn(
|
|
3877
|
+
console.warn(
|
|
3878
|
+
"[computeExtentFromGraphics] 图形几何无有效范围:",
|
|
3879
|
+
graphic.geometry
|
|
3880
|
+
);
|
|
3858
3881
|
}
|
|
3859
3882
|
}
|
|
3860
3883
|
|
|
3861
3884
|
// 无有效范围
|
|
3862
3885
|
if (validExtents.length === 0) {
|
|
3863
|
-
console.error(
|
|
3864
|
-
return null
|
|
3886
|
+
console.error("[computeExtentFromGraphics] 所有图形均无有效范围!");
|
|
3887
|
+
return null;
|
|
3865
3888
|
}
|
|
3866
3889
|
|
|
3867
3890
|
// 单个范围直接返回
|
|
3868
3891
|
if (validExtents.length === 1) {
|
|
3869
|
-
return validExtents[0]
|
|
3892
|
+
return validExtents[0];
|
|
3870
3893
|
}
|
|
3871
3894
|
|
|
3872
3895
|
// 合并多个范围(点/线/面混合也能正确union)
|
|
3873
|
-
let combinedExtent = validExtents[0]
|
|
3896
|
+
let combinedExtent = validExtents[0];
|
|
3874
3897
|
for (let i = 1; i < validExtents.length; i++) {
|
|
3875
|
-
combinedExtent = combinedExtent.union(validExtents[i])
|
|
3898
|
+
combinedExtent = combinedExtent.union(validExtents[i]);
|
|
3876
3899
|
}
|
|
3877
|
-
return combinedExtent
|
|
3900
|
+
return combinedExtent;
|
|
3878
3901
|
}
|
|
3879
3902
|
|
|
3880
3903
|
/**
|
|
@@ -3883,29 +3906,29 @@ function mapJump(view, target, options = { zoom: 16 }) {
|
|
|
3883
3906
|
* @returns {Object|null}
|
|
3884
3907
|
*/
|
|
3885
3908
|
function parseToPoint(target) {
|
|
3886
|
-
if (!target) return null
|
|
3909
|
+
if (!target) return null;
|
|
3887
3910
|
|
|
3888
3911
|
// {x,y}格式
|
|
3889
3912
|
if (target.x !== undefined && target.y !== undefined) {
|
|
3890
|
-
const x = Number(target.x)
|
|
3891
|
-
const y = Number(target.y)
|
|
3892
|
-
return !isNaN(x) && !isNaN(y) ? { x, y } : null
|
|
3913
|
+
const x = Number(target.x);
|
|
3914
|
+
const y = Number(target.y);
|
|
3915
|
+
return !isNaN(x) && !isNaN(y) ? { x, y } : null;
|
|
3893
3916
|
}
|
|
3894
3917
|
|
|
3895
3918
|
// [x,y]数组格式
|
|
3896
3919
|
if (Array.isArray(target) && target.length >= 2) {
|
|
3897
|
-
const x = Number(target[0])
|
|
3898
|
-
const y = Number(target[1])
|
|
3899
|
-
return !isNaN(x) && !isNaN(y) ? { x, y } : null
|
|
3920
|
+
const x = Number(target[0]);
|
|
3921
|
+
const y = Number(target[1]);
|
|
3922
|
+
return !isNaN(x) && !isNaN(y) ? { x, y } : null;
|
|
3900
3923
|
}
|
|
3901
3924
|
|
|
3902
3925
|
// "lng,lat"字符串格式
|
|
3903
|
-
if (typeof target ===
|
|
3904
|
-
const [x, y] = target.split(
|
|
3905
|
-
return !isNaN(x) && !isNaN(y) ? { x, y } : null
|
|
3926
|
+
if (typeof target === "string" && target.includes(",")) {
|
|
3927
|
+
const [x, y] = target.split(",").map(Number);
|
|
3928
|
+
return !isNaN(x) && !isNaN(y) ? { x, y } : null;
|
|
3906
3929
|
}
|
|
3907
3930
|
|
|
3908
|
-
return null
|
|
3931
|
+
return null;
|
|
3909
3932
|
}
|
|
3910
3933
|
|
|
3911
3934
|
/**
|
|
@@ -3918,62 +3941,65 @@ function mapJump(view, target, options = { zoom: 16 }) {
|
|
|
3918
3941
|
async function doGoToWithRetry(targetGeom, isPointType, retryLeft) {
|
|
3919
3942
|
// 防抖:已有跳转中,直接中断
|
|
3920
3943
|
if (isJumping) {
|
|
3921
|
-
throw new Error(
|
|
3944
|
+
throw new Error("[mapJump] 前一次跳转未完成,中断本次操作");
|
|
3922
3945
|
}
|
|
3923
3946
|
|
|
3924
3947
|
try {
|
|
3925
|
-
isJumping = true
|
|
3948
|
+
isJumping = true;
|
|
3926
3949
|
// 步骤1:等待视图就绪
|
|
3927
|
-
await waitViewReady()
|
|
3950
|
+
await waitViewReady();
|
|
3928
3951
|
|
|
3929
3952
|
// 步骤2:强制转换空间参考(解决4326/3857不匹配)
|
|
3930
|
-
const projectedGeom = projectGeometry(targetGeom)
|
|
3953
|
+
const projectedGeom = projectGeometry(targetGeom);
|
|
3931
3954
|
if (!projectedGeom) {
|
|
3932
|
-
throw new Error(
|
|
3955
|
+
throw new Error("[mapJump] 空间参考转换后几何无效");
|
|
3933
3956
|
}
|
|
3934
3957
|
|
|
3935
3958
|
// 步骤3:构建goTo配置(优化动画/缩放参数,减少中断)
|
|
3936
3959
|
const goToOptions = {
|
|
3937
3960
|
animate: opts.animate,
|
|
3938
3961
|
// 新增:延长动画时间,避免快速中断(单点建议关闭动画)
|
|
3939
|
-
duration: opts.animate ? 500 : 0
|
|
3940
|
-
}
|
|
3962
|
+
duration: opts.animate ? 500 : 0,
|
|
3963
|
+
};
|
|
3941
3964
|
|
|
3942
3965
|
// MapView配置:限制缩放级别在有效范围(1-20)
|
|
3943
3966
|
if (isMap) {
|
|
3944
3967
|
if (isPointType) {
|
|
3945
|
-
goToOptions.zoom = Math.max(1, Math.min(20, opts.pointZoom))
|
|
3968
|
+
goToOptions.zoom = Math.max(1, Math.min(20, opts.pointZoom));
|
|
3946
3969
|
} else {
|
|
3947
|
-
goToOptions.padding = opts.padding
|
|
3970
|
+
goToOptions.padding = opts.padding;
|
|
3948
3971
|
}
|
|
3949
3972
|
}
|
|
3950
3973
|
// SceneView配置:限制scale在合理范围
|
|
3951
3974
|
else if (isScene) {
|
|
3952
3975
|
if (isPointType) {
|
|
3953
|
-
goToOptions.scale = Math.max(100, opts.pointScale)
|
|
3976
|
+
goToOptions.scale = Math.max(100, opts.pointScale);
|
|
3954
3977
|
// 新增:SceneView单点跳转强制设置target为相机位置,减少中断
|
|
3955
3978
|
goToOptions.target = {
|
|
3956
3979
|
position: projectedGeom,
|
|
3957
|
-
scale: goToOptions.scale
|
|
3958
|
-
}
|
|
3980
|
+
scale: goToOptions.scale,
|
|
3981
|
+
};
|
|
3959
3982
|
}
|
|
3960
3983
|
}
|
|
3961
3984
|
|
|
3962
3985
|
// 步骤4:执行跳转(捕获interrupted错误)
|
|
3963
3986
|
try {
|
|
3964
|
-
await view.goTo(projectedGeom, goToOptions)
|
|
3987
|
+
await view.goTo(projectedGeom, goToOptions);
|
|
3965
3988
|
} catch (gotoErr) {
|
|
3966
3989
|
// 捕获Goto was interrupted错误,重试
|
|
3967
|
-
if (gotoErr.message.includes(
|
|
3968
|
-
console.warn(
|
|
3990
|
+
if (gotoErr.message.includes("interrupted") && retryLeft > 0) {
|
|
3991
|
+
console.warn(
|
|
3992
|
+
`[mapJump] 跳转中断,剩余重试次数: ${retryLeft}`,
|
|
3993
|
+
gotoErr
|
|
3994
|
+
);
|
|
3969
3995
|
// 延迟50ms重试,避免连续中断
|
|
3970
|
-
await new Promise((resolve) => setTimeout(resolve, 50))
|
|
3971
|
-
return doGoToWithRetry(targetGeom, isPointType, retryLeft - 1)
|
|
3996
|
+
await new Promise((resolve) => setTimeout(resolve, 50));
|
|
3997
|
+
return doGoToWithRetry(targetGeom, isPointType, retryLeft - 1);
|
|
3972
3998
|
}
|
|
3973
|
-
throw gotoErr
|
|
3999
|
+
throw gotoErr;
|
|
3974
4000
|
}
|
|
3975
4001
|
} finally {
|
|
3976
|
-
isJumping = false // 重置防抖标记
|
|
4002
|
+
isJumping = false; // 重置防抖标记
|
|
3977
4003
|
}
|
|
3978
4004
|
}
|
|
3979
4005
|
|
|
@@ -3984,215 +4010,240 @@ function mapJump(view, target, options = { zoom: 16 }) {
|
|
|
3984
4010
|
*/
|
|
3985
4011
|
function getWMXLayerExtent(layer) {
|
|
3986
4012
|
// 优先读取图层内置范围
|
|
3987
|
-
if (layer.fullExtent) return layer.fullExtent
|
|
3988
|
-
if (layer.extent) return layer.extent
|
|
3989
|
-
if (layer.tileInfo
|
|
3990
|
-
if (layer.initialExtent) return layer.initialExtent
|
|
4013
|
+
if (layer.fullExtent) return layer.fullExtent;
|
|
4014
|
+
if (layer.extent) return layer.extent;
|
|
4015
|
+
if (layer.tileInfo.fullExtent) return layer.tileInfo.fullExtent;
|
|
4016
|
+
if (layer.initialExtent) return layer.initialExtent;
|
|
3991
4017
|
|
|
3992
4018
|
// 解析URL中的BBOX参数(WMS标准)
|
|
3993
4019
|
if (layer.url) {
|
|
3994
4020
|
try {
|
|
3995
|
-
const urlObj = new URL(layer.url)
|
|
3996
|
-
const bbox =
|
|
4021
|
+
const urlObj = new URL(layer.url);
|
|
4022
|
+
const bbox =
|
|
4023
|
+
urlObj.searchParams.get("BBOX") || urlObj.searchParams.get("bbox");
|
|
3997
4024
|
if (bbox) {
|
|
3998
|
-
const [xmin, ymin, xmax, ymax] = bbox.split(
|
|
4025
|
+
const [xmin, ymin, xmax, ymax] = bbox.split(",").map(Number);
|
|
3999
4026
|
if (!isNaN(xmin) && !isNaN(ymin) && !isNaN(xmax) && !isNaN(ymax)) {
|
|
4000
4027
|
return new window.jkEsri.Extent({
|
|
4001
4028
|
xmin,
|
|
4002
4029
|
ymin,
|
|
4003
4030
|
xmax,
|
|
4004
4031
|
ymax,
|
|
4005
|
-
spatialReference: layer.spatialReference || view.spatialReference
|
|
4006
|
-
})
|
|
4032
|
+
spatialReference: layer.spatialReference || view.spatialReference,
|
|
4033
|
+
});
|
|
4007
4034
|
}
|
|
4008
4035
|
}
|
|
4009
4036
|
} catch (e) {
|
|
4010
|
-
console.warn(
|
|
4037
|
+
console.warn("[getWMXLayerExtent] 解析URL BBOX失败:", e);
|
|
4011
4038
|
}
|
|
4012
4039
|
}
|
|
4013
4040
|
|
|
4014
4041
|
// 兜底范围
|
|
4015
|
-
return opts.fallbackExtent
|
|
4042
|
+
return opts.fallbackExtent;
|
|
4016
4043
|
}
|
|
4017
4044
|
|
|
4018
4045
|
// 主逻辑:Promise封装,统一处理所有目标类型
|
|
4019
4046
|
return new Promise(async (resolve, reject) => {
|
|
4020
|
-
let targetGeometry = null // 最终解析的几何实例
|
|
4021
|
-
let isPointType = false // 是否为点类几何
|
|
4047
|
+
let targetGeometry = null; // 最终解析的几何实例
|
|
4048
|
+
let isPointType = false; // 是否为点类几何
|
|
4022
4049
|
|
|
4023
4050
|
try {
|
|
4024
4051
|
// 等待视图就绪(前置校验)
|
|
4025
|
-
await waitViewReady()
|
|
4052
|
+
await waitViewReady();
|
|
4026
4053
|
|
|
4027
4054
|
// ========== 分支1:处理图层对象 ==========
|
|
4028
4055
|
if (
|
|
4029
4056
|
target &&
|
|
4030
|
-
typeof target ===
|
|
4057
|
+
typeof target === "object" &&
|
|
4031
4058
|
target.declaredClass &&
|
|
4032
|
-
target.declaredClass.endsWith(
|
|
4059
|
+
target.declaredClass.endsWith("Layer")
|
|
4033
4060
|
) {
|
|
4034
|
-
const layer = target
|
|
4061
|
+
const layer = target;
|
|
4035
4062
|
|
|
4036
4063
|
// 1.1 图形图层(GraphicsLayer)
|
|
4037
|
-
if (layer.declaredClass ===
|
|
4038
|
-
const graphics = layer.graphics.toArray()
|
|
4064
|
+
if (layer.declaredClass === "esri.layers.GraphicsLayer") {
|
|
4065
|
+
const graphics = layer.graphics.toArray();
|
|
4039
4066
|
if (graphics.length === 0) {
|
|
4040
|
-
reject(new Error(
|
|
4041
|
-
return
|
|
4067
|
+
reject(new Error("[mapJump] GraphicsLayer 无有效图形"));
|
|
4068
|
+
return;
|
|
4042
4069
|
}
|
|
4043
4070
|
|
|
4044
4071
|
// 单个图形且为点类 → 按点跳转
|
|
4045
4072
|
if (graphics.length === 1 && isPointGeometry(graphics[0].geometry)) {
|
|
4046
|
-
await doGoToWithRetry(graphics[0].geometry, true, opts.retryTimes)
|
|
4047
|
-
resolve()
|
|
4048
|
-
return
|
|
4073
|
+
await doGoToWithRetry(graphics[0].geometry, true, opts.retryTimes);
|
|
4074
|
+
resolve();
|
|
4075
|
+
return;
|
|
4049
4076
|
}
|
|
4050
4077
|
|
|
4051
4078
|
// 多个图形/线/面 → 计算合并范围
|
|
4052
|
-
const layerExtent = computeExtentFromGraphics(graphics)
|
|
4079
|
+
const layerExtent = computeExtentFromGraphics(graphics);
|
|
4053
4080
|
if (layerExtent) {
|
|
4054
|
-
await doGoToWithRetry(layerExtent, false, opts.retryTimes)
|
|
4055
|
-
resolve()
|
|
4081
|
+
await doGoToWithRetry(layerExtent, false, opts.retryTimes);
|
|
4082
|
+
resolve();
|
|
4056
4083
|
} else {
|
|
4057
4084
|
// 兜底1:取第一个有效图形
|
|
4058
|
-
const firstValid = graphics.find(
|
|
4085
|
+
const firstValid = graphics.find(
|
|
4086
|
+
(g) => g.geometry && getGeometryExtent(g.geometry)
|
|
4087
|
+
);
|
|
4059
4088
|
if (firstValid) {
|
|
4060
4089
|
await doGoToWithRetry(
|
|
4061
4090
|
firstValid.geometry,
|
|
4062
4091
|
isPointGeometry(firstValid.geometry),
|
|
4063
4092
|
opts.retryTimes
|
|
4064
|
-
)
|
|
4065
|
-
resolve()
|
|
4093
|
+
);
|
|
4094
|
+
resolve();
|
|
4066
4095
|
}
|
|
4067
4096
|
// 兜底2:使用配置的兜底范围
|
|
4068
4097
|
else if (opts.fallbackExtent) {
|
|
4069
|
-
await doGoToWithRetry(
|
|
4070
|
-
|
|
4098
|
+
await doGoToWithRetry(
|
|
4099
|
+
opts.fallbackExtent,
|
|
4100
|
+
false,
|
|
4101
|
+
opts.retryTimes
|
|
4102
|
+
);
|
|
4103
|
+
resolve();
|
|
4071
4104
|
}
|
|
4072
4105
|
// 最终兜底:报错
|
|
4073
4106
|
else {
|
|
4074
|
-
reject(
|
|
4107
|
+
reject(
|
|
4108
|
+
new Error(
|
|
4109
|
+
"[mapJump] 无法从GraphicsLayer计算有效范围,且无兜底范围"
|
|
4110
|
+
)
|
|
4111
|
+
);
|
|
4075
4112
|
}
|
|
4076
4113
|
}
|
|
4077
|
-
return
|
|
4114
|
+
return;
|
|
4078
4115
|
}
|
|
4079
4116
|
|
|
4080
4117
|
// 1.2 WMS/WMTS图层
|
|
4081
4118
|
if (
|
|
4082
|
-
layer.declaredClass ===
|
|
4083
|
-
layer.declaredClass ===
|
|
4119
|
+
layer.declaredClass === "esri.layers.WMSLayer" ||
|
|
4120
|
+
layer.declaredClass === "esri.layers.WMTSLayer"
|
|
4084
4121
|
) {
|
|
4085
4122
|
// 图层未加载则先加载
|
|
4086
4123
|
if (!layer.loaded) {
|
|
4087
|
-
await layer.load()
|
|
4124
|
+
await layer.load();
|
|
4088
4125
|
}
|
|
4089
|
-
const extent = getWMXLayerExtent(layer)
|
|
4126
|
+
const extent = getWMXLayerExtent(layer);
|
|
4090
4127
|
if (extent) {
|
|
4091
|
-
await doGoToWithRetry(extent, false, opts.retryTimes)
|
|
4092
|
-
resolve()
|
|
4128
|
+
await doGoToWithRetry(extent, false, opts.retryTimes);
|
|
4129
|
+
resolve();
|
|
4093
4130
|
} else {
|
|
4094
|
-
reject(
|
|
4131
|
+
reject(
|
|
4132
|
+
new Error(
|
|
4133
|
+
`WM${
|
|
4134
|
+
layer.declaredClass.includes("WMS") ? "S" : "TS"
|
|
4135
|
+
}图层无有效范围`
|
|
4136
|
+
)
|
|
4137
|
+
);
|
|
4095
4138
|
}
|
|
4096
|
-
return
|
|
4139
|
+
return;
|
|
4097
4140
|
}
|
|
4098
4141
|
|
|
4099
4142
|
// 1.3 服务图层(FeatureLayer/TileLayer等,支持queryExtent)
|
|
4100
|
-
if (typeof layer.queryExtent ===
|
|
4143
|
+
if (typeof layer.queryExtent === "function") {
|
|
4101
4144
|
if (!layer.loaded) {
|
|
4102
|
-
await layer.load()
|
|
4145
|
+
await layer.load();
|
|
4103
4146
|
}
|
|
4104
|
-
const res = await layer.queryExtent()
|
|
4105
|
-
if (res
|
|
4106
|
-
await doGoToWithRetry(res.extent, false, opts.retryTimes)
|
|
4107
|
-
resolve()
|
|
4147
|
+
const res = await layer.queryExtent();
|
|
4148
|
+
if (res.extent) {
|
|
4149
|
+
await doGoToWithRetry(res.extent, false, opts.retryTimes);
|
|
4150
|
+
resolve();
|
|
4108
4151
|
} else {
|
|
4109
|
-
reject(new Error(
|
|
4152
|
+
reject(new Error("服务图层查询范围为空"));
|
|
4110
4153
|
}
|
|
4111
|
-
return
|
|
4154
|
+
return;
|
|
4112
4155
|
}
|
|
4113
4156
|
|
|
4114
4157
|
// 1.4 普通图层(无queryExtent,用fullExtent)
|
|
4115
4158
|
if (layer.fullExtent) {
|
|
4116
|
-
await doGoToWithRetry(layer.fullExtent, false, opts.retryTimes)
|
|
4117
|
-
resolve()
|
|
4118
|
-
return
|
|
4159
|
+
await doGoToWithRetry(layer.fullExtent, false, opts.retryTimes);
|
|
4160
|
+
resolve();
|
|
4161
|
+
return;
|
|
4119
4162
|
}
|
|
4120
4163
|
|
|
4121
4164
|
// 不支持的图层类型
|
|
4122
|
-
reject(new Error(`[mapJump] 不支持的图层类型: ${layer.declaredClass}`))
|
|
4123
|
-
return
|
|
4165
|
+
reject(new Error(`[mapJump] 不支持的图层类型: ${layer.declaredClass}`));
|
|
4166
|
+
return;
|
|
4124
4167
|
}
|
|
4125
4168
|
|
|
4126
4169
|
// ========== 分支2:处理图形数组(API实例/纯JSON) ==========
|
|
4127
4170
|
if (Array.isArray(target) && target.length > 0) {
|
|
4128
4171
|
// 判断是否为Graphic数组(含纯JSON)
|
|
4129
|
-
const isGraphicArray = target.every((item) => item.geometry)
|
|
4172
|
+
const isGraphicArray = target.every((item) => item.geometry);
|
|
4130
4173
|
if (isGraphicArray) {
|
|
4131
4174
|
// 单个图形且为点类 → 按点跳转
|
|
4132
4175
|
if (target.length === 1 && isPointGeometry(target[0].geometry)) {
|
|
4133
|
-
targetGeometry = toEsriGeometry(target[0].geometry)
|
|
4176
|
+
targetGeometry = toEsriGeometry(target[0].geometry);
|
|
4134
4177
|
if (!targetGeometry) {
|
|
4135
|
-
reject(new Error(
|
|
4136
|
-
return
|
|
4178
|
+
reject(new Error("单个图形几何无效"));
|
|
4179
|
+
return;
|
|
4137
4180
|
}
|
|
4138
|
-
await doGoToWithRetry(targetGeometry, true, opts.retryTimes)
|
|
4139
|
-
resolve()
|
|
4140
|
-
return
|
|
4181
|
+
await doGoToWithRetry(targetGeometry, true, opts.retryTimes);
|
|
4182
|
+
resolve();
|
|
4183
|
+
return;
|
|
4141
4184
|
}
|
|
4142
4185
|
|
|
4143
4186
|
// 多个图形/线/面 → 计算合并范围
|
|
4144
|
-
const graphicsExtent = computeExtentFromGraphics(target)
|
|
4187
|
+
const graphicsExtent = computeExtentFromGraphics(target);
|
|
4145
4188
|
if (graphicsExtent) {
|
|
4146
|
-
await doGoToWithRetry(graphicsExtent, false, opts.retryTimes)
|
|
4147
|
-
resolve()
|
|
4189
|
+
await doGoToWithRetry(graphicsExtent, false, opts.retryTimes);
|
|
4190
|
+
resolve();
|
|
4148
4191
|
} else {
|
|
4149
4192
|
// 兜底1:取第一个有效图形
|
|
4150
|
-
const firstValid = target.find(
|
|
4193
|
+
const firstValid = target.find(
|
|
4194
|
+
(item) => item.geometry && toEsriGeometry(item.geometry)
|
|
4195
|
+
);
|
|
4151
4196
|
if (firstValid) {
|
|
4152
|
-
targetGeometry = toEsriGeometry(firstValid.geometry)
|
|
4197
|
+
targetGeometry = toEsriGeometry(firstValid.geometry);
|
|
4153
4198
|
await doGoToWithRetry(
|
|
4154
4199
|
targetGeometry,
|
|
4155
4200
|
isPointGeometry(firstValid.geometry),
|
|
4156
4201
|
opts.retryTimes
|
|
4157
|
-
)
|
|
4158
|
-
resolve()
|
|
4202
|
+
);
|
|
4203
|
+
resolve();
|
|
4159
4204
|
}
|
|
4160
4205
|
// 兜底2:兜底范围
|
|
4161
4206
|
else if (opts.fallbackExtent) {
|
|
4162
|
-
await doGoToWithRetry(
|
|
4163
|
-
|
|
4207
|
+
await doGoToWithRetry(
|
|
4208
|
+
opts.fallbackExtent,
|
|
4209
|
+
false,
|
|
4210
|
+
opts.retryTimes
|
|
4211
|
+
);
|
|
4212
|
+
resolve();
|
|
4164
4213
|
}
|
|
4165
4214
|
// 最终兜底
|
|
4166
4215
|
else {
|
|
4167
|
-
reject(
|
|
4216
|
+
reject(
|
|
4217
|
+
new Error("[mapJump] 无法从图形数组计算有效范围,且无兜底范围")
|
|
4218
|
+
);
|
|
4168
4219
|
}
|
|
4169
4220
|
}
|
|
4170
|
-
return
|
|
4221
|
+
return;
|
|
4171
4222
|
}
|
|
4172
4223
|
}
|
|
4173
4224
|
|
|
4174
4225
|
// ========== 分支3:处理单个Graphic(API实例/纯JSON) ==========
|
|
4175
4226
|
if (target && target.geometry) {
|
|
4176
|
-
targetGeometry = toEsriGeometry(target.geometry)
|
|
4177
|
-
isPointType = isPointGeometry(target.geometry)
|
|
4227
|
+
targetGeometry = toEsriGeometry(target.geometry);
|
|
4228
|
+
isPointType = isPointGeometry(target.geometry);
|
|
4178
4229
|
}
|
|
4179
4230
|
|
|
4180
4231
|
// ========== 分支4:处理几何对象(API实例/纯JSON) ==========
|
|
4181
4232
|
else if (target && (target.type || (target.x && target.y))) {
|
|
4182
|
-
targetGeometry = toEsriGeometry(target)
|
|
4183
|
-
isPointType = isPointGeometry(target)
|
|
4233
|
+
targetGeometry = toEsriGeometry(target);
|
|
4234
|
+
isPointType = isPointGeometry(target);
|
|
4184
4235
|
}
|
|
4185
4236
|
|
|
4186
4237
|
// ========== 分支5:处理普通坐标格式 ==========
|
|
4187
4238
|
else {
|
|
4188
|
-
const pointObj = parseToPoint(target)
|
|
4239
|
+
const pointObj = parseToPoint(target);
|
|
4189
4240
|
if (pointObj) {
|
|
4190
4241
|
targetGeometry = new window.jkEsri.Point({
|
|
4191
4242
|
x: pointObj.x,
|
|
4192
4243
|
y: pointObj.y,
|
|
4193
|
-
spatialReference: view.spatialReference
|
|
4194
|
-
})
|
|
4195
|
-
isPointType = true
|
|
4244
|
+
spatialReference: view.spatialReference,
|
|
4245
|
+
});
|
|
4246
|
+
isPointType = true;
|
|
4196
4247
|
}
|
|
4197
4248
|
}
|
|
4198
4249
|
|
|
@@ -4204,18 +4255,18 @@ function mapJump(view, target, options = { zoom: 16 }) {
|
|
|
4204
4255
|
2. 几何对象:Point/MultiPoint/Polyline/MultiPolyline/Polygon/MultiPolygon/Extent(API实例/纯JSON)
|
|
4205
4256
|
3. 图形对象:Graphic / 纯JSON Graphic / Graphic[] / 纯JSON Graphic[]
|
|
4206
4257
|
4. 图层对象:Layer(FeatureLayer/WMSLayer/WMTSLayer等)`)
|
|
4207
|
-
)
|
|
4208
|
-
return
|
|
4258
|
+
);
|
|
4259
|
+
return;
|
|
4209
4260
|
}
|
|
4210
4261
|
|
|
4211
4262
|
// 执行跳转(带重试)
|
|
4212
|
-
await doGoToWithRetry(targetGeometry, isPointType, opts.retryTimes)
|
|
4213
|
-
resolve()
|
|
4263
|
+
await doGoToWithRetry(targetGeometry, isPointType, opts.retryTimes);
|
|
4264
|
+
resolve();
|
|
4214
4265
|
} catch (e) {
|
|
4215
4266
|
// 捕获所有异常
|
|
4216
|
-
reject(new Error(`[mapJump] 执行失败: ${e.message}`))
|
|
4267
|
+
reject(new Error(`[mapJump] 执行失败: ${e.message}`));
|
|
4217
4268
|
}
|
|
4218
|
-
})
|
|
4269
|
+
});
|
|
4219
4270
|
}
|
|
4220
4271
|
|
|
4221
4272
|
|
|
@@ -4230,10 +4281,10 @@ function mapJump(view, target, options = { zoom: 16 }) {
|
|
|
4230
4281
|
* @returns
|
|
4231
4282
|
*/
|
|
4232
4283
|
function judgeLayerType(type) {
|
|
4233
|
-
if (!type) return
|
|
4234
|
-
if (type.includes(
|
|
4235
|
-
if (type.includes(
|
|
4236
|
-
if (type.includes(
|
|
4284
|
+
if (!type) return;
|
|
4285
|
+
if (type.includes("oint")) return "point";
|
|
4286
|
+
if (type.includes("olygon")) return "polygon";
|
|
4287
|
+
if (type.includes("ine")) return "polyline";
|
|
4237
4288
|
}
|
|
4238
4289
|
/**
|
|
4239
4290
|
* TextSymbol 符号
|
|
@@ -4249,16 +4300,20 @@ function judgeLayerType(type) {
|
|
|
4249
4300
|
*/
|
|
4250
4301
|
function getTextSymbol(options) {
|
|
4251
4302
|
try {
|
|
4252
|
-
const text = options.mapText ||
|
|
4253
|
-
const fontSize = isFinite(options.fontSize) ? Number(options.fontSize) : 10
|
|
4254
|
-
const color = (typeof options.color ===
|
|
4255
|
-
const haloColor =
|
|
4256
|
-
|
|
4257
|
-
const
|
|
4258
|
-
|
|
4303
|
+
const text = options.mapText || "暂无描述";
|
|
4304
|
+
const fontSize = isFinite(options.fontSize) ? Number(options.fontSize) : 10;
|
|
4305
|
+
const color = (typeof options.color === "string" && options.color) || "red";
|
|
4306
|
+
const haloColor =
|
|
4307
|
+
(typeof options.haloColor === "string" && options.haloColor) || "black";
|
|
4308
|
+
const haloSize =
|
|
4309
|
+
typeof options.haloSize !== "undefined"
|
|
4310
|
+
? String(options.haloSize)
|
|
4311
|
+
: "1px";
|
|
4312
|
+
const xoffset = isFinite(options.xoffset) ? Number(options.xoffset) : 3;
|
|
4313
|
+
const yoffset = isFinite(options.yoffset) ? Number(options.yoffset) : 3;
|
|
4259
4314
|
return {
|
|
4260
|
-
type:
|
|
4261
|
-
text: String(text ??
|
|
4315
|
+
type: "text",
|
|
4316
|
+
text: String(text ?? ""),
|
|
4262
4317
|
color: color,
|
|
4263
4318
|
haloColor: haloColor,
|
|
4264
4319
|
haloSize: haloSize,
|
|
@@ -4266,21 +4321,21 @@ function getTextSymbol(options) {
|
|
|
4266
4321
|
yoffset: yoffset,
|
|
4267
4322
|
font: {
|
|
4268
4323
|
size: fontSize,
|
|
4269
|
-
weight:
|
|
4270
|
-
}
|
|
4271
|
-
}
|
|
4324
|
+
weight: "bold",
|
|
4325
|
+
},
|
|
4326
|
+
};
|
|
4272
4327
|
} catch (e) {
|
|
4273
|
-
console.error(
|
|
4328
|
+
console.error("[getTextSymbol] 生成 symbol 失败,使用默认值:", e);
|
|
4274
4329
|
return {
|
|
4275
|
-
type:
|
|
4276
|
-
text:
|
|
4277
|
-
color:
|
|
4278
|
-
haloColor:
|
|
4279
|
-
haloSize:
|
|
4330
|
+
type: "text",
|
|
4331
|
+
text: "暂无标注",
|
|
4332
|
+
color: "red",
|
|
4333
|
+
haloColor: "black",
|
|
4334
|
+
haloSize: "1px",
|
|
4280
4335
|
xoffset: 3,
|
|
4281
4336
|
yoffset: 3,
|
|
4282
|
-
font: { size: 10, weight:
|
|
4283
|
-
}
|
|
4337
|
+
font: { size: 10, weight: "bold" },
|
|
4338
|
+
};
|
|
4284
4339
|
}
|
|
4285
4340
|
}
|
|
4286
4341
|
/**
|
|
@@ -4298,24 +4353,28 @@ function getSimpleMarkerSymbol(options) {
|
|
|
4298
4353
|
try {
|
|
4299
4354
|
// 1. 检查 ArcGIS API 是否加载
|
|
4300
4355
|
if (!window || !window.jkEsri || !window.jkEsri.SimpleMarkerSymbol) {
|
|
4301
|
-
console.error(
|
|
4302
|
-
|
|
4356
|
+
console.error(
|
|
4357
|
+
"[getSimpleMarkerSymbol] ArcGIS API-SimpleMarkerSymbol 未加载,跳过创建"
|
|
4358
|
+
);
|
|
4359
|
+
return null;
|
|
4303
4360
|
}
|
|
4304
4361
|
// 关键:设置偏移(单位:屏幕像素)
|
|
4305
|
-
let color =
|
|
4362
|
+
let color = "red",
|
|
4306
4363
|
size = 12,
|
|
4307
|
-
lineColor =
|
|
4364
|
+
lineColor = "white",
|
|
4308
4365
|
lineWidth = 1,
|
|
4309
|
-
style =
|
|
4310
|
-
angle = 0
|
|
4366
|
+
style = "circle",
|
|
4367
|
+
angle = 0;
|
|
4311
4368
|
if (options) {
|
|
4312
|
-
if (!isEmpty(options.color)) color = options.color
|
|
4313
|
-
if (isFinite(options.size) && Number(options.size))
|
|
4314
|
-
|
|
4315
|
-
if (!isEmpty(options.
|
|
4369
|
+
if (!isEmpty(options.color)) color = options.color;
|
|
4370
|
+
if (isFinite(options.size) && Number(options.size))
|
|
4371
|
+
size = Number(options.size);
|
|
4372
|
+
if (!isEmpty(options.lineColor)) lineColor = options.lineColor;
|
|
4373
|
+
if (!isEmpty(options.style)) style = options.style;
|
|
4316
4374
|
if (isFinite(options.lineWidth) && Number(options.lineWidth))
|
|
4317
|
-
lineWidth = Number(options.lineWidth)
|
|
4318
|
-
if (isFinite(options.angle) && Number(options.angle))
|
|
4375
|
+
lineWidth = Number(options.lineWidth);
|
|
4376
|
+
if (isFinite(options.angle) && Number(options.angle))
|
|
4377
|
+
angle = Number(options.angle);
|
|
4319
4378
|
}
|
|
4320
4379
|
return new window.jkEsri.SimpleMarkerSymbol({
|
|
4321
4380
|
color, // 填充色(支持 hex, rgb, named color)
|
|
@@ -4323,14 +4382,14 @@ function getSimpleMarkerSymbol(options) {
|
|
|
4323
4382
|
outline: {
|
|
4324
4383
|
// 边框
|
|
4325
4384
|
color: lineColor,
|
|
4326
|
-
width: lineWidth // 边框宽度(px)
|
|
4385
|
+
width: lineWidth, // 边框宽度(px)
|
|
4327
4386
|
},
|
|
4328
4387
|
style, // 形状:'circle' | 'square' | 'cross' | 'diamond' | 'triangle' | 'x'
|
|
4329
|
-
angle //仅'diamond' | 'triangle'有效
|
|
4330
|
-
})
|
|
4388
|
+
angle, //仅'diamond' | 'triangle'有效
|
|
4389
|
+
});
|
|
4331
4390
|
} catch (e) {
|
|
4332
|
-
console.error(
|
|
4333
|
-
return null
|
|
4391
|
+
console.error("[getSimpleMarkerSymbol] 生成 symbol 失败,", e);
|
|
4392
|
+
return null;
|
|
4334
4393
|
}
|
|
4335
4394
|
}
|
|
4336
4395
|
/**
|
|
@@ -4346,40 +4405,45 @@ function getSimpleMarkerSymbol(options) {
|
|
|
4346
4405
|
*/
|
|
4347
4406
|
function getPictureSymbol(options) {
|
|
4348
4407
|
if (isEmpty(options) || isEmpty(options.url)) {
|
|
4349
|
-
return getSimpleMarkerSymbol(options)
|
|
4408
|
+
return getSimpleMarkerSymbol(options);
|
|
4350
4409
|
}
|
|
4351
4410
|
try {
|
|
4352
4411
|
if (isEmpty(options) || isEmpty(options.url)) {
|
|
4353
|
-
console.error(
|
|
4354
|
-
return null
|
|
4412
|
+
console.error("[getPictureSymbol] 生成 symbol", options);
|
|
4413
|
+
return null;
|
|
4355
4414
|
}
|
|
4356
4415
|
// 关键:设置偏移(单位:屏幕像素)
|
|
4357
4416
|
let offset = {
|
|
4358
4417
|
x: 0, // 水平偏移:正数向右,负数向左
|
|
4359
|
-
y: 0 // 垂直偏移:正数向下,负数向上
|
|
4418
|
+
y: 0, // 垂直偏移:正数向下,负数向上
|
|
4360
4419
|
},
|
|
4361
4420
|
width = 20,
|
|
4362
4421
|
height = 20,
|
|
4363
4422
|
size = 0,
|
|
4364
|
-
url = options.url
|
|
4423
|
+
url = options.url;
|
|
4365
4424
|
if (options) {
|
|
4366
|
-
if (isFinite(options.width) && Number(options.width))
|
|
4367
|
-
|
|
4368
|
-
if (isFinite(options.
|
|
4369
|
-
|
|
4370
|
-
if (isFinite(options.
|
|
4425
|
+
if (isFinite(options.width) && Number(options.width))
|
|
4426
|
+
width = Number(options.width);
|
|
4427
|
+
if (isFinite(options.height) && Number(options.height))
|
|
4428
|
+
height = Number(options.height);
|
|
4429
|
+
if (isFinite(options.size) && Number(options.size))
|
|
4430
|
+
size = Number(options.size);
|
|
4431
|
+
if (isFinite(options.xoffset) && Number(options.xoffset))
|
|
4432
|
+
offset.x = Number(options.xoffset);
|
|
4433
|
+
if (isFinite(options.yoffset) && Number(options.yoffset))
|
|
4434
|
+
offset.y = Number(options.yoffset);
|
|
4371
4435
|
}
|
|
4372
4436
|
return {
|
|
4373
|
-
type:
|
|
4437
|
+
type: "picture-marker",
|
|
4374
4438
|
url, // 图片地址
|
|
4375
4439
|
width,
|
|
4376
4440
|
height,
|
|
4377
4441
|
size,
|
|
4378
|
-
offset
|
|
4379
|
-
}
|
|
4442
|
+
offset,
|
|
4443
|
+
};
|
|
4380
4444
|
} catch (e) {
|
|
4381
|
-
console.error(
|
|
4382
|
-
return null
|
|
4445
|
+
console.error("[getPictureSymbol] 生成 symbol 失败", e);
|
|
4446
|
+
return null;
|
|
4383
4447
|
}
|
|
4384
4448
|
}
|
|
4385
4449
|
|
|
@@ -4392,31 +4456,31 @@ function getPictureSymbol(options) {
|
|
|
4392
4456
|
* @returns symbol
|
|
4393
4457
|
*/
|
|
4394
4458
|
function getLineSymbol(options) {
|
|
4395
|
-
const { color =
|
|
4459
|
+
const { color = "#fff", width = 2, opacity = 100 } = options;
|
|
4396
4460
|
try {
|
|
4397
4461
|
// 1. 检查 ArcGIS API 是否加载
|
|
4398
4462
|
if (!window || !window.jkEsri || !window.jkEsri.Color) {
|
|
4399
|
-
console.error(
|
|
4400
|
-
return null
|
|
4463
|
+
console.error("[getLineSymbol] ArcGIS API-Color 未加载,跳过创建");
|
|
4464
|
+
return null;
|
|
4401
4465
|
}
|
|
4402
|
-
const esriColor = new window.jkEsri.Color(color)
|
|
4403
|
-
esriColor.a = Math.min(1, Math.max(0, opacity / 100))
|
|
4466
|
+
const esriColor = new window.jkEsri.Color(color);
|
|
4467
|
+
esriColor.a = Math.min(1, Math.max(0, opacity / 100));
|
|
4404
4468
|
return {
|
|
4405
|
-
type:
|
|
4469
|
+
type: "simple-line",
|
|
4406
4470
|
color: esriColor,
|
|
4407
4471
|
width: width,
|
|
4408
|
-
cap:
|
|
4409
|
-
join:
|
|
4410
|
-
}
|
|
4472
|
+
cap: "round",
|
|
4473
|
+
join: "round",
|
|
4474
|
+
};
|
|
4411
4475
|
} catch (e) {
|
|
4412
|
-
console.error(
|
|
4476
|
+
console.error("getLineSymbol未传入symbol,使用默认:", e);
|
|
4413
4477
|
return {
|
|
4414
|
-
type:
|
|
4415
|
-
color: new window.jkEsri.Color(
|
|
4478
|
+
type: "simple-line",
|
|
4479
|
+
color: new window.jkEsri.Color("#1f77b4").setAlpha(1),
|
|
4416
4480
|
width: 2,
|
|
4417
|
-
cap:
|
|
4418
|
-
join:
|
|
4419
|
-
}
|
|
4481
|
+
cap: "round",
|
|
4482
|
+
join: "round",
|
|
4483
|
+
};
|
|
4420
4484
|
}
|
|
4421
4485
|
}
|
|
4422
4486
|
/**
|
|
@@ -4431,29 +4495,29 @@ function getLineSymbol(options) {
|
|
|
4431
4495
|
* @returns symbol
|
|
4432
4496
|
*/
|
|
4433
4497
|
function getFillSymbol(options) {
|
|
4434
|
-
let color =
|
|
4435
|
-
lineColor =
|
|
4498
|
+
let color = "#fff",
|
|
4499
|
+
lineColor = "#fff",
|
|
4436
4500
|
width = 1,
|
|
4437
4501
|
opacity = 10,
|
|
4438
|
-
lineOpacity = 100
|
|
4502
|
+
lineOpacity = 100;
|
|
4439
4503
|
if (options) {
|
|
4440
|
-
if (options.color) color = options.color
|
|
4441
|
-
if (options.opacity || options.opacity == 0) opacity = options.opacity
|
|
4504
|
+
if (options.color) color = options.color;
|
|
4505
|
+
if (options.opacity || options.opacity == 0) opacity = options.opacity;
|
|
4442
4506
|
if (options.outline) {
|
|
4443
|
-
lineColor = options.outline
|
|
4444
|
-
width = options.outline
|
|
4445
|
-
lineOpacity = options.outline
|
|
4507
|
+
lineColor = options.outline.color || "#fff";
|
|
4508
|
+
width = options.outline.width || 1;
|
|
4509
|
+
lineOpacity = options.outline.opacity || 100;
|
|
4446
4510
|
}
|
|
4447
4511
|
}
|
|
4448
|
-
const colors = new window.jkEsri.Color(color)
|
|
4449
|
-
colors.a = opacity / 100
|
|
4450
|
-
const outColor = new window.jkEsri.Color(lineColor)
|
|
4451
|
-
outColor.a = lineOpacity / 100
|
|
4512
|
+
const colors = new window.jkEsri.Color(color);
|
|
4513
|
+
colors.a = opacity / 100;
|
|
4514
|
+
const outColor = new window.jkEsri.Color(lineColor);
|
|
4515
|
+
outColor.a = lineOpacity / 100;
|
|
4452
4516
|
return {
|
|
4453
|
-
type:
|
|
4517
|
+
type: "simple-fill",
|
|
4454
4518
|
color: colors,
|
|
4455
|
-
outline: { color: outColor, width: width }
|
|
4456
|
-
}
|
|
4519
|
+
outline: { color: outColor, width: width },
|
|
4520
|
+
};
|
|
4457
4521
|
}
|
|
4458
4522
|
/**
|
|
4459
4523
|
*
|
|
@@ -4464,38 +4528,44 @@ function drawLayer_drawLayer(options) {
|
|
|
4464
4528
|
try {
|
|
4465
4529
|
// 1. 检查 ArcGIS API 是否加载
|
|
4466
4530
|
if (!window || !window.jkEsri || !window.jkEsri.Graphic) {
|
|
4467
|
-
console.error(
|
|
4468
|
-
return null
|
|
4531
|
+
console.error("[drawLayer] ArcGIS API 未加载,跳过创建");
|
|
4532
|
+
return null;
|
|
4469
4533
|
}
|
|
4470
4534
|
if (isEmpty(options) || !options.geometry) {
|
|
4471
|
-
console.error(`[drawLayer] options.geometry格式不正确,${options}`)
|
|
4472
|
-
return null
|
|
4535
|
+
console.error(`[drawLayer] options.geometry格式不正确,${options}`);
|
|
4536
|
+
return null;
|
|
4473
4537
|
}
|
|
4474
4538
|
// 4. 构造安全 attributes(仅保留基本类型)
|
|
4475
|
-
const safeAttrs = options.attributes || options.properties || options || {}
|
|
4539
|
+
const safeAttrs = options.attributes || options.properties || options || {};
|
|
4476
4540
|
const json = {
|
|
4477
4541
|
geometry: options.geometry,
|
|
4478
|
-
attributes: safeAttrs
|
|
4479
|
-
}
|
|
4542
|
+
attributes: safeAttrs,
|
|
4543
|
+
};
|
|
4480
4544
|
let graphic = window.jkEsri.Graphic.fromJSON(json),
|
|
4481
|
-
symbol = null
|
|
4482
|
-
const geometry = options.geometry
|
|
4483
|
-
if (
|
|
4545
|
+
symbol = null;
|
|
4546
|
+
const geometry = options.geometry;
|
|
4547
|
+
if (
|
|
4548
|
+
geometry.x ||
|
|
4549
|
+
geometry.longitude ||
|
|
4550
|
+
(geometry.points && geometry.points.length > 0)
|
|
4551
|
+
) {
|
|
4484
4552
|
if (options.mapText) {
|
|
4485
|
-
symbol = getTextSymbol(options)
|
|
4553
|
+
symbol = getTextSymbol(options);
|
|
4486
4554
|
} else {
|
|
4487
|
-
symbol = options.url
|
|
4555
|
+
symbol = options.url
|
|
4556
|
+
? getPictureSymbol(options)
|
|
4557
|
+
: getSimpleMarkerSymbol(options);
|
|
4488
4558
|
}
|
|
4489
4559
|
} else if (geometry.paths && geometry.paths.length > 0) {
|
|
4490
|
-
symbol = getLineSymbol(options)
|
|
4560
|
+
symbol = getLineSymbol(options);
|
|
4491
4561
|
} else if (geometry.rings && geometry.rings.length > 0) {
|
|
4492
|
-
symbol = getFillSymbol(options)
|
|
4562
|
+
symbol = getFillSymbol(options);
|
|
4493
4563
|
}
|
|
4494
|
-
graphic.symbol = symbol
|
|
4495
|
-
return graphic
|
|
4564
|
+
graphic.symbol = symbol;
|
|
4565
|
+
return graphic;
|
|
4496
4566
|
} catch (e) {
|
|
4497
|
-
console.error(
|
|
4498
|
-
return null
|
|
4567
|
+
console.error("[drawLayer]失败,", e);
|
|
4568
|
+
return null;
|
|
4499
4569
|
}
|
|
4500
4570
|
}
|
|
4501
4571
|
/**
|
|
@@ -4509,37 +4579,39 @@ function drawArcPoint(options) {
|
|
|
4509
4579
|
try {
|
|
4510
4580
|
// 1. 检查 ArcGIS API 是否加载
|
|
4511
4581
|
if (!window || !window.jkEsri) {
|
|
4512
|
-
console.error(
|
|
4513
|
-
throw new Error(
|
|
4582
|
+
console.error("[createArcPoint] ArcGIS API 未加载,跳过创建");
|
|
4583
|
+
throw new Error("[createArcPoint] ArcGIS API 未加载,跳过创建");
|
|
4514
4584
|
}
|
|
4515
4585
|
|
|
4516
4586
|
// 2. 解析坐标
|
|
4517
|
-
const point = toArcGISPoint(options)
|
|
4587
|
+
const point = toArcGISPoint(options);
|
|
4518
4588
|
if (!point || !isFinite(point.x) || !isFinite(point.y)) {
|
|
4519
|
-
console.error(
|
|
4520
|
-
throw new Error(
|
|
4589
|
+
console.error("[createText] 坐标无效,跳过创建:", options);
|
|
4590
|
+
throw new Error("[createText] 坐标无效,跳过创建");
|
|
4521
4591
|
}
|
|
4522
|
-
const geometry = point
|
|
4592
|
+
const geometry = point;
|
|
4523
4593
|
// 4. 构造安全 attributes(仅保留基本类型)
|
|
4524
4594
|
|
|
4525
4595
|
// 5. 创建 symbol
|
|
4526
|
-
let symbol = null
|
|
4596
|
+
let symbol = null;
|
|
4527
4597
|
if (options.mapText) {
|
|
4528
|
-
symbol = getTextSymbol(options)
|
|
4598
|
+
symbol = getTextSymbol(options);
|
|
4529
4599
|
} else {
|
|
4530
|
-
symbol = options.url
|
|
4600
|
+
symbol = options.url
|
|
4601
|
+
? getPictureSymbol(options)
|
|
4602
|
+
: getSimpleMarkerSymbol(options);
|
|
4531
4603
|
}
|
|
4532
4604
|
// 6. 创建 Graphic
|
|
4533
4605
|
const graphic = new window.jkEsri.Graphic({
|
|
4534
4606
|
geometry,
|
|
4535
4607
|
symbol: symbol,
|
|
4536
|
-
attributes: options
|
|
4537
|
-
})
|
|
4538
|
-
return graphic
|
|
4608
|
+
attributes: options,
|
|
4609
|
+
});
|
|
4610
|
+
return graphic;
|
|
4539
4611
|
} catch (error) {
|
|
4540
4612
|
// 任何异常都捕获,不中断流程
|
|
4541
|
-
console.error(
|
|
4542
|
-
return null
|
|
4613
|
+
console.error("[createText] 创建文本标注失败,已跳过:", error);
|
|
4614
|
+
return null;
|
|
4543
4615
|
}
|
|
4544
4616
|
}
|
|
4545
4617
|
/**
|
|
@@ -4553,32 +4625,37 @@ function createArcPoint(options) {
|
|
|
4553
4625
|
try {
|
|
4554
4626
|
// 1. 检查 ArcGIS API 是否加载
|
|
4555
4627
|
if (!window || !window.jkEsri) {
|
|
4556
|
-
console.error(
|
|
4557
|
-
return null
|
|
4628
|
+
console.error("[createArcPoint] ArcGIS API 未加载,跳过创建");
|
|
4629
|
+
return null;
|
|
4558
4630
|
}
|
|
4559
|
-
if (isEmpty(options) || typeof options !=
|
|
4560
|
-
console.error(
|
|
4561
|
-
return null
|
|
4631
|
+
if (isEmpty(options) || typeof options != "object") {
|
|
4632
|
+
console.error("[createArcPoint] 数据格式不对,跳过创建", options);
|
|
4633
|
+
return null;
|
|
4562
4634
|
}
|
|
4563
4635
|
// 情况 A: GeoJSON MultiPoint
|
|
4564
|
-
if (options.type ===
|
|
4565
|
-
let graphics = []
|
|
4636
|
+
if (options.type === "MultiPoint" && Array.isArray(options.coordinates)) {
|
|
4637
|
+
let graphics = [];
|
|
4566
4638
|
options.coordinates.map((coord) => {
|
|
4567
|
-
if (
|
|
4639
|
+
if (
|
|
4640
|
+
Array.isArray(coord) &&
|
|
4641
|
+
coord.length >= 2 &&
|
|
4642
|
+
isFinite(coord[0]) &&
|
|
4643
|
+
isFinite(coord[1])
|
|
4644
|
+
) {
|
|
4568
4645
|
let pointData = {
|
|
4569
4646
|
...options,
|
|
4570
4647
|
longitude: coord[0],
|
|
4571
|
-
latitude: coord[1]
|
|
4572
|
-
}
|
|
4573
|
-
graphics.push(drawArcPoint(pointData))
|
|
4648
|
+
latitude: coord[1],
|
|
4649
|
+
};
|
|
4650
|
+
graphics.push(drawArcPoint(pointData));
|
|
4574
4651
|
}
|
|
4575
|
-
})
|
|
4576
|
-
if (graphics && graphics.length > 0) return graphics
|
|
4577
|
-
} else return drawArcPoint(options)
|
|
4652
|
+
});
|
|
4653
|
+
if (graphics && graphics.length > 0) return graphics;
|
|
4654
|
+
} else return drawArcPoint(options);
|
|
4578
4655
|
} catch (error) {
|
|
4579
4656
|
// 任何异常都捕获,不中断流程
|
|
4580
|
-
console.error(
|
|
4581
|
-
return null
|
|
4657
|
+
console.error("[createArcPoint] 创建文本标注失败,已跳过:", error);
|
|
4658
|
+
return null;
|
|
4582
4659
|
}
|
|
4583
4660
|
}
|
|
4584
4661
|
// ==================== 内部解析函数 ====================
|
|
@@ -4588,81 +4665,81 @@ function createArcPoint(options) {
|
|
|
4588
4665
|
*/
|
|
4589
4666
|
function parseLineItem(item, defaultWKID, index) {
|
|
4590
4667
|
try {
|
|
4591
|
-
let geometry = null
|
|
4592
|
-
let attributes = {}
|
|
4668
|
+
let geometry = null;
|
|
4669
|
+
let attributes = {};
|
|
4593
4670
|
|
|
4594
4671
|
// 情况 1: 已是 Graphic 或 Feature 格式
|
|
4595
4672
|
if (item.geometry) {
|
|
4596
|
-
const geom = item.geometry
|
|
4597
|
-
if (geom.type ===
|
|
4673
|
+
const geom = item.geometry;
|
|
4674
|
+
if (geom.type === "polyline" && Array.isArray(geom.paths)) {
|
|
4598
4675
|
geometry = new window.jkEsri.Polyline({
|
|
4599
4676
|
paths: geom.paths,
|
|
4600
|
-
spatialReference: geom.spatialReference || { wkid: defaultWKID }
|
|
4601
|
-
})
|
|
4677
|
+
spatialReference: geom.spatialReference || { wkid: defaultWKID },
|
|
4678
|
+
});
|
|
4602
4679
|
} else if (geom.x !== undefined || geom.rings !== undefined) {
|
|
4603
4680
|
// 非线几何,跳过
|
|
4604
|
-
return null
|
|
4681
|
+
return null;
|
|
4605
4682
|
}
|
|
4606
|
-
attributes = { ...item.attributes, ...item } // 合并属性
|
|
4683
|
+
attributes = { ...item.attributes, ...item }; // 合并属性
|
|
4607
4684
|
}
|
|
4608
4685
|
// 情况 2: WKT 字符串
|
|
4609
|
-
else if (typeof item ===
|
|
4686
|
+
else if (typeof item === "string") {
|
|
4610
4687
|
if (isWKTMultiLineString(item) || isWKTPolyline(item)) {
|
|
4611
|
-
const paths = parseWKTToPaths(item)
|
|
4688
|
+
const paths = parseWKTToPaths(item);
|
|
4612
4689
|
if (paths) {
|
|
4613
4690
|
geometry = new window.jkEsri.Polyline({
|
|
4614
4691
|
paths,
|
|
4615
|
-
spatialReference: { wkid: defaultWKID }
|
|
4616
|
-
})
|
|
4692
|
+
spatialReference: { wkid: defaultWKID },
|
|
4693
|
+
});
|
|
4617
4694
|
}
|
|
4618
4695
|
}
|
|
4619
|
-
attributes = { wkt: item }
|
|
4696
|
+
attributes = { wkt: item };
|
|
4620
4697
|
}
|
|
4621
4698
|
// 情况 3: GeoJSON
|
|
4622
4699
|
else if (item.type) {
|
|
4623
|
-
if (item.type ===
|
|
4624
|
-
return parseLineItem(item.geometry || item, defaultWKID, index) // 递归处理 geometry
|
|
4625
|
-
} else if ([
|
|
4626
|
-
const paths = geoJSONToArcGISPaths(item)
|
|
4700
|
+
if (item.type === "Feature") {
|
|
4701
|
+
return parseLineItem(item.geometry || item, defaultWKID, index); // 递归处理 geometry
|
|
4702
|
+
} else if (["LineString", "MultiLineString"].includes(item.type)) {
|
|
4703
|
+
const paths = geoJSONToArcGISPaths(item);
|
|
4627
4704
|
if (paths) {
|
|
4628
4705
|
geometry = new window.jkEsri.Polyline({
|
|
4629
4706
|
paths,
|
|
4630
|
-
spatialReference: { wkid: defaultWKID }
|
|
4631
|
-
})
|
|
4707
|
+
spatialReference: { wkid: defaultWKID },
|
|
4708
|
+
});
|
|
4632
4709
|
}
|
|
4633
|
-
attributes = { ...item.properties }
|
|
4710
|
+
attributes = { ...item.properties };
|
|
4634
4711
|
}
|
|
4635
4712
|
}
|
|
4636
4713
|
// 情况 4: 纯坐标数组
|
|
4637
4714
|
else if (Array.isArray(item)) {
|
|
4638
|
-
const paths = normalizePaths(item)
|
|
4715
|
+
const paths = normalizePaths(item);
|
|
4639
4716
|
if (paths) {
|
|
4640
4717
|
geometry = new window.jkEsri.Polyline({
|
|
4641
4718
|
paths,
|
|
4642
|
-
spatialReference: { wkid: defaultWKID }
|
|
4643
|
-
})
|
|
4719
|
+
spatialReference: { wkid: defaultWKID },
|
|
4720
|
+
});
|
|
4644
4721
|
}
|
|
4645
|
-
attributes = { input:
|
|
4722
|
+
attributes = { input: "array" };
|
|
4646
4723
|
}
|
|
4647
4724
|
|
|
4648
4725
|
if (!geometry) {
|
|
4649
|
-
console.error(`Invalid line data at index ${index}:`, item)
|
|
4650
|
-
return null
|
|
4726
|
+
console.error(`Invalid line data at index ${index}:`, item);
|
|
4727
|
+
return null;
|
|
4651
4728
|
}
|
|
4652
4729
|
|
|
4653
4730
|
// 添加默认属性
|
|
4654
4731
|
attributes = {
|
|
4655
4732
|
sourceIndex: index,
|
|
4656
|
-
...attributes
|
|
4657
|
-
}
|
|
4733
|
+
...attributes,
|
|
4734
|
+
};
|
|
4658
4735
|
|
|
4659
4736
|
return new window.jkEsri.Graphic({
|
|
4660
4737
|
geometry,
|
|
4661
|
-
attributes
|
|
4662
|
-
})
|
|
4738
|
+
attributes,
|
|
4739
|
+
});
|
|
4663
4740
|
} catch (e) {
|
|
4664
|
-
console.error(`Failed to parse line item at index ${index}:`, e)
|
|
4665
|
-
return null
|
|
4741
|
+
console.error(`Failed to parse line item at index ${index}:`, e);
|
|
4742
|
+
return null;
|
|
4666
4743
|
}
|
|
4667
4744
|
}
|
|
4668
4745
|
|
|
@@ -4673,7 +4750,10 @@ function parseLineItem(item, defaultWKID, index) {
|
|
|
4673
4750
|
* @returns
|
|
4674
4751
|
*/
|
|
4675
4752
|
function isWKTMultiLineString(str) {
|
|
4676
|
-
return
|
|
4753
|
+
return (
|
|
4754
|
+
typeof str === "string" &&
|
|
4755
|
+
str.trim().toUpperCase().startsWith("MULTILINESTRING")
|
|
4756
|
+
);
|
|
4677
4757
|
}
|
|
4678
4758
|
/**
|
|
4679
4759
|
* 判断LINESTRING
|
|
@@ -4681,7 +4761,9 @@ function isWKTMultiLineString(str) {
|
|
|
4681
4761
|
* @returns
|
|
4682
4762
|
*/
|
|
4683
4763
|
function isWKTPolyline(str) {
|
|
4684
|
-
return
|
|
4764
|
+
return (
|
|
4765
|
+
typeof str === "string" && str.trim().toUpperCase().startsWith("LINESTRING")
|
|
4766
|
+
);
|
|
4685
4767
|
}
|
|
4686
4768
|
/**
|
|
4687
4769
|
* 线转化
|
|
@@ -4690,25 +4772,27 @@ function isWKTPolyline(str) {
|
|
|
4690
4772
|
*/
|
|
4691
4773
|
function parseWKTToPaths(wkt) {
|
|
4692
4774
|
try {
|
|
4693
|
-
const upper = wkt.trim().toUpperCase()
|
|
4694
|
-
let coordsPart
|
|
4695
|
-
if (upper.startsWith(
|
|
4696
|
-
coordsPart = wkt.match(/MULTILINESTRING\s*\(\s*(.+)\s*\)/i)?.[1]
|
|
4697
|
-
if (!coordsPart) return null
|
|
4698
|
-
const lines = coordsPart.split(/\)\s*,\s*\(/)
|
|
4775
|
+
const upper = wkt.trim().toUpperCase();
|
|
4776
|
+
let coordsPart;
|
|
4777
|
+
if (upper.startsWith("MULTILINESTRING")) {
|
|
4778
|
+
coordsPart = wkt.match(/MULTILINESTRING\s*\(\s*(.+)\s*\)/i)?.[1];
|
|
4779
|
+
if (!coordsPart) return null;
|
|
4780
|
+
const lines = coordsPart.split(/\)\s*,\s*\(/);
|
|
4699
4781
|
return lines.map((line) => {
|
|
4700
|
-
line = line.replace(/^\(/,
|
|
4701
|
-
return line.split(
|
|
4702
|
-
})
|
|
4703
|
-
} else if (upper.startsWith(
|
|
4704
|
-
coordsPart = wkt.match(/LINESTRING\s*\(\s*(.+)\s*\)/i)?.[1]
|
|
4705
|
-
if (!coordsPart) return null
|
|
4706
|
-
return [
|
|
4707
|
-
|
|
4708
|
-
|
|
4782
|
+
line = line.replace(/^\(/, "").replace(/\)$/, "");
|
|
4783
|
+
return line.split(",").map((pt) => pt.trim().split(/\s+/).map(Number));
|
|
4784
|
+
});
|
|
4785
|
+
} else if (upper.startsWith("LINESTRING")) {
|
|
4786
|
+
coordsPart = wkt.match(/LINESTRING\s*\(\s*(.+)\s*\)/i)?.[1];
|
|
4787
|
+
if (!coordsPart) return null;
|
|
4788
|
+
return [
|
|
4789
|
+
coordsPart.split(",").map((pt) => pt.trim().split(/\s+/).map(Number)),
|
|
4790
|
+
];
|
|
4791
|
+
}
|
|
4792
|
+
return null;
|
|
4709
4793
|
} catch (e) {
|
|
4710
|
-
console.error(
|
|
4711
|
-
return null
|
|
4794
|
+
console.error("WKT parse error:", e);
|
|
4795
|
+
return null;
|
|
4712
4796
|
}
|
|
4713
4797
|
}
|
|
4714
4798
|
/**
|
|
@@ -4717,13 +4801,13 @@ function parseWKTToPaths(wkt) {
|
|
|
4717
4801
|
* @returns
|
|
4718
4802
|
*/
|
|
4719
4803
|
function geoJSONToArcGISPaths(geojson) {
|
|
4720
|
-
if (!geojson.coordinates) return null
|
|
4721
|
-
if (geojson.type ===
|
|
4722
|
-
return [geojson.coordinates]
|
|
4723
|
-
} else if (geojson.type ===
|
|
4724
|
-
return geojson.coordinates
|
|
4804
|
+
if (!geojson.coordinates) return null;
|
|
4805
|
+
if (geojson.type === "LineString") {
|
|
4806
|
+
return [geojson.coordinates];
|
|
4807
|
+
} else if (geojson.type === "MultiLineString") {
|
|
4808
|
+
return geojson.coordinates;
|
|
4725
4809
|
}
|
|
4726
|
-
return null
|
|
4810
|
+
return null;
|
|
4727
4811
|
}
|
|
4728
4812
|
/**
|
|
4729
4813
|
* 格式化路径
|
|
@@ -4731,17 +4815,17 @@ function geoJSONToArcGISPaths(geojson) {
|
|
|
4731
4815
|
* @returns
|
|
4732
4816
|
*/
|
|
4733
4817
|
function normalizePaths(input) {
|
|
4734
|
-
if (!Array.isArray(input) || input.length === 0) return null
|
|
4818
|
+
if (!Array.isArray(input) || input.length === 0) return null;
|
|
4735
4819
|
|
|
4736
4820
|
// 多段线:[[[x,y],...], [[x,y],...]]
|
|
4737
4821
|
if (Array.isArray(input[0]) && Array.isArray(input[0][0])) {
|
|
4738
|
-
return input
|
|
4822
|
+
return input;
|
|
4739
4823
|
}
|
|
4740
4824
|
// 单段线:[[x,y], [x,y]]
|
|
4741
|
-
if (Array.isArray(input[0]) && typeof input[0][0] ===
|
|
4742
|
-
return [input]
|
|
4825
|
+
if (Array.isArray(input[0]) && typeof input[0][0] === "number") {
|
|
4826
|
+
return [input];
|
|
4743
4827
|
}
|
|
4744
|
-
return null
|
|
4828
|
+
return null;
|
|
4745
4829
|
}
|
|
4746
4830
|
|
|
4747
4831
|
/**
|
|
@@ -4754,77 +4838,77 @@ function normalizePaths(input) {
|
|
|
4754
4838
|
*/
|
|
4755
4839
|
async function createLineFeatureLayer(lineDataList = [], options = {}) {
|
|
4756
4840
|
if (!Array.isArray(lineDataList) || lineDataList.length === 0) {
|
|
4757
|
-
console.error(
|
|
4758
|
-
return null
|
|
4841
|
+
console.error("No line data provided");
|
|
4842
|
+
return null;
|
|
4759
4843
|
}
|
|
4760
4844
|
|
|
4761
|
-
const { defaultWKID = 4326, layerId =
|
|
4845
|
+
const { defaultWKID = 4326, layerId = "lineFeatureId" } = options;
|
|
4762
4846
|
|
|
4763
4847
|
try {
|
|
4764
4848
|
// 1. 解析所有线数据为统一格式:{ geometry: Polyline, attributes: Object }
|
|
4765
4849
|
const features = lineDataList
|
|
4766
4850
|
.map((item, index) => parseLineItem(item, defaultWKID, index))
|
|
4767
|
-
.filter(Boolean) // 过滤无效项
|
|
4851
|
+
.filter(Boolean); // 过滤无效项
|
|
4768
4852
|
|
|
4769
4853
|
if (features.length === 0) {
|
|
4770
|
-
console.error(
|
|
4771
|
-
return null
|
|
4854
|
+
console.error("No valid line features parsed");
|
|
4855
|
+
return null;
|
|
4772
4856
|
}
|
|
4773
4857
|
|
|
4774
4858
|
// 2. 推断空间参考(优先使用第一个有效 geometry 的 WKID)
|
|
4775
|
-
const firstGeom = features[0].geometry
|
|
4859
|
+
const firstGeom = features[0].geometry;
|
|
4776
4860
|
const spatialReference = firstGeom.spatialReference || {
|
|
4777
|
-
wkid: defaultWKID
|
|
4778
|
-
}
|
|
4861
|
+
wkid: defaultWKID,
|
|
4862
|
+
};
|
|
4779
4863
|
|
|
4780
4864
|
// 3. 创建 FeatureLayer 所需的 fields(自动推断属性字段)
|
|
4781
|
-
const allAttrs = features.map((f) => f.attributes).filter(Boolean)
|
|
4782
|
-
const fieldMap = new Set([
|
|
4865
|
+
const allAttrs = features.map((f) => f.attributes).filter(Boolean);
|
|
4866
|
+
const fieldMap = new Set(["OBJECTID"]); // 必须包含 OBJECTID
|
|
4783
4867
|
|
|
4784
4868
|
allAttrs.forEach((attrs) => {
|
|
4785
|
-
if (attrs && typeof attrs ===
|
|
4786
|
-
Object.keys(attrs).forEach((key) => fieldMap.add(key))
|
|
4869
|
+
if (attrs && typeof attrs === "object") {
|
|
4870
|
+
Object.keys(attrs).forEach((key) => fieldMap.add(key));
|
|
4787
4871
|
}
|
|
4788
|
-
})
|
|
4872
|
+
});
|
|
4789
4873
|
|
|
4790
4874
|
const fields = Array.from(fieldMap).map((name) => ({
|
|
4791
4875
|
name,
|
|
4792
|
-
type:
|
|
4793
|
-
alias: name
|
|
4794
|
-
}))
|
|
4876
|
+
type: "string", // 简化处理,实际可按值类型判断
|
|
4877
|
+
alias: name,
|
|
4878
|
+
}));
|
|
4795
4879
|
|
|
4796
4880
|
// 4. 确保每个 feature 有 OBJECTID
|
|
4797
4881
|
features.forEach((feature, i) => {
|
|
4798
|
-
if (!feature.attributes) feature.attributes = {}
|
|
4882
|
+
if (!feature.attributes) feature.attributes = {};
|
|
4799
4883
|
if (feature.attributes.OBJECTID == null) {
|
|
4800
|
-
feature.attributes.OBJECTID = i + 1
|
|
4884
|
+
feature.attributes.OBJECTID = i + 1;
|
|
4801
4885
|
}
|
|
4802
|
-
})
|
|
4886
|
+
});
|
|
4803
4887
|
|
|
4804
4888
|
// 5. 创建 FeatureLayer
|
|
4805
4889
|
const layer = new window.jkEsri.FeatureLayer({
|
|
4806
4890
|
source: features,
|
|
4807
4891
|
fields: fields,
|
|
4808
|
-
objectIdField:
|
|
4809
|
-
geometryType:
|
|
4892
|
+
objectIdField: "OBJECTID",
|
|
4893
|
+
geometryType: "polyline",
|
|
4810
4894
|
spatialReference: spatialReference,
|
|
4811
4895
|
renderer: {
|
|
4812
|
-
type:
|
|
4896
|
+
type: "simple",
|
|
4813
4897
|
symbol: {
|
|
4814
|
-
type:
|
|
4815
|
-
color:
|
|
4898
|
+
type: "simple-line",
|
|
4899
|
+
color: "#1f77b4",
|
|
4816
4900
|
width: 2,
|
|
4817
|
-
cap:
|
|
4818
|
-
join:
|
|
4819
|
-
}
|
|
4901
|
+
cap: "round",
|
|
4902
|
+
join: "round",
|
|
4903
|
+
},
|
|
4820
4904
|
},
|
|
4821
|
-
title:
|
|
4822
|
-
id: layerId
|
|
4823
|
-
})
|
|
4824
|
-
return layer
|
|
4905
|
+
title: "Dynamic Line Layer",
|
|
4906
|
+
id: layerId,
|
|
4907
|
+
});
|
|
4908
|
+
return layer;
|
|
4825
4909
|
} catch (error) {
|
|
4826
|
-
console.error(
|
|
4827
|
-
return null
|
|
4910
|
+
console.error("Failed to create FeatureLayer:", error);
|
|
4911
|
+
return null;
|
|
4828
4912
|
}
|
|
4829
4913
|
}
|
|
4830
4914
|
|
|
@@ -4832,24 +4916,26 @@ async function createLineFeatureLayer(lineDataList = [], options = {}) {
|
|
|
4832
4916
|
* 将任意线数据项解析为 Graphic
|
|
4833
4917
|
*/
|
|
4834
4918
|
function parseLineToGraphic(item, defaultWKID, defaultSymbol, index) {
|
|
4835
|
-
let geometry = null
|
|
4836
|
-
let attributes = {}
|
|
4919
|
+
let geometry = null;
|
|
4920
|
+
let attributes = {};
|
|
4837
4921
|
|
|
4838
4922
|
try {
|
|
4839
4923
|
// 情况 1: 已是 Graphic 对象
|
|
4840
4924
|
if (item instanceof window.jkEsri.Graphic) {
|
|
4841
|
-
const geom = item.geometry
|
|
4842
|
-
if (geom && geom.type ===
|
|
4843
|
-
return item // 直接复用
|
|
4925
|
+
const geom = item.geometry;
|
|
4926
|
+
if (geom && geom.type === "polyline") {
|
|
4927
|
+
return item; // 直接复用
|
|
4844
4928
|
} else {
|
|
4845
|
-
console.error(
|
|
4846
|
-
|
|
4929
|
+
console.error(
|
|
4930
|
+
`Item at index ${index} is a Graphic but not polyline, skipped`
|
|
4931
|
+
);
|
|
4932
|
+
return null;
|
|
4847
4933
|
}
|
|
4848
4934
|
}
|
|
4849
4935
|
|
|
4850
4936
|
// 情况 2: 包含 geometry 的对象(如 Feature 格式)
|
|
4851
|
-
if (item && typeof item ===
|
|
4852
|
-
const geom = item.geometry
|
|
4937
|
+
if (item && typeof item === "object" && item.geometry) {
|
|
4938
|
+
const geom = item.geometry;
|
|
4853
4939
|
if (
|
|
4854
4940
|
Array.isArray(geom.paths) ||
|
|
4855
4941
|
Array.isArray(geom.coordinates) ||
|
|
@@ -4857,14 +4943,14 @@ function parseLineToGraphic(item, defaultWKID, defaultSymbol, index) {
|
|
|
4857
4943
|
) {
|
|
4858
4944
|
geometry = new window.jkEsri.Polyline({
|
|
4859
4945
|
paths: geom.paths || geom.coordinates || geom.rings,
|
|
4860
|
-
spatialReference: geom.spatialReference || { wkid: defaultWKID }
|
|
4861
|
-
})
|
|
4946
|
+
spatialReference: geom.spatialReference || { wkid: defaultWKID },
|
|
4947
|
+
});
|
|
4862
4948
|
}
|
|
4863
|
-
attributes = { ...item.attributes, ...item }
|
|
4949
|
+
attributes = { ...item.attributes, ...item };
|
|
4864
4950
|
}
|
|
4865
4951
|
// 情况 3: GeoJSON
|
|
4866
|
-
if (item && typeof item ===
|
|
4867
|
-
if (judgeLayerType(item.type) ==
|
|
4952
|
+
if (item && typeof item === "object" && item.type) {
|
|
4953
|
+
if (judgeLayerType(item.type) == "polyline") {
|
|
4868
4954
|
if (
|
|
4869
4955
|
Array.isArray(item.paths) ||
|
|
4870
4956
|
Array.isArray(item.coordinates) ||
|
|
@@ -4872,72 +4958,77 @@ function parseLineToGraphic(item, defaultWKID, defaultSymbol, index) {
|
|
|
4872
4958
|
) {
|
|
4873
4959
|
geometry = new window.jkEsri.Polyline({
|
|
4874
4960
|
paths: item.paths || item.coordinates || item.rings,
|
|
4875
|
-
spatialReference: item.spatialReference || { wkid: defaultWKID }
|
|
4876
|
-
})
|
|
4961
|
+
spatialReference: item.spatialReference || { wkid: defaultWKID },
|
|
4962
|
+
});
|
|
4877
4963
|
}
|
|
4878
|
-
attributes = { ...item.attributes, ...item }
|
|
4879
|
-
} else if ([
|
|
4880
|
-
const paths = geoJSONToArcGISPaths(item)
|
|
4964
|
+
attributes = { ...item.attributes, ...item };
|
|
4965
|
+
} else if (["LineString", "MultiLineString"].includes(item.type)) {
|
|
4966
|
+
const paths = geoJSONToArcGISPaths(item);
|
|
4881
4967
|
if (paths) {
|
|
4882
4968
|
geometry = new window.jkEsri.Polyline({
|
|
4883
4969
|
paths,
|
|
4884
|
-
spatialReference: { wkid: defaultWKID }
|
|
4885
|
-
})
|
|
4970
|
+
spatialReference: { wkid: defaultWKID },
|
|
4971
|
+
});
|
|
4886
4972
|
}
|
|
4887
|
-
attributes = { ...item.properties, sourceIndex: index }
|
|
4888
|
-
} else if (item.type ===
|
|
4889
|
-
return parseLineToGraphic(
|
|
4973
|
+
attributes = { ...item.properties, sourceIndex: index };
|
|
4974
|
+
} else if (item.type === "Feature") {
|
|
4975
|
+
return parseLineToGraphic(
|
|
4976
|
+
item.geometry || item,
|
|
4977
|
+
defaultWKID,
|
|
4978
|
+
defaultSymbol,
|
|
4979
|
+
index
|
|
4980
|
+
);
|
|
4890
4981
|
}
|
|
4891
4982
|
}
|
|
4892
4983
|
// 情况 4: WKT 字符串
|
|
4893
|
-
if (typeof item ===
|
|
4984
|
+
if (typeof item === "string") {
|
|
4894
4985
|
if (isWKTMultiLineString(item) || isWKTPolyline(item)) {
|
|
4895
|
-
const paths = parseWKTToPaths(item)
|
|
4986
|
+
const paths = parseWKTToPaths(item);
|
|
4896
4987
|
if (paths) {
|
|
4897
4988
|
geometry = new window.jkEsri.Polyline({
|
|
4898
4989
|
paths,
|
|
4899
|
-
spatialReference: { wkid: defaultWKID }
|
|
4900
|
-
})
|
|
4990
|
+
spatialReference: { wkid: defaultWKID },
|
|
4991
|
+
});
|
|
4901
4992
|
}
|
|
4902
4993
|
}
|
|
4903
|
-
attributes = { wkt: item, sourceIndex: index }
|
|
4994
|
+
attributes = { wkt: item, sourceIndex: index };
|
|
4904
4995
|
}
|
|
4905
4996
|
// 情况 5: 纯坐标数组
|
|
4906
4997
|
if (Array.isArray(item)) {
|
|
4907
|
-
const paths = normalizePaths(item)
|
|
4998
|
+
const paths = normalizePaths(item);
|
|
4908
4999
|
if (paths) {
|
|
4909
5000
|
geometry = new window.jkEsri.Polyline({
|
|
4910
5001
|
paths,
|
|
4911
|
-
spatialReference: { wkid: defaultWKID }
|
|
4912
|
-
})
|
|
5002
|
+
spatialReference: { wkid: defaultWKID },
|
|
5003
|
+
});
|
|
4913
5004
|
}
|
|
4914
|
-
attributes = { inputType:
|
|
5005
|
+
attributes = { inputType: "array", sourceIndex: index };
|
|
4915
5006
|
}
|
|
4916
5007
|
|
|
4917
5008
|
if (!geometry) {
|
|
4918
|
-
console.error(`Invalid line data at index ${index}:`, item)
|
|
4919
|
-
return null
|
|
5009
|
+
console.error(`Invalid line data at index ${index}:`, item);
|
|
5010
|
+
return null;
|
|
4920
5011
|
}
|
|
4921
5012
|
|
|
4922
5013
|
// 合并符号配置:优先使用 item 中的 symbol 配置
|
|
4923
|
-
const symbolConfig = { ...defaultSymbol }
|
|
4924
|
-
if (item && typeof item ===
|
|
4925
|
-
if (item.color !== undefined) symbolConfig.color = item.color
|
|
4926
|
-
if (item.width !== undefined) symbolConfig.width = item.width
|
|
4927
|
-
if (item.borderWidth !== undefined) symbolConfig.width = item.borderWidth
|
|
4928
|
-
if (item.opacity !== undefined) symbolConfig.opacity = item.opacity
|
|
5014
|
+
const symbolConfig = { ...defaultSymbol };
|
|
5015
|
+
if (item && typeof item === "object") {
|
|
5016
|
+
if (item.color !== undefined) symbolConfig.color = item.color;
|
|
5017
|
+
if (item.width !== undefined) symbolConfig.width = item.width;
|
|
5018
|
+
if (item.borderWidth !== undefined) symbolConfig.width = item.borderWidth;
|
|
5019
|
+
if (item.opacity !== undefined) symbolConfig.opacity = item.opacity;
|
|
4929
5020
|
}
|
|
4930
5021
|
|
|
4931
|
-
const symbol = getLineSymbol(symbolConfig)
|
|
5022
|
+
const symbol = getLineSymbol(symbolConfig);
|
|
4932
5023
|
|
|
4933
5024
|
return new window.jkEsri.Graphic({
|
|
4934
5025
|
geometry,
|
|
4935
5026
|
symbol,
|
|
4936
|
-
attributes: { ...attributes, sourceIndex: index }
|
|
4937
|
-
})
|
|
5027
|
+
attributes: { ...attributes, sourceIndex: index },
|
|
5028
|
+
});
|
|
4938
5029
|
} catch (e) {
|
|
4939
|
-
console.error(`Failed to parse line item at index ${index}:`, e)
|
|
4940
|
-
return null
|
|
5030
|
+
console.error(`Failed to parse line item at index ${index}:`, e);
|
|
5031
|
+
return null;
|
|
4941
5032
|
}
|
|
4942
5033
|
}
|
|
4943
5034
|
/**
|
|
@@ -4950,50 +5041,54 @@ function parseLineToGraphic(item, defaultWKID, defaultSymbol, index) {
|
|
|
4950
5041
|
* @param {Promise<GraphicsLayer>} [mapLayer] - 地图图层
|
|
4951
5042
|
* @returns {Promise<GraphicsLayer>} 返回 GraphicsLayer 实例
|
|
4952
5043
|
*/
|
|
4953
|
-
async function createLineGraphicsLayer(
|
|
5044
|
+
async function createLineGraphicsLayer(
|
|
5045
|
+
lineDataList = [],
|
|
5046
|
+
options = {},
|
|
5047
|
+
mapLayer = null
|
|
5048
|
+
) {
|
|
4954
5049
|
if (!Array.isArray(lineDataList) || lineDataList.length === 0) {
|
|
4955
|
-
console.error(
|
|
4956
|
-
return null
|
|
5050
|
+
console.error("createLineGraphicsLayer: No line data provided");
|
|
5051
|
+
return null;
|
|
4957
5052
|
}
|
|
4958
5053
|
const {
|
|
4959
5054
|
defaultWKID = 4326,
|
|
4960
|
-
layerId =
|
|
5055
|
+
layerId = "lineGraphicsLayer",
|
|
4961
5056
|
defaultSymbol = {
|
|
4962
|
-
color:
|
|
5057
|
+
color: "#1f77b4",
|
|
4963
5058
|
width: 2,
|
|
4964
|
-
opacity: 100 // 0-100
|
|
4965
|
-
}
|
|
4966
|
-
} = options
|
|
5059
|
+
opacity: 100, // 0-100
|
|
5060
|
+
},
|
|
5061
|
+
} = options;
|
|
4967
5062
|
|
|
4968
5063
|
try {
|
|
4969
|
-
const graphics = []
|
|
5064
|
+
const graphics = [];
|
|
4970
5065
|
for (let i = 0; i < lineDataList.length; i++) {
|
|
4971
|
-
const item = lineDataList[i]
|
|
4972
|
-
const graphic = parseLineToGraphic(item, defaultWKID, defaultSymbol, i)
|
|
5066
|
+
const item = lineDataList[i];
|
|
5067
|
+
const graphic = parseLineToGraphic(item, defaultWKID, defaultSymbol, i);
|
|
4973
5068
|
if (graphic) {
|
|
4974
|
-
graphics.push(graphic)
|
|
5069
|
+
graphics.push(graphic);
|
|
4975
5070
|
}
|
|
4976
5071
|
}
|
|
4977
5072
|
|
|
4978
5073
|
if (graphics.length === 0) {
|
|
4979
|
-
console.error(
|
|
4980
|
-
return null
|
|
5074
|
+
console.error("createLineGraphicsLayer: No valid graphics created");
|
|
5075
|
+
return null;
|
|
4981
5076
|
}
|
|
4982
|
-
let layer = mapLayer
|
|
5077
|
+
let layer = mapLayer;
|
|
4983
5078
|
if (!layer)
|
|
4984
5079
|
layer = new window.jkEsri.GraphicsLayer({
|
|
4985
5080
|
id: layerId,
|
|
4986
|
-
title:
|
|
4987
|
-
})
|
|
5081
|
+
title: "Dynamic Line Graphics Layer",
|
|
5082
|
+
});
|
|
4988
5083
|
|
|
4989
|
-
layer.addMany(graphics)
|
|
5084
|
+
layer.addMany(graphics);
|
|
4990
5085
|
return {
|
|
4991
5086
|
layer,
|
|
4992
|
-
graphics
|
|
4993
|
-
}
|
|
5087
|
+
graphics,
|
|
5088
|
+
};
|
|
4994
5089
|
} catch (error) {
|
|
4995
|
-
console.error(
|
|
4996
|
-
return null
|
|
5090
|
+
console.error("createLineGraphicsLayer failed:", error);
|
|
5091
|
+
return null;
|
|
4997
5092
|
}
|
|
4998
5093
|
}
|
|
4999
5094
|
/**
|
|
@@ -5007,88 +5102,94 @@ async function createLineGraphicsLayer(lineDataList = [], options = {}, mapLayer
|
|
|
5007
5102
|
* @param {any} options.mapLayer - 地图图层
|
|
5008
5103
|
* @returns {any} {layer,graphics}
|
|
5009
5104
|
*/
|
|
5010
|
-
async function createMaskLayer(
|
|
5105
|
+
async function createMaskLayer(
|
|
5106
|
+
polygonDataList = [],
|
|
5107
|
+
options,
|
|
5108
|
+
context = null,
|
|
5109
|
+
mapLayer
|
|
5110
|
+
) {
|
|
5011
5111
|
const {
|
|
5012
|
-
layerId =
|
|
5013
|
-
outerExtent = null // { xmin, ymin, xmax, ymax, spatialReference }
|
|
5014
|
-
} = options || {}
|
|
5112
|
+
layerId = "createMaskLayer",
|
|
5113
|
+
outerExtent = null, // { xmin, ymin, xmax, ymax, spatialReference }
|
|
5114
|
+
} = options || {};
|
|
5015
5115
|
|
|
5016
5116
|
if (!Array.isArray(polygonDataList) || polygonDataList.length === 0) {
|
|
5017
|
-
console.warn(
|
|
5018
|
-
return null
|
|
5117
|
+
console.warn("createMaskLayer: 范围是空的");
|
|
5118
|
+
return null;
|
|
5019
5119
|
}
|
|
5020
5120
|
|
|
5021
|
-
if (typeof window.jkEsri ===
|
|
5022
|
-
console.error(
|
|
5023
|
-
return null
|
|
5121
|
+
if (typeof window.jkEsri === "undefined") {
|
|
5122
|
+
console.error("ArcGIS API for JavaScript is not loaded");
|
|
5123
|
+
return null;
|
|
5024
5124
|
}
|
|
5025
5125
|
|
|
5026
|
-
const { Polygon, SpatialReference, GraphicsLayer, Graphic, geometryEngine } =
|
|
5126
|
+
const { Polygon, SpatialReference, GraphicsLayer, Graphic, geometryEngine } =
|
|
5127
|
+
window.jkEsri;
|
|
5027
5128
|
|
|
5028
5129
|
// ========== 步骤 1:确定空间参考(spatialReference)==========
|
|
5029
|
-
let view = null
|
|
5030
|
-
let spatialReference = null
|
|
5031
|
-
let is3D = false
|
|
5032
|
-
|
|
5033
|
-
if (context && typeof context ===
|
|
5034
|
-
if (context.type ===
|
|
5035
|
-
view = context
|
|
5036
|
-
is3D = context.type ===
|
|
5037
|
-
spatialReference = view.spatialReference
|
|
5130
|
+
let view = null;
|
|
5131
|
+
let spatialReference = null;
|
|
5132
|
+
let is3D = false;
|
|
5133
|
+
|
|
5134
|
+
if (context && typeof context === "object") {
|
|
5135
|
+
if (context.type === "2d" || context.type === "3d") {
|
|
5136
|
+
view = context;
|
|
5137
|
+
is3D = context.type === "3d";
|
|
5138
|
+
spatialReference = view.spatialReference;
|
|
5038
5139
|
if (!spatialReference) {
|
|
5039
|
-
console.error(
|
|
5040
|
-
return null
|
|
5140
|
+
console.error("View spatialReference is not ready");
|
|
5141
|
+
return null;
|
|
5041
5142
|
}
|
|
5042
|
-
} else if (context.declaredClass ===
|
|
5043
|
-
spatialReference = new SpatialReference({ wkid: 4326 })
|
|
5143
|
+
} else if (context.declaredClass === "esri.layers.GraphicsLayer") {
|
|
5144
|
+
spatialReference = new SpatialReference({ wkid: 4326 });
|
|
5044
5145
|
} else {
|
|
5045
|
-
console.warn(
|
|
5046
|
-
spatialReference = new SpatialReference({ wkid: 4326 })
|
|
5146
|
+
console.warn("Unknown context type, assuming WKID 4326");
|
|
5147
|
+
spatialReference = new SpatialReference({ wkid: 4326 });
|
|
5047
5148
|
}
|
|
5048
5149
|
} else {
|
|
5049
|
-
spatialReference = new SpatialReference({ wkid: 4326 })
|
|
5150
|
+
spatialReference = new SpatialReference({ wkid: 4326 });
|
|
5050
5151
|
}
|
|
5051
5152
|
|
|
5052
|
-
const sr = spatialReference
|
|
5053
|
-
const wkid = sr.wkid
|
|
5153
|
+
const sr = spatialReference;
|
|
5154
|
+
const wkid = sr.wkid;
|
|
5054
5155
|
|
|
5055
5156
|
// ========== 辅助函数 ==========
|
|
5056
5157
|
/**
|
|
5057
5158
|
* 提取 rings 数据
|
|
5058
5159
|
*/
|
|
5059
5160
|
function extractRawRings(item, index) {
|
|
5060
|
-
if (!item) return null
|
|
5061
|
-
if (Array.isArray(item)) return item
|
|
5062
|
-
if (item.rings) return item.rings
|
|
5063
|
-
if (item.geometry
|
|
5064
|
-
console.warn(`Item ${index} has no valid rings`)
|
|
5065
|
-
return null
|
|
5161
|
+
if (!item) return null;
|
|
5162
|
+
if (Array.isArray(item)) return item;
|
|
5163
|
+
if (item.rings) return item.rings;
|
|
5164
|
+
if (item.geometry.rings) return item.geometry.rings;
|
|
5165
|
+
console.warn(`Item ${index} has no valid rings`);
|
|
5166
|
+
return null;
|
|
5066
5167
|
}
|
|
5067
5168
|
|
|
5068
5169
|
/**
|
|
5069
5170
|
* 判断环是否为顺时针(CW)
|
|
5070
5171
|
*/
|
|
5071
5172
|
function isRingClockwise(ring) {
|
|
5072
|
-
let sum = 0
|
|
5173
|
+
let sum = 0;
|
|
5073
5174
|
for (let i = 0; i < ring.length; i++) {
|
|
5074
|
-
const [x1, y1] = ring[i]
|
|
5075
|
-
const [x2, y2] = ring[(i + 1) % ring.length]
|
|
5076
|
-
sum += (x2 - x1) * (y2 + y1)
|
|
5175
|
+
const [x1, y1] = ring[i];
|
|
5176
|
+
const [x2, y2] = ring[(i + 1) % ring.length];
|
|
5177
|
+
sum += (x2 - x1) * (y2 + y1);
|
|
5077
5178
|
}
|
|
5078
|
-
return sum > 0 // true = CW
|
|
5179
|
+
return sum > 0; // true = CW
|
|
5079
5180
|
}
|
|
5080
5181
|
|
|
5081
5182
|
/**
|
|
5082
5183
|
* 确保环闭合
|
|
5083
5184
|
*/
|
|
5084
5185
|
function ensureClosed(ring) {
|
|
5085
|
-
if (ring.length < 3) return null
|
|
5086
|
-
const first = ring[0]
|
|
5087
|
-
const last = ring[ring.length - 1]
|
|
5186
|
+
if (ring.length < 3) return null;
|
|
5187
|
+
const first = ring[0];
|
|
5188
|
+
const last = ring[ring.length - 1];
|
|
5088
5189
|
if (first[0] !== last[0] || first[1] !== last[1]) {
|
|
5089
|
-
return [...ring, [first[0], first[1]]]
|
|
5190
|
+
return [...ring, [first[0], first[1]]];
|
|
5090
5191
|
}
|
|
5091
|
-
return ring
|
|
5192
|
+
return ring;
|
|
5092
5193
|
}
|
|
5093
5194
|
|
|
5094
5195
|
// ========== 核心:3D 反遮罩几何裁剪 ==========
|
|
@@ -5102,38 +5203,38 @@ async function createMaskLayer(polygonDataList = [], options, context = null, ma
|
|
|
5102
5203
|
function compute3DDifference(outerRing, holes, sr) {
|
|
5103
5204
|
const outerPoly = new Polygon({
|
|
5104
5205
|
rings: [outerRing],
|
|
5105
|
-
spatialReference: sr
|
|
5106
|
-
})
|
|
5206
|
+
spatialReference: sr,
|
|
5207
|
+
});
|
|
5107
5208
|
|
|
5108
|
-
if (holes.length === 0) return outerPoly
|
|
5209
|
+
if (holes.length === 0) return outerPoly;
|
|
5109
5210
|
|
|
5110
5211
|
// 合并所有 holes
|
|
5111
|
-
let unionHole = null
|
|
5212
|
+
let unionHole = null;
|
|
5112
5213
|
for (const hole of holes) {
|
|
5113
5214
|
const holePoly = new Polygon({
|
|
5114
5215
|
rings: [hole],
|
|
5115
|
-
spatialReference: sr
|
|
5116
|
-
})
|
|
5216
|
+
spatialReference: sr,
|
|
5217
|
+
});
|
|
5117
5218
|
if (!unionHole) {
|
|
5118
|
-
unionHole = holePoly
|
|
5219
|
+
unionHole = holePoly;
|
|
5119
5220
|
} else {
|
|
5120
5221
|
try {
|
|
5121
|
-
unionHole = geometryEngine.union(unionHole, holePoly)
|
|
5222
|
+
unionHole = geometryEngine.union(unionHole, holePoly);
|
|
5122
5223
|
} catch (e) {
|
|
5123
|
-
console.warn(
|
|
5224
|
+
console.warn("Union hole failed, skipping:", e);
|
|
5124
5225
|
}
|
|
5125
5226
|
}
|
|
5126
5227
|
}
|
|
5127
5228
|
|
|
5128
|
-
if (!unionHole) return outerPoly
|
|
5229
|
+
if (!unionHole) return outerPoly;
|
|
5129
5230
|
|
|
5130
5231
|
// 执行差集
|
|
5131
5232
|
try {
|
|
5132
|
-
const result = geometryEngine.difference(outerPoly, unionHole)
|
|
5133
|
-
return result || outerPoly
|
|
5233
|
+
const result = geometryEngine.difference(outerPoly, unionHole);
|
|
5234
|
+
return result || outerPoly;
|
|
5134
5235
|
} catch (e) {
|
|
5135
|
-
console.error(
|
|
5136
|
-
return outerPoly
|
|
5236
|
+
console.error("Geometry difference failed:", e);
|
|
5237
|
+
return outerPoly;
|
|
5137
5238
|
}
|
|
5138
5239
|
}
|
|
5139
5240
|
|
|
@@ -5141,15 +5242,15 @@ async function createMaskLayer(polygonDataList = [], options, context = null, ma
|
|
|
5141
5242
|
try {
|
|
5142
5243
|
// ========== 反遮罩模式 ==========
|
|
5143
5244
|
// 构建 outerRing
|
|
5144
|
-
let outerRing
|
|
5145
|
-
if (outerExtent && outerExtent.spatialReference
|
|
5245
|
+
let outerRing;
|
|
5246
|
+
if (outerExtent && outerExtent.spatialReference.wkid === wkid) {
|
|
5146
5247
|
outerRing = [
|
|
5147
5248
|
[outerExtent.xmin, outerExtent.ymin],
|
|
5148
5249
|
[outerExtent.xmax, outerExtent.ymin],
|
|
5149
5250
|
[outerExtent.xmax, outerExtent.ymax],
|
|
5150
5251
|
[outerExtent.xmin, outerExtent.ymax],
|
|
5151
|
-
[outerExtent.xmin, outerExtent.ymin]
|
|
5152
|
-
]
|
|
5252
|
+
[outerExtent.xmin, outerExtent.ymin],
|
|
5253
|
+
];
|
|
5153
5254
|
} else {
|
|
5154
5255
|
if (wkid === 4326) {
|
|
5155
5256
|
outerRing = [
|
|
@@ -5157,17 +5258,17 @@ async function createMaskLayer(polygonDataList = [], options, context = null, ma
|
|
|
5157
5258
|
[180, -90],
|
|
5158
5259
|
[180, 90],
|
|
5159
5260
|
[-180, 90],
|
|
5160
|
-
[-180, -90]
|
|
5161
|
-
]
|
|
5261
|
+
[-180, -90],
|
|
5262
|
+
];
|
|
5162
5263
|
} else if (wkid === 3857) {
|
|
5163
|
-
const halfWorld = 20037508.342789244
|
|
5264
|
+
const halfWorld = 20037508.342789244;
|
|
5164
5265
|
outerRing = [
|
|
5165
5266
|
[-halfWorld, -halfWorld],
|
|
5166
5267
|
[halfWorld, -halfWorld],
|
|
5167
5268
|
[halfWorld, halfWorld],
|
|
5168
5269
|
[-halfWorld, halfWorld],
|
|
5169
|
-
[-halfWorld, -halfWorld]
|
|
5170
|
-
]
|
|
5270
|
+
[-halfWorld, -halfWorld],
|
|
5271
|
+
];
|
|
5171
5272
|
} else {
|
|
5172
5273
|
// 默认中国范围(WKID 4490 近似)
|
|
5173
5274
|
outerRing = [
|
|
@@ -5175,75 +5276,76 @@ async function createMaskLayer(polygonDataList = [], options, context = null, ma
|
|
|
5175
5276
|
[121.0131, 19.9696],
|
|
5176
5277
|
[121.0131, 26.933],
|
|
5177
5278
|
[105.0019, 26.933],
|
|
5178
|
-
[105.0019, 19.9696]
|
|
5179
|
-
]
|
|
5279
|
+
[105.0019, 19.9696],
|
|
5280
|
+
];
|
|
5180
5281
|
}
|
|
5181
5282
|
}
|
|
5182
5283
|
|
|
5183
5284
|
// 提取 holes(支持多个环)
|
|
5184
|
-
const holes = []
|
|
5285
|
+
const holes = [];
|
|
5185
5286
|
for (let i = 0; i < polygonDataList.length; i++) {
|
|
5186
|
-
const item = polygonDataList[i]
|
|
5187
|
-
const rawRings = extractRawRings(item, i)
|
|
5188
|
-
if (!rawRings || !Array.isArray(rawRings[0]) || rawRings[0].length < 3)
|
|
5287
|
+
const item = polygonDataList[i];
|
|
5288
|
+
const rawRings = extractRawRings(item, i);
|
|
5289
|
+
if (!rawRings || !Array.isArray(rawRings[0]) || rawRings[0].length < 3)
|
|
5290
|
+
continue;
|
|
5189
5291
|
|
|
5190
5292
|
rawRings.forEach((ring, idx) => {
|
|
5191
|
-
idx
|
|
5192
|
-
ring = ensureClosed(ring)
|
|
5193
|
-
if (!ring) return
|
|
5293
|
+
idx;
|
|
5294
|
+
ring = ensureClosed(ring);
|
|
5295
|
+
if (!ring) return;
|
|
5194
5296
|
|
|
5195
5297
|
// 2D 要求 hole 为 CW;3D 不关心(后续会裁剪)
|
|
5196
5298
|
if (!is3D && !isRingClockwise(ring)) {
|
|
5197
|
-
ring = ring.slice().reverse()
|
|
5299
|
+
ring = ring.slice().reverse();
|
|
5198
5300
|
}
|
|
5199
5301
|
|
|
5200
|
-
holes.push(ring)
|
|
5201
|
-
})
|
|
5302
|
+
holes.push(ring);
|
|
5303
|
+
});
|
|
5202
5304
|
}
|
|
5203
5305
|
|
|
5204
|
-
let finalGeometry
|
|
5306
|
+
let finalGeometry;
|
|
5205
5307
|
|
|
5206
5308
|
if (is3D) {
|
|
5207
5309
|
// ✅ 3D:使用 geometryEngine 裁剪
|
|
5208
|
-
finalGeometry = await compute3DDifference(outerRing, holes, sr)
|
|
5310
|
+
finalGeometry = await compute3DDifference(outerRing, holes, sr);
|
|
5209
5311
|
} else {
|
|
5210
5312
|
// ✅ 2D:使用多环 Polygon(holes 必须 CW)
|
|
5211
5313
|
if (holes.length === 0) {
|
|
5212
5314
|
finalGeometry = new Polygon({
|
|
5213
5315
|
rings: [outerRing],
|
|
5214
|
-
spatialReference: sr
|
|
5215
|
-
})
|
|
5316
|
+
spatialReference: sr,
|
|
5317
|
+
});
|
|
5216
5318
|
} else {
|
|
5217
5319
|
finalGeometry = new Polygon({
|
|
5218
5320
|
rings: [outerRing, ...holes],
|
|
5219
|
-
spatialReference: sr
|
|
5220
|
-
})
|
|
5321
|
+
spatialReference: sr,
|
|
5322
|
+
});
|
|
5221
5323
|
}
|
|
5222
5324
|
}
|
|
5223
5325
|
|
|
5224
5326
|
const maskSymbol = {
|
|
5225
|
-
type:
|
|
5327
|
+
type: "simple-fill",
|
|
5226
5328
|
color: [0, 0, 0, 0.8],
|
|
5227
|
-
outline: null
|
|
5228
|
-
}
|
|
5329
|
+
outline: null,
|
|
5330
|
+
};
|
|
5229
5331
|
const maskGraphic = new Graphic({
|
|
5230
5332
|
geometry: finalGeometry,
|
|
5231
|
-
symbol: maskSymbol
|
|
5232
|
-
})
|
|
5333
|
+
symbol: maskSymbol,
|
|
5334
|
+
});
|
|
5233
5335
|
|
|
5234
|
-
let layer = mapLayer
|
|
5336
|
+
let layer = mapLayer;
|
|
5235
5337
|
if (!layer) {
|
|
5236
|
-
layer = new GraphicsLayer({ id: layerId })
|
|
5237
|
-
if (view) view.map.add(layer)
|
|
5338
|
+
layer = new GraphicsLayer({ id: layerId });
|
|
5339
|
+
if (view) view.map.add(layer);
|
|
5238
5340
|
} else {
|
|
5239
|
-
layer.removeAll()
|
|
5341
|
+
layer.removeAll();
|
|
5240
5342
|
}
|
|
5241
|
-
layer.add(maskGraphic)
|
|
5343
|
+
layer.add(maskGraphic);
|
|
5242
5344
|
|
|
5243
|
-
return { layer, graphics: [maskGraphic] }
|
|
5345
|
+
return { layer, graphics: [maskGraphic] };
|
|
5244
5346
|
} catch (error) {
|
|
5245
|
-
console.error(
|
|
5246
|
-
return null
|
|
5347
|
+
console.error("createMaskLayer failed:", error);
|
|
5348
|
+
return null;
|
|
5247
5349
|
}
|
|
5248
5350
|
}
|
|
5249
5351
|
/**
|
|
@@ -5266,134 +5368,135 @@ async function createPolygonGraphicsLayer(
|
|
|
5266
5368
|
mapLayer
|
|
5267
5369
|
) {
|
|
5268
5370
|
const {
|
|
5269
|
-
layerId =
|
|
5371
|
+
layerId = "polygonGraphicsLayer",
|
|
5270
5372
|
defaultSymbol = {
|
|
5271
5373
|
color: [255, 255, 255, 0.1],
|
|
5272
|
-
outline: { color:
|
|
5374
|
+
outline: { color: "#0070ff", width: 1 },
|
|
5273
5375
|
},
|
|
5274
|
-
enableHoles = true
|
|
5275
|
-
} = options
|
|
5376
|
+
enableHoles = true,
|
|
5377
|
+
} = options;
|
|
5276
5378
|
if (!Array.isArray(polygonDataList) || polygonDataList.length === 0) {
|
|
5277
|
-
console.warn(
|
|
5278
|
-
return null
|
|
5379
|
+
console.warn("createPolygonGraphicsLayer: 范围是空的");
|
|
5380
|
+
return null;
|
|
5279
5381
|
}
|
|
5280
5382
|
|
|
5281
|
-
if (typeof window.jkEsri ===
|
|
5282
|
-
console.error(
|
|
5283
|
-
return null
|
|
5383
|
+
if (typeof window.jkEsri === "undefined") {
|
|
5384
|
+
console.error("ArcGIS API for JavaScript is not loaded");
|
|
5385
|
+
return null;
|
|
5284
5386
|
}
|
|
5285
5387
|
|
|
5286
|
-
const { Polygon, SpatialReference, GraphicsLayer, Graphic } = window.jkEsri
|
|
5388
|
+
const { Polygon, SpatialReference, GraphicsLayer, Graphic } = window.jkEsri;
|
|
5287
5389
|
// ========== 步骤 1:确定空间参考(spatialReference)==========
|
|
5288
|
-
let view = null
|
|
5289
|
-
let spatialReference = null
|
|
5390
|
+
let view = null;
|
|
5391
|
+
let spatialReference = null;
|
|
5290
5392
|
|
|
5291
|
-
if (context && typeof context ===
|
|
5292
|
-
if (context.type ===
|
|
5293
|
-
view = context
|
|
5294
|
-
spatialReference = view.spatialReference
|
|
5393
|
+
if (context && typeof context === "object") {
|
|
5394
|
+
if (context.type === "2d" || context.type === "3d") {
|
|
5395
|
+
view = context;
|
|
5396
|
+
spatialReference = view.spatialReference;
|
|
5295
5397
|
if (!spatialReference) {
|
|
5296
|
-
console.error(
|
|
5297
|
-
return null
|
|
5398
|
+
console.error("View spatialReference is not ready");
|
|
5399
|
+
return null;
|
|
5298
5400
|
}
|
|
5299
|
-
} else if (context.declaredClass ===
|
|
5300
|
-
spatialReference = new SpatialReference({ wkid: 4326 })
|
|
5401
|
+
} else if (context.declaredClass === "esri.layers.GraphicsLayer") {
|
|
5402
|
+
spatialReference = new SpatialReference({ wkid: 4326 });
|
|
5301
5403
|
} else {
|
|
5302
|
-
console.warn(
|
|
5303
|
-
spatialReference = new SpatialReference({ wkid: 4326 })
|
|
5404
|
+
console.warn("Unknown context type, assuming WKID 4326");
|
|
5405
|
+
spatialReference = new SpatialReference({ wkid: 4326 });
|
|
5304
5406
|
}
|
|
5305
5407
|
} else {
|
|
5306
|
-
spatialReference = new SpatialReference({ wkid: 4326 })
|
|
5408
|
+
spatialReference = new SpatialReference({ wkid: 4326 });
|
|
5307
5409
|
}
|
|
5308
5410
|
|
|
5309
|
-
const sr = spatialReference
|
|
5411
|
+
const sr = spatialReference;
|
|
5310
5412
|
|
|
5311
5413
|
// ========== 辅助函数 ==========
|
|
5312
5414
|
/**
|
|
5313
5415
|
* 提取 rings 数据
|
|
5314
5416
|
*/
|
|
5315
5417
|
function extractRawRings(item, index) {
|
|
5316
|
-
if (!item) return null
|
|
5317
|
-
if (Array.isArray(item)) return item
|
|
5318
|
-
if (item.rings) return item.rings
|
|
5319
|
-
if (item.geometry
|
|
5320
|
-
console.warn(`Item ${index} has no valid rings`)
|
|
5321
|
-
return null
|
|
5418
|
+
if (!item) return null;
|
|
5419
|
+
if (Array.isArray(item)) return item;
|
|
5420
|
+
if (item.rings) return item.rings;
|
|
5421
|
+
if (item.geometry.rings) return item.geometry.rings;
|
|
5422
|
+
console.warn(`Item ${index} has no valid rings`);
|
|
5423
|
+
return null;
|
|
5322
5424
|
}
|
|
5323
5425
|
|
|
5324
5426
|
/**
|
|
5325
5427
|
* 确保环闭合
|
|
5326
5428
|
*/
|
|
5327
5429
|
function ensureClosed(ring) {
|
|
5328
|
-
if (ring.length < 3) return null
|
|
5329
|
-
const first = ring[0]
|
|
5330
|
-
const last = ring[ring.length - 1]
|
|
5430
|
+
if (ring.length < 3) return null;
|
|
5431
|
+
const first = ring[0];
|
|
5432
|
+
const last = ring[ring.length - 1];
|
|
5331
5433
|
if (first[0] !== last[0] || first[1] !== last[1]) {
|
|
5332
|
-
return [...ring, [first[0], first[1]]]
|
|
5434
|
+
return [...ring, [first[0], first[1]]];
|
|
5333
5435
|
}
|
|
5334
|
-
return ring
|
|
5436
|
+
return ring;
|
|
5335
5437
|
}
|
|
5336
5438
|
// ========== 主逻辑 ==========
|
|
5337
5439
|
try {
|
|
5338
5440
|
// ========== 正向显示模式(2D/3D 通用)==========
|
|
5339
|
-
const graphics = []
|
|
5441
|
+
const graphics = [];
|
|
5340
5442
|
for (let i = 0; i < polygonDataList.length; i++) {
|
|
5341
|
-
const item = polygonDataList[i]
|
|
5342
|
-
const rawRings = extractRawRings(item, i)
|
|
5343
|
-
if (!rawRings) continue
|
|
5344
|
-
const symbolConfig = { ...defaultSymbol }
|
|
5345
|
-
if (item && typeof item ===
|
|
5346
|
-
if (Array.isArray(item.color)) symbolConfig.color = item.color
|
|
5347
|
-
if (typeof item.opacity ===
|
|
5348
|
-
const alpha = Math.min(1, Math.max(0, item.opacity))
|
|
5443
|
+
const item = polygonDataList[i];
|
|
5444
|
+
const rawRings = extractRawRings(item, i);
|
|
5445
|
+
if (!rawRings) continue;
|
|
5446
|
+
const symbolConfig = { ...defaultSymbol };
|
|
5447
|
+
if (item && typeof item === "object") {
|
|
5448
|
+
if (Array.isArray(item.color)) symbolConfig.color = item.color;
|
|
5449
|
+
if (typeof item.opacity === "number") {
|
|
5450
|
+
const alpha = Math.min(1, Math.max(0, item.opacity));
|
|
5349
5451
|
const baseColor = Array.isArray(symbolConfig.color)
|
|
5350
5452
|
? symbolConfig.color.slice(0, 3)
|
|
5351
|
-
: [255, 255, 255]
|
|
5352
|
-
symbolConfig.color = [...baseColor, alpha]
|
|
5453
|
+
: [255, 255, 255];
|
|
5454
|
+
symbolConfig.color = [...baseColor, alpha];
|
|
5353
5455
|
}
|
|
5354
|
-
if (item.outlineColor) symbolConfig.outline.color = item.outlineColor
|
|
5355
|
-
if (typeof item.outlineWidth ===
|
|
5456
|
+
if (item.outlineColor) symbolConfig.outline.color = item.outlineColor;
|
|
5457
|
+
if (typeof item.outlineWidth === "number")
|
|
5458
|
+
symbolConfig.outline.width = item.outlineWidth;
|
|
5356
5459
|
}
|
|
5357
5460
|
const symbol = {
|
|
5358
|
-
type:
|
|
5461
|
+
type: "simple-fill",
|
|
5359
5462
|
color: symbolConfig.color,
|
|
5360
|
-
outline: symbolConfig.outline
|
|
5361
|
-
}
|
|
5362
|
-
const attributes = { ...(item || {}), sourceIndex: i }
|
|
5463
|
+
outline: symbolConfig.outline,
|
|
5464
|
+
};
|
|
5465
|
+
const attributes = { ...(item || {}), sourceIndex: i };
|
|
5363
5466
|
if (enableHoles) {
|
|
5364
5467
|
const poly = new Polygon({
|
|
5365
5468
|
rings: rawRings,
|
|
5366
|
-
spatialReference: sr
|
|
5367
|
-
})
|
|
5368
|
-
graphics.push(new Graphic({ geometry: poly, symbol, attributes }))
|
|
5469
|
+
spatialReference: sr,
|
|
5470
|
+
});
|
|
5471
|
+
graphics.push(new Graphic({ geometry: poly, symbol, attributes }));
|
|
5369
5472
|
} else {
|
|
5370
|
-
const outerRing = ensureClosed(rawRings[0])
|
|
5473
|
+
const outerRing = ensureClosed(rawRings[0]);
|
|
5371
5474
|
if (outerRing) {
|
|
5372
5475
|
const poly = new Polygon({
|
|
5373
5476
|
rings: [outerRing],
|
|
5374
|
-
spatialReference: sr
|
|
5375
|
-
})
|
|
5376
|
-
graphics.push(new Graphic({ geometry: poly, symbol, attributes }))
|
|
5477
|
+
spatialReference: sr,
|
|
5478
|
+
});
|
|
5479
|
+
graphics.push(new Graphic({ geometry: poly, symbol, attributes }));
|
|
5377
5480
|
}
|
|
5378
5481
|
}
|
|
5379
5482
|
}
|
|
5380
5483
|
|
|
5381
5484
|
if (graphics.length === 0) {
|
|
5382
|
-
console.warn(
|
|
5383
|
-
return null
|
|
5485
|
+
console.warn("No valid graphics created");
|
|
5486
|
+
return null;
|
|
5384
5487
|
}
|
|
5385
|
-
let layer = mapLayer
|
|
5488
|
+
let layer = mapLayer;
|
|
5386
5489
|
if (!layer) {
|
|
5387
|
-
layer = new GraphicsLayer({ id: layerId, title:
|
|
5388
|
-
if (view) view.map.add(layer)
|
|
5490
|
+
layer = new GraphicsLayer({ id: layerId, title: "Polygon Layer" });
|
|
5491
|
+
if (view) view.map.add(layer);
|
|
5389
5492
|
} else {
|
|
5390
|
-
layer.removeAll()
|
|
5493
|
+
layer.removeAll();
|
|
5391
5494
|
}
|
|
5392
|
-
layer.addMany(graphics)
|
|
5393
|
-
return { layer, graphics }
|
|
5495
|
+
layer.addMany(graphics);
|
|
5496
|
+
return { layer, graphics };
|
|
5394
5497
|
} catch (error) {
|
|
5395
|
-
console.error(
|
|
5396
|
-
return null
|
|
5498
|
+
console.error("createPolygonGraphicsLayer failed:", error);
|
|
5499
|
+
return null;
|
|
5397
5500
|
}
|
|
5398
5501
|
}
|
|
5399
5502
|
|
|
@@ -12266,181 +12369,192 @@ var arcgisMap = null,
|
|
|
12266
12369
|
currentAbortController,
|
|
12267
12370
|
isClickLocked = false,
|
|
12268
12371
|
mapLocationMixin_pointLayer = null,
|
|
12269
|
-
searchViewModel = null
|
|
12372
|
+
searchViewModel = null;
|
|
12270
12373
|
let markerData = {
|
|
12271
12374
|
url: ico_location_namespaceObject,
|
|
12272
12375
|
width: 20,
|
|
12273
|
-
height: 18
|
|
12274
|
-
}
|
|
12376
|
+
height: 18,
|
|
12377
|
+
};
|
|
12275
12378
|
const mapLocationMixin = {
|
|
12276
12379
|
components: { loadingBox: loading, searchMap: search_map, svgIcon: svgIcon },
|
|
12277
12380
|
props: {
|
|
12278
12381
|
mapParams: {
|
|
12279
12382
|
type: Object,
|
|
12280
|
-
default: map_config
|
|
12383
|
+
default: map_config,
|
|
12281
12384
|
},
|
|
12282
12385
|
defaultCenter: {
|
|
12283
12386
|
type: Array,
|
|
12284
12387
|
default: () => {
|
|
12285
|
-
return []
|
|
12286
|
-
}
|
|
12388
|
+
return [];
|
|
12389
|
+
},
|
|
12287
12390
|
},
|
|
12288
12391
|
isSearch: {
|
|
12289
12392
|
type: Boolean,
|
|
12290
|
-
default: true
|
|
12393
|
+
default: true,
|
|
12291
12394
|
},
|
|
12292
12395
|
disabled: {
|
|
12293
12396
|
type: Boolean,
|
|
12294
|
-
default: false
|
|
12295
|
-
}
|
|
12397
|
+
default: false,
|
|
12398
|
+
},
|
|
12296
12399
|
},
|
|
12297
12400
|
computed: {
|
|
12298
12401
|
isShowPoint() {
|
|
12299
|
-
return !this.disabled && this.isSearch
|
|
12402
|
+
return !this.disabled && this.isSearch;
|
|
12300
12403
|
},
|
|
12301
|
-
mapCenter() {}
|
|
12404
|
+
mapCenter() {},
|
|
12302
12405
|
},
|
|
12303
12406
|
data() {
|
|
12304
12407
|
return {
|
|
12305
|
-
mapId:
|
|
12408
|
+
mapId: "map" + Math.round(Math.random() * 10000),
|
|
12306
12409
|
isLoading: true, //地图加载loading
|
|
12307
12410
|
center: [],
|
|
12308
|
-
address:
|
|
12411
|
+
address: "",
|
|
12309
12412
|
pointCenter: [113.536308532987, 23.3450945634734],
|
|
12310
12413
|
pointData: {
|
|
12311
|
-
longitude:
|
|
12312
|
-
latitude:
|
|
12313
|
-
address:
|
|
12314
|
-
}
|
|
12315
|
-
}
|
|
12414
|
+
longitude: "",
|
|
12415
|
+
latitude: "",
|
|
12416
|
+
address: "",
|
|
12417
|
+
},
|
|
12418
|
+
};
|
|
12316
12419
|
},
|
|
12317
12420
|
methods: {
|
|
12318
12421
|
/**
|
|
12319
12422
|
* 返回地图容器
|
|
12320
12423
|
*/
|
|
12321
12424
|
getMap() {
|
|
12322
|
-
return arcgisMap
|
|
12425
|
+
return arcgisMap;
|
|
12323
12426
|
},
|
|
12324
12427
|
/**
|
|
12325
12428
|
* 返回地图容器
|
|
12326
12429
|
*/
|
|
12327
12430
|
getView() {
|
|
12328
|
-
return arcgisView
|
|
12431
|
+
return arcgisView;
|
|
12329
12432
|
},
|
|
12330
12433
|
setupMapEvents(view) {
|
|
12331
12434
|
// 点击
|
|
12332
|
-
this._clickHandler = view.on(
|
|
12435
|
+
this._clickHandler = view.on(
|
|
12436
|
+
"click",
|
|
12437
|
+
this.debounce(this.handleMapClick, 300)
|
|
12438
|
+
);
|
|
12333
12439
|
// 悬浮
|
|
12334
|
-
this._hoverHandler = view.on(
|
|
12440
|
+
this._hoverHandler = view.on(
|
|
12441
|
+
"pointer-move",
|
|
12442
|
+
this.debounce(this.handleMapHover, 80)
|
|
12443
|
+
);
|
|
12335
12444
|
},
|
|
12336
12445
|
|
|
12337
12446
|
handleMapClick(e) {
|
|
12338
12447
|
// 处理点击逻辑
|
|
12339
|
-
if (isClickLocked) return
|
|
12448
|
+
if (isClickLocked) return;
|
|
12340
12449
|
// 取消上一次未完成的 hitTest
|
|
12341
12450
|
if (currentAbortController) {
|
|
12342
|
-
currentAbortController.abort()
|
|
12451
|
+
currentAbortController.abort();
|
|
12343
12452
|
}
|
|
12344
|
-
currentAbortController = new AbortController()
|
|
12345
|
-
isClickLocked = true
|
|
12453
|
+
currentAbortController = new AbortController();
|
|
12454
|
+
isClickLocked = true;
|
|
12346
12455
|
const eventData = {
|
|
12347
12456
|
mapPoint: e.mapPoint,
|
|
12348
|
-
type:
|
|
12349
|
-
}
|
|
12350
|
-
const hitTestPromise = arcgisView.hitTest(e) // 注意:ArcGIS hitTest 不支持 signal,此为未来兼容
|
|
12457
|
+
type: "click",
|
|
12458
|
+
};
|
|
12459
|
+
const hitTestPromise = arcgisView.hitTest(e); // 注意:ArcGIS hitTest 不支持 signal,此为未来兼容
|
|
12351
12460
|
hitTestPromise
|
|
12352
12461
|
.then((hitResult) => {
|
|
12353
|
-
if (currentAbortController.signal.aborted) return // 已取消
|
|
12354
|
-
eventData.event = hitResult
|
|
12462
|
+
if (currentAbortController.signal.aborted) return; // 已取消
|
|
12463
|
+
eventData.event = hitResult;
|
|
12355
12464
|
if (this.isShowPoint && searchViewModel) {
|
|
12356
|
-
let point = e.mapPoint
|
|
12465
|
+
let point = e.mapPoint;
|
|
12357
12466
|
if (point) {
|
|
12358
|
-
this.pointData.longitude = point.x
|
|
12359
|
-
this.pointData.latitude = point.y
|
|
12360
|
-
mapLocationMixin_pointLayer.graphics._items[0].geometry.longitude = point.x
|
|
12361
|
-
mapLocationMixin_pointLayer.graphics._items[0].geometry.latitude = point.y
|
|
12362
|
-
this.pointData.address =
|
|
12363
|
-
searchViewModel.update(mapLocationMixin_pointLayer.graphics._items[0])
|
|
12467
|
+
this.pointData.longitude = point.x;
|
|
12468
|
+
this.pointData.latitude = point.y;
|
|
12469
|
+
mapLocationMixin_pointLayer.graphics._items[0].geometry.longitude = point.x;
|
|
12470
|
+
mapLocationMixin_pointLayer.graphics._items[0].geometry.latitude = point.y;
|
|
12471
|
+
this.pointData.address = "";
|
|
12472
|
+
searchViewModel.update(mapLocationMixin_pointLayer.graphics._items[0]);
|
|
12364
12473
|
}
|
|
12365
12474
|
}
|
|
12366
|
-
this.$emit(
|
|
12475
|
+
this.$emit("mapEventClick", eventData);
|
|
12367
12476
|
})
|
|
12368
12477
|
.catch((err) => {
|
|
12369
|
-
if (err.name ===
|
|
12370
|
-
console.warn(
|
|
12478
|
+
if (err.name === "AbortError") return;
|
|
12479
|
+
console.warn("hitTest error", err);
|
|
12371
12480
|
})
|
|
12372
12481
|
.finally(() => {
|
|
12373
12482
|
setTimeout(() => {
|
|
12374
|
-
isClickLocked = false
|
|
12375
|
-
currentAbortController = null
|
|
12376
|
-
}, 300)
|
|
12377
|
-
})
|
|
12483
|
+
isClickLocked = false;
|
|
12484
|
+
currentAbortController = null;
|
|
12485
|
+
}, 300);
|
|
12486
|
+
});
|
|
12378
12487
|
},
|
|
12379
12488
|
|
|
12380
12489
|
async handleMapHover(event) {
|
|
12381
12490
|
// 处理 hover 逻辑
|
|
12382
|
-
const hitData = await arcgisView.hitTest(event)
|
|
12491
|
+
const hitData = await arcgisView.hitTest(event);
|
|
12383
12492
|
if (hitData && hitData.results && hitData.screenPoint) {
|
|
12384
|
-
arcgisView.container.style.cursor =
|
|
12493
|
+
arcgisView.container.style.cursor = "pointer";
|
|
12385
12494
|
|
|
12386
|
-
this.$emit(
|
|
12387
|
-
} else arcgisView.container.style.cursor =
|
|
12495
|
+
this.$emit("mapEventMouse", hitData);
|
|
12496
|
+
} else arcgisView.container.style.cursor = "default";
|
|
12388
12497
|
},
|
|
12389
12498
|
|
|
12390
12499
|
debounce(fn, delay) {
|
|
12391
|
-
let timer
|
|
12500
|
+
let timer;
|
|
12392
12501
|
return (...args) => {
|
|
12393
|
-
clearTimeout(timer)
|
|
12394
|
-
timer = setTimeout(() => fn.apply(this, args), delay)
|
|
12395
|
-
}
|
|
12502
|
+
clearTimeout(timer);
|
|
12503
|
+
timer = setTimeout(() => fn.apply(this, args), delay);
|
|
12504
|
+
};
|
|
12396
12505
|
},
|
|
12397
12506
|
|
|
12398
12507
|
cleanupMapEvents() {
|
|
12399
|
-
this._clickHandler
|
|
12400
|
-
this._hoverHandler
|
|
12508
|
+
this._clickHandler.remove();
|
|
12509
|
+
this._hoverHandler.remove();
|
|
12401
12510
|
},
|
|
12402
12511
|
/**
|
|
12403
12512
|
* 地图加载完成
|
|
12404
12513
|
*/
|
|
12405
12514
|
loadEdMap(data) {
|
|
12406
|
-
arcgisMap = data.map
|
|
12407
|
-
arcgisView = data.view
|
|
12408
|
-
initMapPack(data)
|
|
12409
|
-
mapLocationMixin_pointLayer = new window.jkEsri.GraphicsLayer({ id:
|
|
12410
|
-
arcgisMap.add(mapLocationMixin_pointLayer, 10)
|
|
12515
|
+
arcgisMap = data.map;
|
|
12516
|
+
arcgisView = data.view;
|
|
12517
|
+
initMapPack(data);
|
|
12518
|
+
mapLocationMixin_pointLayer = new window.jkEsri.GraphicsLayer({ id: "pointLayer" });
|
|
12519
|
+
arcgisMap.add(mapLocationMixin_pointLayer, 10);
|
|
12411
12520
|
if (this.isShowPoint) {
|
|
12412
|
-
this.setSearchVm()
|
|
12521
|
+
this.setSearchVm();
|
|
12413
12522
|
} else {
|
|
12414
|
-
this.moveCenterPoint()
|
|
12523
|
+
this.moveCenterPoint();
|
|
12415
12524
|
}
|
|
12416
|
-
this.setupMapEvents(data.view)
|
|
12525
|
+
this.setupMapEvents(data.view);
|
|
12417
12526
|
if (this.center && this.center.length == 2) {
|
|
12418
12527
|
(0,utils_namespaceObject.goToPoint)({
|
|
12419
12528
|
longitude: this.center[0],
|
|
12420
|
-
latitude: this.center[1]
|
|
12421
|
-
})
|
|
12529
|
+
latitude: this.center[1],
|
|
12530
|
+
});
|
|
12422
12531
|
}
|
|
12423
|
-
this.$emit(
|
|
12532
|
+
this.$emit("loadEdMap", data);
|
|
12424
12533
|
},
|
|
12425
12534
|
moveCenterPoint() {
|
|
12426
|
-
if (
|
|
12535
|
+
if (
|
|
12536
|
+
this.center &&
|
|
12537
|
+
this.center.length == 2 &&
|
|
12538
|
+
this.center[0] &&
|
|
12539
|
+
this.center[1]
|
|
12540
|
+
) {
|
|
12427
12541
|
this.refreshPoint({
|
|
12428
12542
|
longitude: this.center[0],
|
|
12429
|
-
latitude: this.center[1]
|
|
12430
|
-
})
|
|
12543
|
+
latitude: this.center[1],
|
|
12544
|
+
});
|
|
12431
12545
|
} else if (this.address) {
|
|
12432
12546
|
getGeocoderAddress(this.address)
|
|
12433
12547
|
.then((resData) => {
|
|
12434
12548
|
if (resData && resData.lon && resData.lat) {
|
|
12435
12549
|
this.refreshPoint({
|
|
12436
|
-
longitude: resData.lon ||
|
|
12437
|
-
latitude: resData.lat
|
|
12438
|
-
})
|
|
12550
|
+
longitude: resData.lon || "",
|
|
12551
|
+
latitude: resData.lat,
|
|
12552
|
+
});
|
|
12439
12553
|
}
|
|
12440
12554
|
})
|
|
12441
12555
|
.catch((err) => {
|
|
12442
|
-
console.log(
|
|
12443
|
-
})
|
|
12556
|
+
console.log("err", err);
|
|
12557
|
+
});
|
|
12444
12558
|
} else if (
|
|
12445
12559
|
this.defaultCenter &&
|
|
12446
12560
|
this.defaultCenter.length == 2 &&
|
|
@@ -12449,13 +12563,13 @@ const mapLocationMixin = {
|
|
|
12449
12563
|
) {
|
|
12450
12564
|
this.refreshPoint({
|
|
12451
12565
|
longitude: this.defaultCenter[0],
|
|
12452
|
-
latitude: this.defaultCenter[1]
|
|
12453
|
-
})
|
|
12566
|
+
latitude: this.defaultCenter[1],
|
|
12567
|
+
});
|
|
12454
12568
|
} else
|
|
12455
12569
|
this.refreshPoint({
|
|
12456
12570
|
longitude: this.pointCenter[0],
|
|
12457
|
-
latitude: this.pointCenter[1]
|
|
12458
|
-
})
|
|
12571
|
+
latitude: this.pointCenter[1],
|
|
12572
|
+
});
|
|
12459
12573
|
},
|
|
12460
12574
|
/**
|
|
12461
12575
|
* 设置搜索的可编辑图层
|
|
@@ -12463,78 +12577,83 @@ const mapLocationMixin = {
|
|
|
12463
12577
|
setSearchVm() {
|
|
12464
12578
|
if (!this.disabled) {
|
|
12465
12579
|
let pointSymbol = {
|
|
12466
|
-
type:
|
|
12580
|
+
type: "picture-marker", // autocasts as new PictureFillSymbol()
|
|
12467
12581
|
...markerData,
|
|
12468
|
-
img: markerData.url
|
|
12469
|
-
}
|
|
12582
|
+
img: markerData.url,
|
|
12583
|
+
};
|
|
12470
12584
|
searchViewModel = new window.jkEsri.SketchViewModel({
|
|
12471
12585
|
view: arcgisView, // view 是你的地图视图
|
|
12472
12586
|
layer: mapLocationMixin_pointLayer,
|
|
12473
12587
|
pointSymbol: pointSymbol,
|
|
12474
12588
|
polylineSymbol: {
|
|
12475
|
-
type:
|
|
12476
|
-
color:
|
|
12477
|
-
width:
|
|
12478
|
-
style:
|
|
12589
|
+
type: "simple-line",
|
|
12590
|
+
color: "#8A2BE2",
|
|
12591
|
+
width: "4",
|
|
12592
|
+
style: "dash",
|
|
12479
12593
|
spatialReference: {
|
|
12480
|
-
wkid: 4326
|
|
12481
|
-
}
|
|
12594
|
+
wkid: 4326,
|
|
12595
|
+
},
|
|
12482
12596
|
},
|
|
12483
12597
|
polygonSymbol: {
|
|
12484
|
-
type:
|
|
12485
|
-
color:
|
|
12486
|
-
style:
|
|
12598
|
+
type: "simple-fill",
|
|
12599
|
+
color: "rgba(0, 45, 99,0.4)",
|
|
12600
|
+
style: "solid",
|
|
12487
12601
|
outline: {
|
|
12488
|
-
color:
|
|
12489
|
-
width: 2
|
|
12602
|
+
color: "white",
|
|
12603
|
+
width: 2,
|
|
12490
12604
|
},
|
|
12491
12605
|
spatialReference: {
|
|
12492
|
-
wkid: 4326
|
|
12493
|
-
}
|
|
12606
|
+
wkid: 4326,
|
|
12607
|
+
},
|
|
12494
12608
|
},
|
|
12495
12609
|
spatialReference: {
|
|
12496
|
-
wkid: 4326
|
|
12497
|
-
}
|
|
12498
|
-
})
|
|
12499
|
-
this.moveCenterPoint()
|
|
12500
|
-
searchViewModel.on(
|
|
12501
|
-
if (
|
|
12502
|
-
|
|
12610
|
+
wkid: 4326,
|
|
12611
|
+
},
|
|
12612
|
+
});
|
|
12613
|
+
this.moveCenterPoint();
|
|
12614
|
+
searchViewModel.on("update", (event) => {
|
|
12615
|
+
if (
|
|
12616
|
+
event &&
|
|
12617
|
+
event.graphics &&
|
|
12618
|
+
event.graphics.length > 0 &&
|
|
12619
|
+
event.graphics[0].geometry
|
|
12620
|
+
) {
|
|
12621
|
+
let geometry = event.graphics[0].geometry;
|
|
12503
12622
|
event.graphics[0].symbol = getPictureSymbol({
|
|
12504
|
-
...markerData
|
|
12505
|
-
})
|
|
12623
|
+
...markerData,
|
|
12624
|
+
});
|
|
12506
12625
|
if (this.isSearch) {
|
|
12507
|
-
this.pointData.longitude = geometry.longitude
|
|
12508
|
-
this.pointData.latitude = geometry.latitude
|
|
12509
|
-
this.pointData.address =
|
|
12626
|
+
this.pointData.longitude = geometry.longitude;
|
|
12627
|
+
this.pointData.latitude = geometry.latitude;
|
|
12628
|
+
this.pointData.address = "";
|
|
12510
12629
|
}
|
|
12511
|
-
event.graphic = event.graphics[0]
|
|
12630
|
+
event.graphic = event.graphics[0];
|
|
12512
12631
|
}
|
|
12513
|
-
})
|
|
12514
|
-
} else this.moveCenterPoint()
|
|
12632
|
+
});
|
|
12633
|
+
} else this.moveCenterPoint();
|
|
12515
12634
|
},
|
|
12516
12635
|
|
|
12517
12636
|
clearSearchMap() {
|
|
12518
|
-
console.log(
|
|
12637
|
+
console.log("");
|
|
12519
12638
|
},
|
|
12520
12639
|
clearSketch() {
|
|
12521
|
-
mapLocationMixin_pointLayer && mapLocationMixin_pointLayer.removeAll()
|
|
12640
|
+
mapLocationMixin_pointLayer && mapLocationMixin_pointLayer.removeAll();
|
|
12522
12641
|
if (this.$refs.searchRef && this.$refs.searchRef.clearSearch)
|
|
12523
|
-
this.$refs.searchRef.clearSearch()
|
|
12642
|
+
this.$refs.searchRef.clearSearch();
|
|
12524
12643
|
},
|
|
12525
12644
|
/**
|
|
12526
12645
|
* 搜索绘图
|
|
12527
12646
|
* @param data
|
|
12528
12647
|
*/
|
|
12529
12648
|
refreshPoint(data) {
|
|
12530
|
-
mapLocationMixin_pointLayer && mapLocationMixin_pointLayer.removeAll()
|
|
12531
|
-
this.pointData = { ...data, ...markerData }
|
|
12532
|
-
mapLocationMixin_pointLayer.add(drawArcPoint(this.pointData))
|
|
12649
|
+
mapLocationMixin_pointLayer && mapLocationMixin_pointLayer.removeAll();
|
|
12650
|
+
this.pointData = { ...data, ...markerData };
|
|
12651
|
+
mapLocationMixin_pointLayer.add(drawArcPoint(this.pointData));
|
|
12533
12652
|
if (this.isShowPoint)
|
|
12534
12653
|
setTimeout(() => {
|
|
12535
|
-
searchViewModel.update(mapLocationMixin_pointLayer.graphics._items[0])
|
|
12536
|
-
}, 200)
|
|
12537
|
-
|
|
12654
|
+
searchViewModel.update(mapLocationMixin_pointLayer.graphics._items[0]);
|
|
12655
|
+
}, 200);
|
|
12656
|
+
(0,utils_namespaceObject.goToPoint)(data);
|
|
12538
12657
|
},
|
|
12539
12658
|
/**
|
|
12540
12659
|
* 初始化点
|
|
@@ -12543,12 +12662,12 @@ const mapLocationMixin = {
|
|
|
12543
12662
|
* @param {String} options.address 中文地址
|
|
12544
12663
|
*/
|
|
12545
12664
|
initPoint(options) {
|
|
12546
|
-
this.center = []
|
|
12547
|
-
this.address =
|
|
12548
|
-
this.pointData.address =
|
|
12665
|
+
this.center = [];
|
|
12666
|
+
this.address = "";
|
|
12667
|
+
this.pointData.address = "";
|
|
12549
12668
|
if (options) {
|
|
12550
12669
|
if (options.address) {
|
|
12551
|
-
this.address = data.address
|
|
12670
|
+
this.address = data.address;
|
|
12552
12671
|
}
|
|
12553
12672
|
if (
|
|
12554
12673
|
options.center &&
|
|
@@ -12556,12 +12675,12 @@ const mapLocationMixin = {
|
|
|
12556
12675
|
options.center[0] &&
|
|
12557
12676
|
options.center[1]
|
|
12558
12677
|
) {
|
|
12559
|
-
this.center = data.center
|
|
12678
|
+
this.center = data.center;
|
|
12560
12679
|
}
|
|
12561
12680
|
if (arcgisMap && arcgisView) {
|
|
12562
12681
|
setTimeout(() => {
|
|
12563
|
-
this.moveCenterPoint()
|
|
12564
|
-
}, 200)
|
|
12682
|
+
this.moveCenterPoint();
|
|
12683
|
+
}, 200);
|
|
12565
12684
|
}
|
|
12566
12685
|
}
|
|
12567
12686
|
},
|
|
@@ -12569,33 +12688,35 @@ const mapLocationMixin = {
|
|
|
12569
12688
|
* 搜索回调
|
|
12570
12689
|
*/
|
|
12571
12690
|
async returnPoint() {
|
|
12572
|
-
let datas = this.pointData
|
|
12691
|
+
let datas = this.pointData;
|
|
12573
12692
|
if (datas && datas.longitude && datas.latitude) {
|
|
12574
12693
|
if (!datas.address) {
|
|
12575
12694
|
let resData = await getGeocoderLg({
|
|
12576
12695
|
longitude: this.pointData.longitude,
|
|
12577
|
-
latitude: this.pointData.latitude
|
|
12578
|
-
})
|
|
12696
|
+
latitude: this.pointData.latitude,
|
|
12697
|
+
});
|
|
12579
12698
|
if (resData && resData.addressComponent) {
|
|
12580
|
-
let address =
|
|
12581
|
-
address = resData.addressComponent.address
|
|
12699
|
+
let address = "";
|
|
12700
|
+
address = resData.addressComponent.address
|
|
12701
|
+
? resData.addressComponent.address
|
|
12702
|
+
: "";
|
|
12582
12703
|
datas = {
|
|
12583
12704
|
...this.pointData,
|
|
12584
12705
|
...resData.addressComponent,
|
|
12585
|
-
address
|
|
12586
|
-
}
|
|
12706
|
+
address,
|
|
12707
|
+
};
|
|
12587
12708
|
}
|
|
12588
12709
|
}
|
|
12589
|
-
return datas
|
|
12590
|
-
} else return datas
|
|
12591
|
-
}
|
|
12710
|
+
return datas;
|
|
12711
|
+
} else return datas;
|
|
12712
|
+
},
|
|
12592
12713
|
},
|
|
12593
12714
|
beforeUnmount() {
|
|
12594
|
-
this.clearSketch()
|
|
12595
|
-
this._clickHandler
|
|
12596
|
-
this._hoverHandler
|
|
12597
|
-
}
|
|
12598
|
-
}
|
|
12715
|
+
this.clearSketch();
|
|
12716
|
+
this._clickHandler.remove();
|
|
12717
|
+
this._hoverHandler.remove();
|
|
12718
|
+
},
|
|
12719
|
+
};
|
|
12599
12720
|
|
|
12600
12721
|
;// ./src/lib/eventManager.js
|
|
12601
12722
|
/**
|
|
@@ -12739,8 +12860,8 @@ function createEventManager(originalFn, options = {}) {
|
|
|
12739
12860
|
|
|
12740
12861
|
|
|
12741
12862
|
|
|
12742
|
-
let MapWrapper_esri = {} // 全局 esri 缓存(可选,用于调试)
|
|
12743
|
-
|
|
12863
|
+
let MapWrapper_esri = {}; // 全局 esri 缓存(可选,用于调试)
|
|
12864
|
+
|
|
12744
12865
|
|
|
12745
12866
|
class MapWrapper {
|
|
12746
12867
|
/**
|
|
@@ -12750,19 +12871,19 @@ class MapWrapper {
|
|
|
12750
12871
|
* @returns
|
|
12751
12872
|
*/
|
|
12752
12873
|
constructor(id, params = {}) {
|
|
12753
|
-
this.id = id
|
|
12754
|
-
let param = { ...map_config, ...params }
|
|
12755
|
-
this.param = param
|
|
12756
|
-
this.__config = param.config || {}
|
|
12757
|
-
this.layersType = param.layersType
|
|
12874
|
+
this.id = id;
|
|
12875
|
+
let param = { ...map_config, ...params };
|
|
12876
|
+
this.param = param;
|
|
12877
|
+
this.__config = param.config || {};
|
|
12878
|
+
this.layersType = param.layersType;
|
|
12758
12879
|
// 存储原始参数,供 TDTinstance 使用
|
|
12759
|
-
this.mapParams = { ...param }
|
|
12880
|
+
this.mapParams = { ...param };
|
|
12760
12881
|
|
|
12761
12882
|
// ✅ 使用 createEventManager 替代 eventBox
|
|
12762
|
-
this.onloadMap = createEventManager()
|
|
12883
|
+
this.onloadMap = createEventManager();
|
|
12763
12884
|
|
|
12764
|
-
this.createMap(id, param)
|
|
12765
|
-
return this
|
|
12885
|
+
this.createMap(id, param);
|
|
12886
|
+
return this;
|
|
12766
12887
|
}
|
|
12767
12888
|
/**
|
|
12768
12889
|
* 创建地图
|
|
@@ -12770,7 +12891,7 @@ class MapWrapper {
|
|
|
12770
12891
|
* @param {*} param
|
|
12771
12892
|
*/
|
|
12772
12893
|
createMap(id, param) {
|
|
12773
|
-
this.init(param)
|
|
12894
|
+
this.init(param);
|
|
12774
12895
|
}
|
|
12775
12896
|
/**
|
|
12776
12897
|
* 加载js和css
|
|
@@ -12779,27 +12900,27 @@ class MapWrapper {
|
|
|
12779
12900
|
init(param) {
|
|
12780
12901
|
if (!window.jkEsri) {
|
|
12781
12902
|
if (param.initCss) {
|
|
12782
|
-
(0,esri_loader.loadCss)(param.initCss)
|
|
12903
|
+
(0,esri_loader.loadCss)(param.initCss);
|
|
12783
12904
|
}
|
|
12784
12905
|
const modules = param.modules || [
|
|
12785
|
-
|
|
12786
|
-
|
|
12787
|
-
|
|
12788
|
-
|
|
12789
|
-
|
|
12790
|
-
|
|
12791
|
-
|
|
12792
|
-
]
|
|
12906
|
+
"esri/Map",
|
|
12907
|
+
"esri/views/MapView",
|
|
12908
|
+
"esri/layers/WebTileLayer",
|
|
12909
|
+
"esri/geometry/Extent",
|
|
12910
|
+
"esri/geometry/SpatialReference",
|
|
12911
|
+
"esri/geometry/support/webMercatorUtils",
|
|
12912
|
+
"esri/geometry/geometryEngine",
|
|
12913
|
+
];
|
|
12793
12914
|
// 更新 mapParams.modules 用于 TDTinstance 解析
|
|
12794
|
-
this.mapParams.modules = modules
|
|
12795
|
-
|
|
12915
|
+
this.mapParams.modules = modules;
|
|
12916
|
+
(0,esri_loader.loadModules)(modules, { url: param.initJs })
|
|
12796
12917
|
.then(this.TDTinstance.bind(this, this.mapParams))
|
|
12797
12918
|
.then(this.initMap.bind(this))
|
|
12798
12919
|
.catch((err) => {
|
|
12799
|
-
console.error(
|
|
12800
|
-
throw err
|
|
12801
|
-
})
|
|
12802
|
-
} else this.initMap()
|
|
12920
|
+
console.error("地图模块加载失败:", err);
|
|
12921
|
+
throw err;
|
|
12922
|
+
});
|
|
12923
|
+
} else this.initMap();
|
|
12803
12924
|
}
|
|
12804
12925
|
|
|
12805
12926
|
/**
|
|
@@ -12808,69 +12929,74 @@ class MapWrapper {
|
|
|
12808
12929
|
* @param {Array} args - loadModules 返回的模块实例数组
|
|
12809
12930
|
*/
|
|
12810
12931
|
TDTinstance(mapSet, args) {
|
|
12811
|
-
MapWrapper_esri = {} // 重置
|
|
12932
|
+
MapWrapper_esri = {}; // 重置
|
|
12812
12933
|
for (const k in args) {
|
|
12813
|
-
if (!args.hasOwnProperty(k)) continue
|
|
12934
|
+
if (!args.hasOwnProperty(k)) continue;
|
|
12814
12935
|
|
|
12815
12936
|
// 获取模块短名称(如 'esri/Map' → 'Map')
|
|
12816
|
-
const name = mapSet.modules[k].split(
|
|
12937
|
+
const name = mapSet.modules[k].split("/").pop();
|
|
12817
12938
|
|
|
12818
12939
|
// 特殊处理 webMercatorUtils
|
|
12819
|
-
if (name ===
|
|
12820
|
-
MapWrapper_esri.webMercatorToGeographic = args[k].webMercatorToGeographic
|
|
12821
|
-
MapWrapper_esri.geographicToWebMercator = args[k].geographicToWebMercator
|
|
12940
|
+
if (name === "webMercatorUtils") {
|
|
12941
|
+
MapWrapper_esri.webMercatorToGeographic = args[k].webMercatorToGeographic;
|
|
12942
|
+
MapWrapper_esri.geographicToWebMercator = args[k].geographicToWebMercator;
|
|
12822
12943
|
}
|
|
12823
12944
|
|
|
12824
12945
|
// 特殊处理 geometryEngine(直接挂载整个对象)
|
|
12825
|
-
if (name ===
|
|
12826
|
-
MapWrapper_esri.geometryEngine = args[k]
|
|
12946
|
+
if (name === "geometryEngine") {
|
|
12947
|
+
MapWrapper_esri.geometryEngine = args[k];
|
|
12827
12948
|
}
|
|
12828
12949
|
|
|
12829
12950
|
// 通用挂载:esri.Map, esri.MapView 等
|
|
12830
|
-
MapWrapper_esri[name] = args[k]
|
|
12951
|
+
MapWrapper_esri[name] = args[k];
|
|
12831
12952
|
}
|
|
12832
12953
|
|
|
12833
12954
|
// 暴露到 window(便于调试,生产环境可移除)
|
|
12834
|
-
window.jkEsri = MapWrapper_esri
|
|
12955
|
+
window.jkEsri = MapWrapper_esri;
|
|
12835
12956
|
|
|
12836
12957
|
// 同时保存到实例,避免全局依赖
|
|
12837
|
-
this.esri = MapWrapper_esri
|
|
12958
|
+
this.esri = MapWrapper_esri;
|
|
12838
12959
|
}
|
|
12839
12960
|
/**
|
|
12840
12961
|
* 初始化地图
|
|
12841
12962
|
* @returns
|
|
12842
12963
|
*/
|
|
12843
12964
|
initMap() {
|
|
12844
|
-
let layer = null
|
|
12845
|
-
if (
|
|
12965
|
+
let layer = null;
|
|
12966
|
+
if (
|
|
12967
|
+
(this.layersType == "dynamic" || this.layersType == "TileLayer") &&
|
|
12968
|
+
this.param.baseMapUrl
|
|
12969
|
+
) {
|
|
12846
12970
|
var layerApi =
|
|
12847
|
-
this.layersType ==
|
|
12971
|
+
this.layersType == "dynamic"
|
|
12972
|
+
? window.jkEsri.MapImageLayer
|
|
12973
|
+
: window.jkEsri.TileLayer;
|
|
12848
12974
|
layer = new layerApi({
|
|
12849
12975
|
url: this.param.baseMapUrl,
|
|
12850
12976
|
title: this.layersType,
|
|
12851
12977
|
opacity: 1,
|
|
12852
|
-
visible: true
|
|
12853
|
-
})
|
|
12978
|
+
visible: true,
|
|
12979
|
+
});
|
|
12854
12980
|
createBase(this.id, layer, this.param).then((res) => {
|
|
12855
|
-
this.onloadMap(res)
|
|
12856
|
-
})
|
|
12981
|
+
this.onloadMap(res);
|
|
12982
|
+
});
|
|
12857
12983
|
} else
|
|
12858
12984
|
createMapView(this.id, this.param).then((res) => {
|
|
12859
|
-
this.onloadMap(res)
|
|
12860
|
-
})
|
|
12985
|
+
this.onloadMap(res);
|
|
12986
|
+
});
|
|
12861
12987
|
}
|
|
12862
12988
|
|
|
12863
12989
|
/**
|
|
12864
12990
|
* 销毁
|
|
12865
12991
|
*/
|
|
12866
12992
|
destroy() {
|
|
12867
|
-
this.onloadMap
|
|
12993
|
+
this.onloadMap.destroy();
|
|
12868
12994
|
if (this.view) {
|
|
12869
|
-
this.view.container = null
|
|
12870
|
-
this.view = null
|
|
12995
|
+
this.view.container = null;
|
|
12996
|
+
this.view = null;
|
|
12871
12997
|
}
|
|
12872
|
-
this.map = null
|
|
12873
|
-
this.esri = null
|
|
12998
|
+
this.map = null;
|
|
12999
|
+
this.esri = null;
|
|
12874
13000
|
}
|
|
12875
13001
|
}
|
|
12876
13002
|
|
|
@@ -12949,13 +13075,13 @@ let mapMixin_arcgisMap = null,
|
|
|
12949
13075
|
drawingText = null,
|
|
12950
13076
|
layerDraw = null,
|
|
12951
13077
|
layerDrawText = null,
|
|
12952
|
-
drawEnd = 0
|
|
13078
|
+
drawEnd = 0;
|
|
12953
13079
|
|
|
12954
13080
|
const mapMixin_markerData = {
|
|
12955
13081
|
url: ico_location_namespaceObject,
|
|
12956
13082
|
width: 20,
|
|
12957
|
-
height: 18
|
|
12958
|
-
}
|
|
13083
|
+
height: 18,
|
|
13084
|
+
};
|
|
12959
13085
|
|
|
12960
13086
|
const mapMixin = {
|
|
12961
13087
|
components: { searchMap: search_map, svgIcon: svgIcon, loadingBox: loading },
|
|
@@ -12963,255 +13089,277 @@ const mapMixin = {
|
|
|
12963
13089
|
mapParams: {
|
|
12964
13090
|
type: Object,
|
|
12965
13091
|
default: () => {
|
|
12966
|
-
return {}
|
|
12967
|
-
}
|
|
13092
|
+
return {};
|
|
13093
|
+
},
|
|
12968
13094
|
},
|
|
12969
13095
|
module: {
|
|
12970
13096
|
type: Array,
|
|
12971
13097
|
default: () => {
|
|
12972
|
-
return [
|
|
12973
|
-
}
|
|
13098
|
+
return ["search", "edit", "screen"]; //edit:编辑,screen:全屏,search:搜索-'search', 'edit', 'screen'
|
|
13099
|
+
},
|
|
12974
13100
|
},
|
|
12975
13101
|
isUseMore: {
|
|
12976
13102
|
type: Boolean,
|
|
12977
|
-
default: false
|
|
13103
|
+
default: false,
|
|
12978
13104
|
},
|
|
12979
13105
|
center: {
|
|
12980
13106
|
type: Array,
|
|
12981
|
-
default: () => [115.837683, 23.43353]
|
|
13107
|
+
default: () => [115.837683, 23.43353],
|
|
12982
13108
|
},
|
|
12983
13109
|
type: {
|
|
12984
13110
|
type: Array,
|
|
12985
|
-
default: () => [
|
|
12986
|
-
}
|
|
13111
|
+
default: () => ["point", "polyline", "polygon"], //'point', 'polyline', 'polygon'
|
|
13112
|
+
},
|
|
12987
13113
|
},
|
|
12988
13114
|
computed: {
|
|
12989
13115
|
isShowPoint() {
|
|
12990
|
-
return this.type && this.type.includes(
|
|
13116
|
+
return this.type && this.type.includes("point");
|
|
12991
13117
|
},
|
|
12992
13118
|
isSearch() {
|
|
12993
|
-
return
|
|
13119
|
+
return (
|
|
13120
|
+
this.module &&
|
|
13121
|
+
this.module.length > 0 &&
|
|
13122
|
+
this.module.indexOf("search") > -1
|
|
13123
|
+
);
|
|
12994
13124
|
},
|
|
12995
13125
|
isUseSketch() {
|
|
12996
|
-
return
|
|
13126
|
+
return (
|
|
13127
|
+
this.module &&
|
|
13128
|
+
this.module.length > 0 &&
|
|
13129
|
+
this.module.indexOf("edit") > -1
|
|
13130
|
+
);
|
|
12997
13131
|
},
|
|
12998
13132
|
isShowBtnBox() {
|
|
12999
13133
|
return (
|
|
13000
13134
|
this.module &&
|
|
13001
13135
|
this.module.length > 0 &&
|
|
13002
|
-
(this.module.indexOf(
|
|
13003
|
-
)
|
|
13004
|
-
}
|
|
13136
|
+
(this.module.indexOf("edit") > -1 || this.module.indexOf("screen") > -1)
|
|
13137
|
+
);
|
|
13138
|
+
},
|
|
13005
13139
|
},
|
|
13006
13140
|
data() {
|
|
13007
13141
|
return {
|
|
13008
|
-
mapId:
|
|
13142
|
+
mapId: "map" + Math.round(Math.random() * 10000),
|
|
13009
13143
|
isLoading: true,
|
|
13010
13144
|
pointData: null,
|
|
13011
13145
|
isPerv: false,
|
|
13012
13146
|
isNextList: [],
|
|
13013
|
-
drawIngArea: 0
|
|
13014
|
-
}
|
|
13147
|
+
drawIngArea: 0,
|
|
13148
|
+
};
|
|
13015
13149
|
},
|
|
13016
13150
|
methods: {
|
|
13017
13151
|
getMap() {
|
|
13018
|
-
return mapMixin_arcgisMap
|
|
13152
|
+
return mapMixin_arcgisMap;
|
|
13019
13153
|
},
|
|
13020
13154
|
getView() {
|
|
13021
|
-
return mapMixin_arcgisView
|
|
13155
|
+
return mapMixin_arcgisView;
|
|
13022
13156
|
},
|
|
13023
13157
|
setupMapEvents(view) {
|
|
13024
|
-
this._clickHandler = view.on(
|
|
13025
|
-
|
|
13158
|
+
this._clickHandler = view.on(
|
|
13159
|
+
"click",
|
|
13160
|
+
this.debounce(this.handleMapClick, 300)
|
|
13161
|
+
);
|
|
13162
|
+
this._hoverHandler = view.on(
|
|
13163
|
+
"pointer-move",
|
|
13164
|
+
this.debounce(this.handleMapHover, 80)
|
|
13165
|
+
);
|
|
13026
13166
|
},
|
|
13027
13167
|
async handleMapClick(e) {
|
|
13028
|
-
if (mapMixin_isClickLocked) return
|
|
13168
|
+
if (mapMixin_isClickLocked) return;
|
|
13029
13169
|
if (mapMixin_currentAbortController) {
|
|
13030
|
-
mapMixin_currentAbortController.abort()
|
|
13170
|
+
mapMixin_currentAbortController.abort();
|
|
13031
13171
|
}
|
|
13032
|
-
mapMixin_currentAbortController = new AbortController()
|
|
13033
|
-
mapMixin_isClickLocked = true
|
|
13172
|
+
mapMixin_currentAbortController = new AbortController();
|
|
13173
|
+
mapMixin_isClickLocked = true;
|
|
13034
13174
|
const eventData = {
|
|
13035
13175
|
mapPoint: e.mapPoint,
|
|
13036
|
-
type:
|
|
13037
|
-
}
|
|
13176
|
+
type: "click",
|
|
13177
|
+
};
|
|
13038
13178
|
try {
|
|
13039
|
-
const hitResult = await mapMixin_arcgisView.hitTest(e)
|
|
13040
|
-
if (mapMixin_currentAbortController.signal.aborted) return
|
|
13041
|
-
this.$emit(
|
|
13179
|
+
const hitResult = await mapMixin_arcgisView.hitTest(e);
|
|
13180
|
+
if (mapMixin_currentAbortController.signal.aborted) return;
|
|
13181
|
+
this.$emit("mapEventClick", { ...eventData, ...hitResult });
|
|
13042
13182
|
} catch (err) {
|
|
13043
|
-
if (err.name !==
|
|
13044
|
-
console.warn(
|
|
13183
|
+
if (err.name !== "AbortError") {
|
|
13184
|
+
console.warn("hitTest error", err);
|
|
13045
13185
|
}
|
|
13046
13186
|
} finally {
|
|
13047
13187
|
setTimeout(() => {
|
|
13048
|
-
mapMixin_isClickLocked = false
|
|
13049
|
-
mapMixin_currentAbortController = null
|
|
13050
|
-
}, 300)
|
|
13188
|
+
mapMixin_isClickLocked = false;
|
|
13189
|
+
mapMixin_currentAbortController = null;
|
|
13190
|
+
}, 300);
|
|
13051
13191
|
}
|
|
13052
13192
|
},
|
|
13053
13193
|
|
|
13054
13194
|
async handleMapHover(event) {
|
|
13055
|
-
const hitData = await mapMixin_arcgisView.hitTest(event)
|
|
13195
|
+
const hitData = await mapMixin_arcgisView.hitTest(event);
|
|
13056
13196
|
hitData.results = hitData.results.filter(
|
|
13057
|
-
(item) =>
|
|
13058
|
-
|
|
13059
|
-
|
|
13197
|
+
(item) =>
|
|
13198
|
+
item.layer && item.layer.id && item.layer.id.indexOf("map-mask") == -1
|
|
13199
|
+
);
|
|
13200
|
+
if (
|
|
13201
|
+
hitData &&
|
|
13202
|
+
hitData.results &&
|
|
13203
|
+
hitData.results.length > 0 &&
|
|
13204
|
+
hitData.screenPoint
|
|
13205
|
+
) {
|
|
13060
13206
|
// arcgisView.container.style.cursor = 'pointer'
|
|
13061
|
-
this.$emit(
|
|
13207
|
+
this.$emit("mapEventMouse", hitData);
|
|
13062
13208
|
} else {
|
|
13063
|
-
mapMixin_arcgisView.container.style.cursor =
|
|
13209
|
+
mapMixin_arcgisView.container.style.cursor = "default";
|
|
13064
13210
|
}
|
|
13065
13211
|
},
|
|
13066
13212
|
|
|
13067
13213
|
debounce(fn, delay) {
|
|
13068
|
-
let timer
|
|
13214
|
+
let timer;
|
|
13069
13215
|
return (...args) => {
|
|
13070
|
-
clearTimeout(timer)
|
|
13071
|
-
timer = setTimeout(() => fn.apply(this, args), delay)
|
|
13072
|
-
}
|
|
13216
|
+
clearTimeout(timer);
|
|
13217
|
+
timer = setTimeout(() => fn.apply(this, args), delay);
|
|
13218
|
+
};
|
|
13073
13219
|
},
|
|
13074
13220
|
|
|
13075
13221
|
cleanupMapEvents() {
|
|
13076
|
-
this._clickHandler
|
|
13077
|
-
this._hoverHandler
|
|
13222
|
+
this._clickHandler.remove();
|
|
13223
|
+
this._hoverHandler.remove();
|
|
13078
13224
|
},
|
|
13079
13225
|
|
|
13080
13226
|
loadEdMap(data) {
|
|
13081
|
-
mapMixin_arcgisMap = data.map
|
|
13082
|
-
mapMixin_arcgisView = data.view
|
|
13083
|
-
initMapPack(data)
|
|
13084
|
-
this.setupMapEvents(data.view)
|
|
13227
|
+
mapMixin_arcgisMap = data.map;
|
|
13228
|
+
mapMixin_arcgisView = data.view;
|
|
13229
|
+
initMapPack(data);
|
|
13230
|
+
this.setupMapEvents(data.view);
|
|
13085
13231
|
if (this.isSearch) {
|
|
13086
|
-
mapMixin_pointLayer = new window.jkEsri.GraphicsLayer({ id:
|
|
13087
|
-
mapMixin_arcgisMap.add(mapMixin_pointLayer, 10)
|
|
13232
|
+
mapMixin_pointLayer = new window.jkEsri.GraphicsLayer({ id: "pointLayer" });
|
|
13233
|
+
mapMixin_arcgisMap.add(mapMixin_pointLayer, 10);
|
|
13088
13234
|
}
|
|
13089
13235
|
if (this.isUseSketch) {
|
|
13090
|
-
this.loadSketch()
|
|
13236
|
+
this.loadSketch();
|
|
13091
13237
|
}
|
|
13092
13238
|
if (this.center && this.center.length === 2) {
|
|
13093
13239
|
goToMap({
|
|
13094
13240
|
longitude: this.center[0],
|
|
13095
|
-
latitude: this.center[1]
|
|
13096
|
-
})
|
|
13241
|
+
latitude: this.center[1],
|
|
13242
|
+
});
|
|
13097
13243
|
}
|
|
13098
|
-
this.$emit(
|
|
13244
|
+
this.$emit("loadEdMap", data);
|
|
13099
13245
|
},
|
|
13100
13246
|
|
|
13101
13247
|
clearSearchMap() {
|
|
13102
|
-
mapMixin_pointLayer
|
|
13248
|
+
mapMixin_pointLayer.removeAll();
|
|
13103
13249
|
},
|
|
13104
13250
|
|
|
13105
13251
|
refreshPoint(data) {
|
|
13106
|
-
mapMixin_pointLayer
|
|
13252
|
+
mapMixin_pointLayer.removeAll();
|
|
13107
13253
|
this.pointData = {
|
|
13108
13254
|
...data,
|
|
13109
|
-
...mapMixin_markerData
|
|
13110
|
-
}
|
|
13111
|
-
mapMixin_pointLayer.add(drawArcPoint(this.pointData))
|
|
13112
|
-
goToMap(data)
|
|
13255
|
+
...mapMixin_markerData,
|
|
13256
|
+
};
|
|
13257
|
+
mapMixin_pointLayer.add(drawArcPoint(this.pointData));
|
|
13258
|
+
goToMap(data);
|
|
13113
13259
|
},
|
|
13114
13260
|
uuidGenerator() {
|
|
13115
|
-
const originStr =
|
|
13116
|
-
const originChar =
|
|
13117
|
-
const len = originChar.length
|
|
13118
|
-
return originStr.replace(/x/g, () =>
|
|
13261
|
+
const originStr = "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx";
|
|
13262
|
+
const originChar = "ABCDEFGHJKMNPQRSTWXYZ0123456789";
|
|
13263
|
+
const len = originChar.length;
|
|
13264
|
+
return originStr.replace(/x/g, () =>
|
|
13265
|
+
originChar.charAt(Math.floor(Math.random() * len))
|
|
13266
|
+
);
|
|
13119
13267
|
},
|
|
13120
13268
|
|
|
13121
13269
|
drawLayerType(type) {
|
|
13122
|
-
editGraphic = null
|
|
13123
|
-
sketchDemo.create(type)
|
|
13124
|
-
sketchDemo.on(
|
|
13125
|
-
this.isPerv = true
|
|
13126
|
-
|
|
13127
|
-
if (event.graphic) this.drawLayerNames(event.graphic)
|
|
13128
|
-
if (event.state ===
|
|
13129
|
-
if (!this.isUseMore) sketchDemo.cancel()
|
|
13130
|
-
this.isPerv = false
|
|
13131
|
-
this.isNextList = []
|
|
13132
|
-
this.drawIngArea = 0
|
|
13133
|
-
editGraphic = null
|
|
13134
|
-
drawEnd = 1
|
|
13270
|
+
editGraphic = null;
|
|
13271
|
+
sketchDemo.create(type);
|
|
13272
|
+
sketchDemo.on("create", (event) => {
|
|
13273
|
+
this.isPerv = true;
|
|
13274
|
+
|
|
13275
|
+
if (event.graphic) this.drawLayerNames(event.graphic);
|
|
13276
|
+
if (event.state === "complete") {
|
|
13277
|
+
if (!this.isUseMore) sketchDemo.cancel();
|
|
13278
|
+
this.isPerv = false;
|
|
13279
|
+
this.isNextList = [];
|
|
13280
|
+
this.drawIngArea = 0;
|
|
13281
|
+
editGraphic = null;
|
|
13282
|
+
drawEnd = 1;
|
|
13135
13283
|
|
|
13136
13284
|
if (event.graphic && !event.graphic.attributes) {
|
|
13137
13285
|
const baseAttr = {
|
|
13138
13286
|
typeId: this.uuidGenerator(),
|
|
13139
|
-
name:
|
|
13140
|
-
describe:
|
|
13141
|
-
area: 0
|
|
13142
|
-
}
|
|
13143
|
-
if (event.graphic.symbol.type ===
|
|
13287
|
+
name: "",
|
|
13288
|
+
describe: "",
|
|
13289
|
+
area: 0,
|
|
13290
|
+
};
|
|
13291
|
+
if (event.graphic.symbol.type === "simple-fill") {
|
|
13144
13292
|
event.graphic.attributes = {
|
|
13145
13293
|
...baseAttr,
|
|
13146
|
-
type:
|
|
13147
|
-
}
|
|
13148
|
-
} else if (event.graphic.symbol.type ===
|
|
13294
|
+
type: "polygon",
|
|
13295
|
+
};
|
|
13296
|
+
} else if (event.graphic.symbol.type === "simple-line") {
|
|
13149
13297
|
event.graphic.attributes = {
|
|
13150
13298
|
...baseAttr,
|
|
13151
|
-
type:
|
|
13152
|
-
}
|
|
13299
|
+
type: "polyline",
|
|
13300
|
+
};
|
|
13153
13301
|
} else {
|
|
13154
13302
|
event.graphic.attributes = {
|
|
13155
13303
|
...baseAttr,
|
|
13156
|
-
type:
|
|
13157
|
-
}
|
|
13304
|
+
type: "point",
|
|
13305
|
+
};
|
|
13158
13306
|
}
|
|
13159
|
-
} else if (event.graphics
|
|
13160
|
-
const g = event.graphics[0]
|
|
13161
|
-
if ([
|
|
13307
|
+
} else if (event.graphics[0]) {
|
|
13308
|
+
const g = event.graphics[0];
|
|
13309
|
+
if (["simple-marker", "picture-marker"].includes(g.symbol.type)) {
|
|
13162
13310
|
g.symbol = getPictureSymbol({
|
|
13163
|
-
url: g.attributes
|
|
13164
|
-
width: g.attributes
|
|
13165
|
-
height: g.attributes
|
|
13166
|
-
})
|
|
13311
|
+
url: g.attributes.url || ico_location_namespaceObject,
|
|
13312
|
+
width: g.attributes.width || 20,
|
|
13313
|
+
height: g.attributes.height || 18,
|
|
13314
|
+
});
|
|
13167
13315
|
}
|
|
13168
13316
|
}
|
|
13169
|
-
this.drawcomplete(event)
|
|
13317
|
+
this.drawcomplete(event);
|
|
13170
13318
|
}
|
|
13171
|
-
})
|
|
13319
|
+
});
|
|
13172
13320
|
},
|
|
13173
13321
|
undo() {
|
|
13174
|
-
if (!this.isPerv) return
|
|
13175
|
-
sketchDemo.undo()
|
|
13176
|
-
this.isNextList.push(
|
|
13177
|
-
if (editGraphic) this.drawLayerNames(editGraphic)
|
|
13322
|
+
if (!this.isPerv) return;
|
|
13323
|
+
sketchDemo.undo();
|
|
13324
|
+
this.isNextList.push("1");
|
|
13325
|
+
if (editGraphic) this.drawLayerNames(editGraphic);
|
|
13178
13326
|
},
|
|
13179
13327
|
redo() {
|
|
13180
|
-
if (this.isNextList.length === 0) return
|
|
13181
|
-
this.isPerv = true
|
|
13182
|
-
sketchDemo.redo()
|
|
13183
|
-
if (editGraphic) this.drawLayerNames(editGraphic)
|
|
13184
|
-
this.isNextList.pop()
|
|
13328
|
+
if (this.isNextList.length === 0) return;
|
|
13329
|
+
this.isPerv = true;
|
|
13330
|
+
sketchDemo.redo();
|
|
13331
|
+
if (editGraphic) this.drawLayerNames(editGraphic);
|
|
13332
|
+
this.isNextList.pop();
|
|
13185
13333
|
},
|
|
13186
13334
|
|
|
13187
13335
|
closeLayer() {
|
|
13188
|
-
if (sketchDemo
|
|
13189
|
-
this.isPerv = false
|
|
13190
|
-
this.isNextList = []
|
|
13336
|
+
if (sketchDemo.viewModel) sketchDemo.viewModel.cancel();
|
|
13337
|
+
this.isPerv = false;
|
|
13338
|
+
this.isNextList = [];
|
|
13191
13339
|
},
|
|
13192
13340
|
|
|
13193
13341
|
delDraw() {
|
|
13194
|
-
this.clearSketch()
|
|
13342
|
+
this.clearSketch();
|
|
13195
13343
|
},
|
|
13196
13344
|
|
|
13197
13345
|
changeFull() {
|
|
13198
|
-
this.$emit(
|
|
13346
|
+
this.$emit("changeFull");
|
|
13199
13347
|
},
|
|
13200
13348
|
|
|
13201
13349
|
completeSketch() {
|
|
13202
|
-
editGraphic = null
|
|
13203
|
-
sketchDemo
|
|
13350
|
+
editGraphic = null;
|
|
13351
|
+
sketchDemo.viewModel.complete();
|
|
13204
13352
|
},
|
|
13205
13353
|
|
|
13206
13354
|
clearSketch() {
|
|
13207
|
-
this.closeLayer()
|
|
13208
|
-
editGraphic = null
|
|
13209
|
-
sketchLayer
|
|
13210
|
-
sketchTextLayer
|
|
13211
|
-
layerDraw
|
|
13212
|
-
layerDrawText
|
|
13213
|
-
drawingText
|
|
13214
|
-
mapMixin_pointLayer
|
|
13355
|
+
this.closeLayer();
|
|
13356
|
+
editGraphic = null;
|
|
13357
|
+
sketchLayer.removeAll();
|
|
13358
|
+
sketchTextLayer.removeAll();
|
|
13359
|
+
layerDraw.removeAll();
|
|
13360
|
+
layerDrawText.removeAll();
|
|
13361
|
+
drawingText.removeAll();
|
|
13362
|
+
mapMixin_pointLayer.removeAll();
|
|
13215
13363
|
|
|
13216
13364
|
if (
|
|
13217
13365
|
(this.isShowPoint || this.isSearch) &&
|
|
@@ -13219,234 +13367,238 @@ const mapMixin = {
|
|
|
13219
13367
|
this.$refs.searchRef.clearSearch
|
|
13220
13368
|
) {
|
|
13221
13369
|
this.$nextTick(() => {
|
|
13222
|
-
this.$refs.searchRef.clearSearch()
|
|
13223
|
-
})
|
|
13370
|
+
this.$refs.searchRef.clearSearch();
|
|
13371
|
+
});
|
|
13224
13372
|
}
|
|
13225
13373
|
},
|
|
13226
13374
|
|
|
13227
13375
|
addGeometryLayer(graphic) {
|
|
13228
|
-
sketchLayer
|
|
13376
|
+
sketchLayer.add(graphic);
|
|
13229
13377
|
},
|
|
13230
13378
|
|
|
13231
13379
|
loadSketch() {
|
|
13232
|
-
mapMixin_pointLayer = new window.jkEsri.GraphicsLayer({ id:
|
|
13233
|
-
layerDraw = new window.jkEsri.GraphicsLayer({ id:
|
|
13234
|
-
layerDrawText = new window.jkEsri.GraphicsLayer({ id:
|
|
13235
|
-
sketchLayer = new window.jkEsri.GraphicsLayer({ id:
|
|
13380
|
+
mapMixin_pointLayer = new window.jkEsri.GraphicsLayer({ id: "pointLayer" });
|
|
13381
|
+
layerDraw = new window.jkEsri.GraphicsLayer({ id: "layerDraw" });
|
|
13382
|
+
layerDrawText = new window.jkEsri.GraphicsLayer({ id: "layerDrawText" });
|
|
13383
|
+
sketchLayer = new window.jkEsri.GraphicsLayer({ id: "sketchLayer" });
|
|
13236
13384
|
sketchTextLayer = new window.jkEsri.GraphicsLayer({
|
|
13237
|
-
id:
|
|
13238
|
-
})
|
|
13239
|
-
drawingText = new window.jkEsri.GraphicsLayer({ id:
|
|
13240
|
-
mapMixin_arcgisMap.add(mapMixin_pointLayer, 10)
|
|
13241
|
-
mapMixin_arcgisMap.add(layerDraw, 1)
|
|
13242
|
-
mapMixin_arcgisMap.add(layerDrawText, 2)
|
|
13243
|
-
mapMixin_arcgisMap.add(sketchLayer, 4)
|
|
13244
|
-
mapMixin_arcgisMap.add(sketchTextLayer, 5)
|
|
13245
|
-
mapMixin_arcgisMap.add(drawingText, 5)
|
|
13385
|
+
id: "sketchTextLayer",
|
|
13386
|
+
});
|
|
13387
|
+
drawingText = new window.jkEsri.GraphicsLayer({ id: "drawingText" });
|
|
13388
|
+
mapMixin_arcgisMap.add(mapMixin_pointLayer, 10);
|
|
13389
|
+
mapMixin_arcgisMap.add(layerDraw, 1);
|
|
13390
|
+
mapMixin_arcgisMap.add(layerDrawText, 2);
|
|
13391
|
+
mapMixin_arcgisMap.add(sketchLayer, 4);
|
|
13392
|
+
mapMixin_arcgisMap.add(sketchTextLayer, 5);
|
|
13393
|
+
mapMixin_arcgisMap.add(drawingText, 5);
|
|
13246
13394
|
sketchDemo = new window.jkEsri.SketchViewModel({
|
|
13247
13395
|
layer: sketchLayer,
|
|
13248
13396
|
view: mapMixin_arcgisView,
|
|
13249
13397
|
polylineSymbol: {
|
|
13250
|
-
type:
|
|
13251
|
-
color:
|
|
13252
|
-
width:
|
|
13253
|
-
style:
|
|
13398
|
+
type: "simple-line",
|
|
13399
|
+
color: "#fff",
|
|
13400
|
+
width: "4",
|
|
13401
|
+
style: "dash",
|
|
13254
13402
|
},
|
|
13255
13403
|
polygonSymbol: {
|
|
13256
|
-
type:
|
|
13257
|
-
color:
|
|
13258
|
-
style:
|
|
13404
|
+
type: "simple-fill",
|
|
13405
|
+
color: "rgba(0, 45, 99,0.01)",
|
|
13406
|
+
style: "solid",
|
|
13259
13407
|
outline: {
|
|
13260
|
-
color:
|
|
13261
|
-
width: 2
|
|
13262
|
-
}
|
|
13263
|
-
}
|
|
13264
|
-
})
|
|
13265
|
-
sketchDemo.on(
|
|
13266
|
-
if (event.graphics
|
|
13267
|
-
this.drawIngArea = 0
|
|
13268
|
-
editGraphic = null
|
|
13269
|
-
this.drawcomplete(event)
|
|
13270
|
-
})
|
|
13271
|
-
sketchDemo.on(
|
|
13272
|
-
if (event.graphics
|
|
13273
|
-
this.drawLayerNames(event.graphics[0])
|
|
13408
|
+
color: "white",
|
|
13409
|
+
width: 2,
|
|
13410
|
+
},
|
|
13411
|
+
},
|
|
13412
|
+
});
|
|
13413
|
+
sketchDemo.on("delete", (event) => {
|
|
13414
|
+
if (event.graphics.length > 0) event.graphic = event.graphics[0];
|
|
13415
|
+
this.drawIngArea = 0;
|
|
13416
|
+
editGraphic = null;
|
|
13417
|
+
this.drawcomplete(event);
|
|
13418
|
+
});
|
|
13419
|
+
sketchDemo.on("update", (event) => {
|
|
13420
|
+
if (event.graphics[0]) {
|
|
13421
|
+
this.drawLayerNames(event.graphics[0]);
|
|
13274
13422
|
}
|
|
13275
|
-
if (event.state ===
|
|
13276
|
-
drawEnd = 0
|
|
13277
|
-
event.graphic = event.graphics[0]
|
|
13423
|
+
if (event.state === "start") {
|
|
13424
|
+
drawEnd = 0;
|
|
13425
|
+
event.graphic = event.graphics[0];
|
|
13278
13426
|
if (event.graphic && !event.graphic.attributes) {
|
|
13279
13427
|
const baseAttr = {
|
|
13280
13428
|
typeId: this.uuidGenerator(),
|
|
13281
|
-
name:
|
|
13282
|
-
describe:
|
|
13429
|
+
name: "",
|
|
13430
|
+
describe: "",
|
|
13283
13431
|
area: 0,
|
|
13284
|
-
rings: []
|
|
13285
|
-
}
|
|
13286
|
-
if (event.graphic.symbol.type ===
|
|
13432
|
+
rings: [],
|
|
13433
|
+
};
|
|
13434
|
+
if (event.graphic.symbol.type === "simple-fill") {
|
|
13287
13435
|
event.graphic.attributes = {
|
|
13288
13436
|
...baseAttr,
|
|
13289
|
-
type:
|
|
13290
|
-
color:
|
|
13437
|
+
type: "polygon",
|
|
13438
|
+
color: "#cef5ff",
|
|
13291
13439
|
opacity: 20,
|
|
13292
13440
|
outline: {
|
|
13293
13441
|
opacity: 100,
|
|
13294
|
-
color:
|
|
13442
|
+
color: "#0ccfff",
|
|
13295
13443
|
width: 2,
|
|
13296
|
-
style:
|
|
13297
|
-
}
|
|
13298
|
-
}
|
|
13299
|
-
} else if (event.graphic.symbol.type ===
|
|
13444
|
+
style: "solid",
|
|
13445
|
+
},
|
|
13446
|
+
};
|
|
13447
|
+
} else if (event.graphic.symbol.type === "simple-line") {
|
|
13300
13448
|
event.graphic.attributes = {
|
|
13301
13449
|
...baseAttr,
|
|
13302
|
-
type:
|
|
13450
|
+
type: "polyline",
|
|
13303
13451
|
outline: {
|
|
13304
13452
|
opacity: 100,
|
|
13305
|
-
color:
|
|
13453
|
+
color: "#0ccfff",
|
|
13306
13454
|
width: 2,
|
|
13307
|
-
style:
|
|
13308
|
-
}
|
|
13309
|
-
}
|
|
13455
|
+
style: "solid",
|
|
13456
|
+
},
|
|
13457
|
+
};
|
|
13310
13458
|
} else {
|
|
13311
13459
|
event.graphic.attributes = {
|
|
13312
13460
|
...baseAttr,
|
|
13313
|
-
type:
|
|
13314
|
-
}
|
|
13461
|
+
type: "point",
|
|
13462
|
+
};
|
|
13315
13463
|
}
|
|
13316
13464
|
}
|
|
13317
|
-
} else if (event.state ===
|
|
13318
|
-
this.isPerv = true
|
|
13319
|
-
} else if (event.state ===
|
|
13320
|
-
this.isPerv = false
|
|
13321
|
-
this.isNextList = []
|
|
13322
|
-
drawEnd = 1
|
|
13323
|
-
this.drawIngArea = 0
|
|
13324
|
-
editGraphic = null
|
|
13325
|
-
event.graphic = event.graphics[0]
|
|
13326
|
-
this.drawcomplete(event)
|
|
13465
|
+
} else if (event.state === "active") {
|
|
13466
|
+
this.isPerv = true;
|
|
13467
|
+
} else if (event.state === "complete") {
|
|
13468
|
+
this.isPerv = false;
|
|
13469
|
+
this.isNextList = [];
|
|
13470
|
+
drawEnd = 1;
|
|
13471
|
+
this.drawIngArea = 0;
|
|
13472
|
+
editGraphic = null;
|
|
13473
|
+
event.graphic = event.graphics[0];
|
|
13474
|
+
this.drawcomplete(event);
|
|
13327
13475
|
}
|
|
13328
|
-
})
|
|
13476
|
+
});
|
|
13329
13477
|
},
|
|
13330
13478
|
|
|
13331
13479
|
drawLayerNames(event) {
|
|
13332
|
-
if (
|
|
13333
|
-
|
|
13334
|
-
|
|
13335
|
-
|
|
13336
|
-
|
|
13337
|
-
|
|
13480
|
+
if (
|
|
13481
|
+
event.geometry.type === "polygon" &&
|
|
13482
|
+
event.geometry.rings.length > 0
|
|
13483
|
+
) {
|
|
13484
|
+
this.drawIngArea = 0;
|
|
13485
|
+
editGraphic = event;
|
|
13486
|
+
const lastRing = event.geometry.rings[event.geometry.rings.length - 1];
|
|
13487
|
+
const isDraw = lastRing.length > 2;
|
|
13488
|
+
const draw_Area = getArea(event.geometry);
|
|
13338
13489
|
if (isDraw && draw_Area && Number(draw_Area) > 0) {
|
|
13339
|
-
this.drawIngArea = Number(draw_Area).toFixed(2)
|
|
13490
|
+
this.drawIngArea = Number(draw_Area).toFixed(2);
|
|
13340
13491
|
}
|
|
13341
|
-
if (event.attributes
|
|
13492
|
+
if (event.attributes.uuid && sketchTextLayer.graphics.items) {
|
|
13342
13493
|
const textItem = sketchTextLayer.graphics.items.find(
|
|
13343
|
-
(item) => item.attributes
|
|
13344
|
-
)
|
|
13494
|
+
(item) => item.attributes.uuid === event.attributes.uuid
|
|
13495
|
+
);
|
|
13345
13496
|
if (textItem) {
|
|
13346
|
-
textItem.geometry = event.geometry.centroid
|
|
13497
|
+
textItem.geometry = event.geometry.centroid;
|
|
13347
13498
|
}
|
|
13348
13499
|
}
|
|
13349
13500
|
}
|
|
13350
13501
|
},
|
|
13351
13502
|
|
|
13352
13503
|
async retuanGraphics() {
|
|
13353
|
-
let area = 0
|
|
13504
|
+
let area = 0;
|
|
13354
13505
|
let form = {
|
|
13355
13506
|
drawEnd,
|
|
13356
|
-
area:
|
|
13357
|
-
mArea:
|
|
13358
|
-
hectareArea:
|
|
13359
|
-
latitude:
|
|
13360
|
-
longitude:
|
|
13361
|
-
ringsList: []
|
|
13362
|
-
}
|
|
13507
|
+
area: "",
|
|
13508
|
+
mArea: "",
|
|
13509
|
+
hectareArea: "",
|
|
13510
|
+
latitude: "",
|
|
13511
|
+
longitude: "",
|
|
13512
|
+
ringsList: [],
|
|
13513
|
+
};
|
|
13363
13514
|
|
|
13364
|
-
if (sketchLayer
|
|
13515
|
+
if (sketchLayer.graphics.items.length > 0) {
|
|
13365
13516
|
for (const item of sketchLayer.graphics.items) {
|
|
13366
|
-
const geomType = this.judgeLayerType(item.geometry.type)
|
|
13367
|
-
let geometry = arcGISTranformGeoJson(item)
|
|
13368
|
-
if (geomType ===
|
|
13369
|
-
form.longitude = item.geometry.longitude
|
|
13370
|
-
form.latitude = item.geometry.latitude
|
|
13517
|
+
const geomType = this.judgeLayerType(item.geometry.type);
|
|
13518
|
+
let geometry = arcGISTranformGeoJson(item);
|
|
13519
|
+
if (geomType === "point") {
|
|
13520
|
+
form.longitude = item.geometry.longitude;
|
|
13521
|
+
form.latitude = item.geometry.latitude;
|
|
13371
13522
|
form.ringsList.push({
|
|
13372
|
-
type:
|
|
13373
|
-
geometry
|
|
13374
|
-
})
|
|
13375
|
-
} else if (geomType ===
|
|
13523
|
+
type: "Point",
|
|
13524
|
+
geometry,
|
|
13525
|
+
});
|
|
13526
|
+
} else if (geomType === "polyline") {
|
|
13376
13527
|
form.ringsList.push({
|
|
13377
|
-
type:
|
|
13528
|
+
type: "Polyline",
|
|
13378
13529
|
geometry,
|
|
13379
|
-
latitude:
|
|
13380
|
-
longitude:
|
|
13381
|
-
area: 0
|
|
13382
|
-
})
|
|
13383
|
-
} else if (geomType ===
|
|
13384
|
-
const itemArea = getArea(item.geometry)
|
|
13385
|
-
|
|
13386
|
-
let polygonArea = 0
|
|
13387
|
-
if (itemArea && Number(itemArea))
|
|
13388
|
-
|
|
13389
|
-
|
|
13390
|
-
form.
|
|
13530
|
+
latitude: "",
|
|
13531
|
+
longitude: "",
|
|
13532
|
+
area: 0,
|
|
13533
|
+
});
|
|
13534
|
+
} else if (geomType === "polygon") {
|
|
13535
|
+
const itemArea = getArea(item.geometry);
|
|
13536
|
+
|
|
13537
|
+
let polygonArea = 0;
|
|
13538
|
+
if (itemArea && Number(itemArea))
|
|
13539
|
+
polygonArea = Math.abs(Number(itemArea).toFixed(2));
|
|
13540
|
+
area += polygonArea;
|
|
13541
|
+
form.longitude = item.geometry.centroid.longitude;
|
|
13542
|
+
form.latitude = item.geometry.centroid.latitude;
|
|
13391
13543
|
form.ringsList.push({
|
|
13392
|
-
type:
|
|
13544
|
+
type: "polygon",
|
|
13393
13545
|
geometry,
|
|
13394
13546
|
longitude: item.geometry.centroid.longitude,
|
|
13395
13547
|
latitude: item.geometry.centroid.latitude,
|
|
13396
|
-
area: polygonArea
|
|
13397
|
-
})
|
|
13548
|
+
area: polygonArea,
|
|
13549
|
+
});
|
|
13398
13550
|
}
|
|
13399
13551
|
}
|
|
13400
13552
|
}
|
|
13401
13553
|
if (area > 0) {
|
|
13402
|
-
form.area = area
|
|
13403
|
-
form.mArea = Number(area) * 0.0015 // 亩
|
|
13404
|
-
form.hectareArea = Number(area) * 0.0001 // 公顷
|
|
13554
|
+
form.area = area;
|
|
13555
|
+
form.mArea = Number(area) * 0.0015; // 亩
|
|
13556
|
+
form.hectareArea = Number(area) * 0.0001; // 公顷
|
|
13405
13557
|
}
|
|
13406
|
-
console.log(
|
|
13407
|
-
return form
|
|
13558
|
+
console.log("formatMapData00", form, sketchLayer.graphics.items);
|
|
13559
|
+
return form;
|
|
13408
13560
|
},
|
|
13409
13561
|
async drawcomplete(event) {
|
|
13410
|
-
if (event.type ==
|
|
13411
|
-
if (event.graphic
|
|
13562
|
+
if (event.type == "delete") {
|
|
13563
|
+
if (event.graphic.attributes.uuid && sketchTextLayer.graphics.items) {
|
|
13412
13564
|
const idx = sketchTextLayer.graphics.items.findIndex(
|
|
13413
|
-
(item) => item.attributes
|
|
13414
|
-
)
|
|
13565
|
+
(item) => item.attributes.uuid === event.graphic.attributes.uuid
|
|
13566
|
+
);
|
|
13415
13567
|
if (idx >= 0) {
|
|
13416
|
-
sketchTextLayer.remove(sketchTextLayer.graphics.items[idx])
|
|
13568
|
+
sketchTextLayer.remove(sketchTextLayer.graphics.items[idx]);
|
|
13417
13569
|
}
|
|
13418
13570
|
}
|
|
13419
13571
|
}
|
|
13420
|
-
const form = await this.retuanGraphics()
|
|
13421
|
-
this.$emit(
|
|
13572
|
+
const form = await this.retuanGraphics();
|
|
13573
|
+
this.$emit("drawcomplete", form);
|
|
13422
13574
|
},
|
|
13423
13575
|
|
|
13424
13576
|
judgeLayerType(type) {
|
|
13425
|
-
if (!type) return
|
|
13426
|
-
if (type.includes(
|
|
13427
|
-
if (type.includes(
|
|
13428
|
-
if (type.includes(
|
|
13577
|
+
if (!type) return;
|
|
13578
|
+
if (type.includes("oint")) return "point";
|
|
13579
|
+
if (type.includes("olygon")) return "polygon";
|
|
13580
|
+
if (type.includes("ine")) return "polyline";
|
|
13429
13581
|
},
|
|
13430
|
-
batchDraw(layers, type =
|
|
13431
|
-
let layer = type ==
|
|
13432
|
-
let graphics = []
|
|
13433
|
-
if (layers
|
|
13582
|
+
batchDraw(layers, type = "edit") {
|
|
13583
|
+
let layer = type == "edit" ? sketchLayer : layerDraw;
|
|
13584
|
+
let graphics = [];
|
|
13585
|
+
if (layers.length > 0) {
|
|
13434
13586
|
for (const item of layers) {
|
|
13435
|
-
let graphic = drawLayer_drawLayer(item, item.drawType)
|
|
13436
|
-
if (graphics) graphics.push(graphic)
|
|
13587
|
+
let graphic = drawLayer_drawLayer(item, item.drawType);
|
|
13588
|
+
if (graphics) graphics.push(graphic);
|
|
13437
13589
|
}
|
|
13438
13590
|
if (graphics.length > 0) {
|
|
13439
|
-
layer.addMany(graphics)
|
|
13591
|
+
layer.addMany(graphics);
|
|
13440
13592
|
}
|
|
13441
|
-
goToMap(layer)
|
|
13593
|
+
goToMap(layer);
|
|
13442
13594
|
}
|
|
13443
|
-
}
|
|
13595
|
+
},
|
|
13444
13596
|
},
|
|
13445
13597
|
beforeUnmount() {
|
|
13446
|
-
this.clearSketch()
|
|
13447
|
-
this.cleanupMapEvents()
|
|
13448
|
-
}
|
|
13449
|
-
}
|
|
13598
|
+
this.clearSketch();
|
|
13599
|
+
this.cleanupMapEvents();
|
|
13600
|
+
},
|
|
13601
|
+
};
|
|
13450
13602
|
|
|
13451
13603
|
;// ./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/vue2/augustineMap.vue?vue&type=script&lang=js
|
|
13452
13604
|
|
|
@@ -13510,161 +13662,175 @@ var mapListMixin_arcgisMap = null,
|
|
|
13510
13662
|
mapListMixin_arcgisView = null,
|
|
13511
13663
|
mapListMixin_currentAbortController,
|
|
13512
13664
|
mapListMixin_isClickLocked = false,
|
|
13513
|
-
mapListMixin_pointLayer = null
|
|
13665
|
+
mapListMixin_pointLayer = null;
|
|
13514
13666
|
const mapListMixin = {
|
|
13515
13667
|
components: { loadingBox: loading },
|
|
13516
13668
|
props: {
|
|
13517
13669
|
mapParams: {
|
|
13518
13670
|
type: Object,
|
|
13519
|
-
default: map_config
|
|
13671
|
+
default: map_config,
|
|
13520
13672
|
},
|
|
13521
13673
|
|
|
13522
13674
|
load: {
|
|
13523
13675
|
type: Function,
|
|
13524
|
-
default: null
|
|
13676
|
+
default: null,
|
|
13525
13677
|
},
|
|
13526
13678
|
defaultCenter: {
|
|
13527
13679
|
type: Array,
|
|
13528
13680
|
default: () => {
|
|
13529
|
-
return []
|
|
13530
|
-
}
|
|
13681
|
+
return [];
|
|
13682
|
+
},
|
|
13531
13683
|
},
|
|
13532
13684
|
disabled: {
|
|
13533
13685
|
type: Boolean,
|
|
13534
|
-
default: false
|
|
13535
|
-
}
|
|
13686
|
+
default: false,
|
|
13687
|
+
},
|
|
13536
13688
|
},
|
|
13537
13689
|
computed: {
|
|
13538
|
-
mapCenter() {}
|
|
13690
|
+
mapCenter() {},
|
|
13539
13691
|
},
|
|
13540
13692
|
data() {
|
|
13541
13693
|
return {
|
|
13542
|
-
mapId:
|
|
13694
|
+
mapId: "map" + Math.round(Math.random() * 10000),
|
|
13543
13695
|
isLoading: true, //地图加载loading
|
|
13544
13696
|
center: [],
|
|
13545
|
-
address:
|
|
13697
|
+
address: "",
|
|
13546
13698
|
pointCenter: [113.536308532987, 23.3450945634734],
|
|
13547
|
-
pointsList: []
|
|
13548
|
-
}
|
|
13699
|
+
pointsList: [],
|
|
13700
|
+
};
|
|
13549
13701
|
},
|
|
13550
13702
|
methods: {
|
|
13551
13703
|
/**
|
|
13552
13704
|
* 返回地图容器
|
|
13553
13705
|
*/
|
|
13554
13706
|
getMap() {
|
|
13555
|
-
return mapListMixin_arcgisMap
|
|
13707
|
+
return mapListMixin_arcgisMap;
|
|
13556
13708
|
},
|
|
13557
13709
|
/**
|
|
13558
13710
|
* 返回地图容器
|
|
13559
13711
|
*/
|
|
13560
13712
|
getView() {
|
|
13561
|
-
return mapListMixin_arcgisView
|
|
13713
|
+
return mapListMixin_arcgisView;
|
|
13562
13714
|
},
|
|
13563
13715
|
setupMapEvents(view) {
|
|
13564
13716
|
// 点击
|
|
13565
|
-
this._clickHandler = view.on(
|
|
13717
|
+
this._clickHandler = view.on(
|
|
13718
|
+
"click",
|
|
13719
|
+
this.debounce(this.handleMapClick, 300)
|
|
13720
|
+
);
|
|
13566
13721
|
// 悬浮
|
|
13567
|
-
this._hoverHandler = view.on(
|
|
13722
|
+
this._hoverHandler = view.on(
|
|
13723
|
+
"pointer-move",
|
|
13724
|
+
this.debounce(this.handleMapHover, 80)
|
|
13725
|
+
);
|
|
13568
13726
|
},
|
|
13569
13727
|
changeGraphic(data) {
|
|
13570
13728
|
if (mapListMixin_pointLayer && mapListMixin_pointLayer.graphics && mapListMixin_pointLayer.graphics._items) {
|
|
13571
13729
|
mapListMixin_pointLayer.graphics._items.map((item) => {
|
|
13572
13730
|
let url = item.attributes.url,
|
|
13573
13731
|
width = item.attributes.width,
|
|
13574
|
-
height = item.attributes.height
|
|
13575
|
-
if (
|
|
13576
|
-
|
|
13577
|
-
|
|
13578
|
-
|
|
13732
|
+
height = item.attributes.height;
|
|
13733
|
+
if (
|
|
13734
|
+
data &&
|
|
13735
|
+
item &&
|
|
13736
|
+
item.attributes &&
|
|
13737
|
+
item.attributes.name == data.name
|
|
13738
|
+
) {
|
|
13739
|
+
url = data.activeUrl ? data.activeUrl : data.url;
|
|
13740
|
+
width = data.width + 5;
|
|
13741
|
+
height = (data.height * width) / data.width;
|
|
13579
13742
|
}
|
|
13580
13743
|
item.symbol = getPictureSymbol({
|
|
13581
13744
|
url: url,
|
|
13582
13745
|
width: width,
|
|
13583
|
-
height: height
|
|
13584
|
-
})
|
|
13585
|
-
return item
|
|
13586
|
-
})
|
|
13746
|
+
height: height,
|
|
13747
|
+
});
|
|
13748
|
+
return item;
|
|
13749
|
+
});
|
|
13587
13750
|
}
|
|
13588
13751
|
},
|
|
13589
13752
|
handleMapClick(e) {
|
|
13590
13753
|
// 处理点击逻辑
|
|
13591
|
-
if (mapListMixin_isClickLocked) return
|
|
13754
|
+
if (mapListMixin_isClickLocked) return;
|
|
13592
13755
|
// 取消上一次未完成的 hitTest
|
|
13593
13756
|
if (mapListMixin_currentAbortController) {
|
|
13594
|
-
mapListMixin_currentAbortController.abort()
|
|
13757
|
+
mapListMixin_currentAbortController.abort();
|
|
13595
13758
|
}
|
|
13596
|
-
mapListMixin_currentAbortController = new AbortController()
|
|
13597
|
-
mapListMixin_isClickLocked = true
|
|
13759
|
+
mapListMixin_currentAbortController = new AbortController();
|
|
13760
|
+
mapListMixin_isClickLocked = true;
|
|
13598
13761
|
const eventData = {
|
|
13599
13762
|
mapPoint: e.mapPoint,
|
|
13600
|
-
type:
|
|
13601
|
-
}
|
|
13602
|
-
const hitTestPromise = mapListMixin_arcgisView.hitTest(e) // 注意:ArcGIS hitTest 不支持 signal,此为未来兼容
|
|
13763
|
+
type: "click",
|
|
13764
|
+
};
|
|
13765
|
+
const hitTestPromise = mapListMixin_arcgisView.hitTest(e); // 注意:ArcGIS hitTest 不支持 signal,此为未来兼容
|
|
13603
13766
|
hitTestPromise
|
|
13604
13767
|
.then((hitResult) => {
|
|
13605
|
-
if (mapListMixin_currentAbortController.signal.aborted) return // 已取消
|
|
13606
|
-
eventData.event = hitResult
|
|
13768
|
+
if (mapListMixin_currentAbortController.signal.aborted) return; // 已取消
|
|
13769
|
+
eventData.event = hitResult;
|
|
13607
13770
|
if (hitResult && hitResult.results && hitResult.results.length > 0) {
|
|
13608
13771
|
const graphics = hitResult.results.filter(
|
|
13609
|
-
(item) =>
|
|
13610
|
-
|
|
13772
|
+
(item) =>
|
|
13773
|
+
item.layer &&
|
|
13774
|
+
item.layer.id &&
|
|
13775
|
+
item.layer.id.indexOf("pointLayer") > -1
|
|
13776
|
+
);
|
|
13611
13777
|
if (graphics && graphics.length > 0) {
|
|
13612
13778
|
const graphic = graphics[0].graphic,
|
|
13613
|
-
attributes = graphic.attributes
|
|
13614
|
-
this.changeGraphic(attributes)
|
|
13779
|
+
attributes = graphic.attributes;
|
|
13780
|
+
this.changeGraphic(attributes);
|
|
13615
13781
|
}
|
|
13616
|
-
console.log(
|
|
13782
|
+
console.log("eventData", hitResult.results, graphics);
|
|
13617
13783
|
} else {
|
|
13618
|
-
this.changeGraphic(null)
|
|
13784
|
+
this.changeGraphic(null);
|
|
13619
13785
|
}
|
|
13620
|
-
this.$emit(
|
|
13786
|
+
this.$emit("mapEventClick", eventData);
|
|
13621
13787
|
})
|
|
13622
13788
|
.catch((err) => {
|
|
13623
|
-
if (err.name ===
|
|
13624
|
-
console.warn(
|
|
13789
|
+
if (err.name === "AbortError") return;
|
|
13790
|
+
console.warn("hitTest error", err);
|
|
13625
13791
|
})
|
|
13626
13792
|
.finally(() => {
|
|
13627
13793
|
setTimeout(() => {
|
|
13628
|
-
mapListMixin_isClickLocked = false
|
|
13629
|
-
mapListMixin_currentAbortController = null
|
|
13630
|
-
}, 300)
|
|
13631
|
-
})
|
|
13794
|
+
mapListMixin_isClickLocked = false;
|
|
13795
|
+
mapListMixin_currentAbortController = null;
|
|
13796
|
+
}, 300);
|
|
13797
|
+
});
|
|
13632
13798
|
},
|
|
13633
13799
|
|
|
13634
13800
|
async handleMapHover(event) {
|
|
13635
13801
|
// 处理 hover 逻辑
|
|
13636
|
-
const hitData = await mapListMixin_arcgisView.hitTest(event)
|
|
13802
|
+
const hitData = await mapListMixin_arcgisView.hitTest(event);
|
|
13637
13803
|
if (hitData && hitData.results && hitData.screenPoint) {
|
|
13638
|
-
mapListMixin_arcgisView.container.style.cursor =
|
|
13639
|
-
this.$emit(
|
|
13640
|
-
} else mapListMixin_arcgisView.container.style.cursor =
|
|
13804
|
+
mapListMixin_arcgisView.container.style.cursor = "pointer";
|
|
13805
|
+
this.$emit("mapEventMouse", hitData);
|
|
13806
|
+
} else mapListMixin_arcgisView.container.style.cursor = "default";
|
|
13641
13807
|
},
|
|
13642
13808
|
|
|
13643
13809
|
debounce(fn, delay) {
|
|
13644
|
-
let timer
|
|
13810
|
+
let timer;
|
|
13645
13811
|
return (...args) => {
|
|
13646
|
-
clearTimeout(timer)
|
|
13647
|
-
timer = setTimeout(() => fn.apply(this, args), delay)
|
|
13648
|
-
}
|
|
13812
|
+
clearTimeout(timer);
|
|
13813
|
+
timer = setTimeout(() => fn.apply(this, args), delay);
|
|
13814
|
+
};
|
|
13649
13815
|
},
|
|
13650
13816
|
|
|
13651
13817
|
cleanupMapEvents() {
|
|
13652
|
-
this._clickHandler
|
|
13653
|
-
this._hoverHandler
|
|
13818
|
+
this._clickHandler.remove();
|
|
13819
|
+
this._hoverHandler.remove();
|
|
13654
13820
|
},
|
|
13655
13821
|
/**
|
|
13656
13822
|
* 地图加载完成
|
|
13657
13823
|
*/
|
|
13658
13824
|
loadEdMap(data) {
|
|
13659
|
-
mapListMixin_arcgisMap = data.map
|
|
13660
|
-
mapListMixin_arcgisView = data.view
|
|
13825
|
+
mapListMixin_arcgisMap = data.map;
|
|
13826
|
+
mapListMixin_arcgisView = data.view;
|
|
13661
13827
|
setTimeout(() => {
|
|
13662
|
-
mapListMixin_pointLayer = new window.jkEsri.GraphicsLayer({ id:
|
|
13663
|
-
mapListMixin_arcgisMap.add(mapListMixin_pointLayer, 10)
|
|
13664
|
-
this.drawPoints()
|
|
13665
|
-
this.setupMapEvents(data.view)
|
|
13666
|
-
this.$emit(
|
|
13667
|
-
}, 500)
|
|
13828
|
+
mapListMixin_pointLayer = new window.jkEsri.GraphicsLayer({ id: "pointLayer" });
|
|
13829
|
+
mapListMixin_arcgisMap.add(mapListMixin_pointLayer, 10);
|
|
13830
|
+
this.drawPoints();
|
|
13831
|
+
this.setupMapEvents(data.view);
|
|
13832
|
+
this.$emit("loadEdMap", data);
|
|
13833
|
+
}, 500);
|
|
13668
13834
|
},
|
|
13669
13835
|
moveCenterPoint() {
|
|
13670
13836
|
if (
|
|
@@ -13673,16 +13839,16 @@ const mapListMixin = {
|
|
|
13673
13839
|
this.defaultCenter[0] &&
|
|
13674
13840
|
this.defaultCenter[1]
|
|
13675
13841
|
) {
|
|
13676
|
-
goToMap(this.defaultCenter)
|
|
13677
|
-
} else goToMap(this.pointCenter)
|
|
13842
|
+
goToMap(this.defaultCenter);
|
|
13843
|
+
} else goToMap(this.pointCenter);
|
|
13678
13844
|
},
|
|
13679
13845
|
drawPoints() {
|
|
13680
13846
|
if (this.pointsList && this.pointsList.length > 0) {
|
|
13681
13847
|
const validGraphics = this.pointsList
|
|
13682
13848
|
.map((item) => createArcPoint(item))
|
|
13683
|
-
.filter((g) => g !== null) // 过滤掉失败项
|
|
13684
|
-
mapListMixin_pointLayer.addMany(validGraphics)
|
|
13685
|
-
goToMap(mapListMixin_pointLayer.graphics.items)
|
|
13849
|
+
.filter((g) => g !== null); // 过滤掉失败项
|
|
13850
|
+
mapListMixin_pointLayer.addMany(validGraphics);
|
|
13851
|
+
goToMap(mapListMixin_pointLayer.graphics.items);
|
|
13686
13852
|
}
|
|
13687
13853
|
},
|
|
13688
13854
|
/**
|
|
@@ -13690,18 +13856,18 @@ const mapListMixin = {
|
|
|
13690
13856
|
* @param {*} data
|
|
13691
13857
|
*/
|
|
13692
13858
|
initPoint(data = []) {
|
|
13693
|
-
this.pointsList = data || []
|
|
13859
|
+
this.pointsList = data || [];
|
|
13694
13860
|
if (mapListMixin_arcgisMap && mapListMixin_arcgisView) {
|
|
13695
|
-
if (mapListMixin_pointLayer) mapListMixin_pointLayer.removeAll()
|
|
13696
|
-
this.drawPoints()
|
|
13861
|
+
if (mapListMixin_pointLayer) mapListMixin_pointLayer.removeAll();
|
|
13862
|
+
this.drawPoints();
|
|
13697
13863
|
}
|
|
13698
|
-
}
|
|
13864
|
+
},
|
|
13699
13865
|
},
|
|
13700
13866
|
beforeUnmount() {
|
|
13701
|
-
this._clickHandler
|
|
13702
|
-
this._hoverHandler
|
|
13703
|
-
}
|
|
13704
|
-
}
|
|
13867
|
+
this._clickHandler.remove();
|
|
13868
|
+
this._hoverHandler.remove();
|
|
13869
|
+
},
|
|
13870
|
+
};
|
|
13705
13871
|
|
|
13706
13872
|
;// ./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/vue2/mapList.vue?vue&type=script&lang=js
|
|
13707
13873
|
|