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