73 lines
1.9 KiB
TypeScript
73 lines
1.9 KiB
TypeScript
/** 조사결과·침수이력의 지도 스타일. 기존 값과 처리 순서를 유지한다. */
|
|
import Fill from "ol/style/Fill.js";
|
|
import Icon from "ol/style/Icon.js";
|
|
import Stroke from "ol/style/Stroke.js";
|
|
import Style from "ol/style/Style.js";
|
|
import Text from "ol/style/Text.js";
|
|
import {
|
|
EXMN_GRADE_COLORS,
|
|
EXMN_RESULT_MANHOLE_ICON_SRC,
|
|
} from "../model/map-constants";
|
|
|
|
export const getExmnGradeColor = (feature: any) => {
|
|
const grade = Number(feature?.get?.("structuralGrade") ?? 0);
|
|
return EXMN_GRADE_COLORS[grade] ?? "#2563eb";
|
|
};
|
|
|
|
export const createExmnPipeStyle = (feature: any) =>
|
|
new Style({
|
|
stroke: new Stroke({
|
|
color: getExmnGradeColor(feature),
|
|
width: 4,
|
|
}),
|
|
});
|
|
|
|
// 레이어 트리 범례와 지도 피처가 동일한 기존 맨홀 형태의 보라색 심볼을 사용한다.
|
|
export const createExmnManholeStyle = () =>
|
|
new Style({
|
|
image: new Icon({
|
|
src: EXMN_RESULT_MANHOLE_ICON_SRC,
|
|
anchor: [0.5, 0.5],
|
|
anchorXUnits: "fraction",
|
|
anchorYUnits: "fraction",
|
|
}),
|
|
});
|
|
|
|
export const createFldngHstryAreaStyle = (label: string) =>
|
|
new Style({
|
|
fill: new Fill({
|
|
color: "rgba(30, 136, 229, 0.16)",
|
|
}),
|
|
stroke: new Stroke({
|
|
color: "rgba(30, 136, 229, 0.95)",
|
|
width: 3,
|
|
}),
|
|
text: new Text({
|
|
text: label,
|
|
font: "700 12px sans-serif",
|
|
fill: new Fill({ color: "#ffffff" }),
|
|
backgroundFill: new Fill({ color: "rgba(15, 23, 42, 0.88)" }),
|
|
padding: [4, 7, 4, 7],
|
|
overflow: true,
|
|
}),
|
|
zIndex: 9994,
|
|
});
|
|
|
|
export const createFldngHstryDepthStyle = (label: string, color: string) =>
|
|
new Style({
|
|
fill: new Fill({
|
|
color,
|
|
}),
|
|
stroke: new Stroke({
|
|
color: "rgba(71, 85, 105, 0.72)",
|
|
width: 1.4,
|
|
}),
|
|
text: new Text({
|
|
text: label,
|
|
font: "700 11px sans-serif",
|
|
fill: new Fill({ color: "#0f172a" }),
|
|
overflow: true,
|
|
}),
|
|
zIndex: 9993,
|
|
});
|