更新地图样式;调整时间轴,新增前进/后退一天按钮;新增爆管分析页面
This commit is contained in:
@@ -29,6 +29,7 @@ import { calculateClassification } from "@utils/breaks_classification";
|
||||
import { parseColor } from "@utils/parseColor";
|
||||
import { VectorTile } from "ol";
|
||||
import { useNotification } from "@refinedev/core";
|
||||
import { config } from "@/config/config";
|
||||
|
||||
interface StyleConfig {
|
||||
property: string;
|
||||
@@ -64,6 +65,9 @@ const SINGLE_COLOR_PALETTES = [
|
||||
{
|
||||
color: "rgba(51, 153, 204, 1)",
|
||||
},
|
||||
{
|
||||
color: "rgba(255, 138, 92, 1)",
|
||||
},
|
||||
{
|
||||
color: "rgba(204, 51, 51, 1)",
|
||||
},
|
||||
@@ -405,6 +409,25 @@ const StyleEditorPanel: React.FC = () => {
|
||||
conditions.push(dimensions[i]);
|
||||
}
|
||||
conditions.push(dimensions[dimensions.length - 1]);
|
||||
console.log("生成的尺寸条件表达式:", conditions);
|
||||
return conditions;
|
||||
};
|
||||
const generateDimensionPointConditions = (property: string): any[] => {
|
||||
const conditions: any[] = ["case"];
|
||||
for (let i = 0; i < breaks.length; i++) {
|
||||
conditions.push(["<=", ["get", property], breaks[i]]);
|
||||
conditions.push([
|
||||
"interpolate",
|
||||
["linear"],
|
||||
["zoom"],
|
||||
12,
|
||||
1, // 使用配置的最小尺寸
|
||||
24,
|
||||
dimensions[i],
|
||||
]);
|
||||
}
|
||||
conditions.push(dimensions[dimensions.length - 1]);
|
||||
console.log("生成的点尺寸条件表达式:", conditions);
|
||||
return conditions;
|
||||
};
|
||||
// 创建基于 breaks 的动态 FlatStyle
|
||||
@@ -422,7 +445,7 @@ const StyleEditorPanel: React.FC = () => {
|
||||
dynamicStyle["circle-fill-color"] = generateColorConditions(
|
||||
styleConfig.property
|
||||
);
|
||||
dynamicStyle["circle-radius"] = generateDimensionConditions(
|
||||
dynamicStyle["circle-radius"] = generateDimensionPointConditions(
|
||||
styleConfig.property
|
||||
);
|
||||
dynamicStyle["circle-stroke-color"] = generateColorConditions(
|
||||
@@ -456,21 +479,7 @@ const StyleEditorPanel: React.FC = () => {
|
||||
const resetStyle = useCallback(() => {
|
||||
if (!selectedRenderLayer) return;
|
||||
// 重置 WebGL 图层样式
|
||||
const defaultFlatStyle: FlatStyleLike = {
|
||||
"stroke-width": 3,
|
||||
"stroke-color": "rgba(51, 153, 204, 0.9)",
|
||||
"circle-fill-color": "rgba(255,255,255,0.4)",
|
||||
"circle-stroke-color": "rgba(255,255,255,0.9)",
|
||||
"circle-radius": [
|
||||
"interpolate",
|
||||
["linear"],
|
||||
["zoom"],
|
||||
12,
|
||||
1, // 在缩放级别 12 时,圆形半径为 1px
|
||||
24,
|
||||
12, // 在缩放级别 24 时,圆形半径为 12px
|
||||
],
|
||||
};
|
||||
const defaultFlatStyle: FlatStyleLike = config.mapDefaultStyle;
|
||||
selectedRenderLayer.setStyle(defaultFlatStyle);
|
||||
|
||||
// 删除对应图层的样式状态,从而移除图例显示
|
||||
@@ -531,6 +540,7 @@ const StyleEditorPanel: React.FC = () => {
|
||||
const [tileLoadListeners, setTileLoadListeners] = useState<
|
||||
Map<VectorTileSource, (event: any) => void>
|
||||
>(new Map());
|
||||
|
||||
const attachVectorTileSourceLoadedEvent = (
|
||||
layerId: string,
|
||||
property: string,
|
||||
|
||||
Reference in New Issue
Block a user