diff --git a/packages/common/business_components/src/ui/chart/LineBarChart.tsx b/packages/common/business_components/src/ui/chart/LineBarChart.tsx
index 9f9a4feec..2a2ba2b1c 100644
--- a/packages/common/business_components/src/ui/chart/LineBarChart.tsx
+++ b/packages/common/business_components/src/ui/chart/LineBarChart.tsx
@@ -7,6 +7,7 @@ import {
} from "./lib/chart";
import type { ContentType } from "recharts/types/component/DefaultLegendContent";
import type { set } from "date-fns";
+import React from "react";
// 툴크 커스텀 css
/** 차트 기본 스타일 */
@@ -126,6 +127,37 @@ export default function LineBarchart({
monthTicks = getTicks(chartData);
}
+ const CustomAxisText : React.FC<{ viewBox: any, fieldText: string, position:string }> = ({ viewBox, fieldText, position }) => {
+ const { x, y, width, height } = viewBox; // 축 영역
+ const padding = 5; // 차트 바깥으로 띄우기
+
+ if('left' == position) {
+ return (
+
+ {fieldText}
+
+ );
+ }else{
+ return (
+
+ {fieldText}
+
+ );
+ }
+ }
+
return (
{chartTitle && chartTitle !== "" && chartTitle !== "undefined" ? (
@@ -151,18 +183,22 @@ export default function LineBarchart({
yAxisId="left"
className="text-[12px] font-bold"
tickCount={6}
- orientation="left"
- domain={[0, Math.ceil(lineMaxValue * 1)]}
- label={{ value: yFieldText, angle: -90, position: 'insideLeft', offset: -8 }}
+ tickFormatter={(value) =>
+ typeof value === "number" ? value.toLocaleString() : value
+ }
+ orientation="left"
+ label={(props) => }
/>}
{/* 오른쪽 Y축: barVal */}
{yFieldText2 &&
+ typeof value === "number" ? value.toLocaleString() : value
+ }
+ label={(props) => }
reversed={true}
/>}
} />
diff --git a/packages/common/business_components/src/ui/chart/LineChart.tsx b/packages/common/business_components/src/ui/chart/LineChart.tsx
index a76807bae..314a0b240 100644
--- a/packages/common/business_components/src/ui/chart/LineChart.tsx
+++ b/packages/common/business_components/src/ui/chart/LineChart.tsx
@@ -129,6 +129,37 @@ const CustomLegend = (props: LegendProps) => {
);
};
+const CustomAxisText : React.FC<{ viewBox: any, fieldText: string, position:string }> = ({ viewBox, fieldText, position }) => {
+ const { x, y, width, height } = viewBox; // 축 영역
+ const padding = 5; // 차트 바깥으로 띄우기
+
+ if('left' == position) {
+ return (
+
+ {fieldText}
+
+ );
+ }else{
+ return (
+
+ {fieldText}
+
+ );
+ }
+}
+
type DataType = {label: string; val: string};
type ChartDataType = {
@@ -220,7 +251,10 @@ export default function Linechart({
yAxisId="left"
className="text-[12px] font-bold"
orientation="left"
- label={{ value: yFieldText, className:"text-[12px] font-bold", angle: -90, position: 'insideLeft' }} />
+ tickFormatter={(value) =>
+ typeof value === "number" ? value.toLocaleString() : value
+ }
+ label={(props) => }/>
} />
{showLegend && }
{Object.keys(chartData).map((key) => {
diff --git a/packages/common/business_components/src/ui/map/lib/gis.layer.js b/packages/common/business_components/src/ui/map/lib/gis.layer.js
index b339214db..efd3621b4 100644
--- a/packages/common/business_components/src/ui/map/lib/gis.layer.js
+++ b/packages/common/business_components/src/ui/map/lib/gis.layer.js
@@ -597,40 +597,63 @@ GisOlLayer.prototype = {
const tileSize = 256; // 기본 타일 크기
return Math.ceil(Math.log2(maxResolution / (cameraHeight / tileSize)));
},
- ensureSearchLayer: function () {
+ ensureSearchLayer: function (option) {
let layer = this.searchLayer;
if (!layer) {
- layer = new VectorLayer({
- source: new VectorSource(),
+ let source;
+
+ try {
+ if (option.cmncNm == 'bbox') {
+ source = this.getVectorSourceBbox(option);
+ } else {
+ source = this.getVectorSourceAll(option);
+ }
+ } catch (error) {
+ console.warn(option);
+ }
+
+ layer = new VectorImageLayer({
+ ...option,
+ id: 'search-layer',
+ source: source,
zIndex: 9999
});
+ layer.setStyle(this.gisStyle.getLayerStyleFunction(layer, option));
+
let map = GisApp.Module.core.map;
map.addLayer(layer);
+
+ this.searchLayer = layer;
}
return layer;
},
- clearSearchLayer: function () {
- const layer = this.ensureSearchLayer();
+ clearSearchLayer: function (option) {
+ const layer = this.ensureSearchLayer(option);
layer.getSource().clear(true);
+
+ if (this.searchLayer) {
+ GisApp.Module.core.map.removeLayer(this.searchLayer);
+ this.searchLayer = null;
+ }
},
showSearchResultsFromGeoJSON: function (lyrTyNm, featureId) {
- const layer = this.ensureSearchLayer();
-
- // 이전 검색결과는 깨끗이
- const prev = layer.getSource();
- if (prev) prev.clear(true);
-
//레이어 타입 설정(point, line 등. 이걸 style에서 사용)
const layerCode = GisApp.layerCode;
const matched = Object.values(layerCode).find(obj => obj.lyrTyNm === lyrTyNm);
+ // 이전 검색 레이어 완전히 제거
+ this.clearSearchLayer(matched);
+ // 새로운 검색 레이어 생성
+ const layer = this.ensureSearchLayer(matched);
layer.set("gobjTy", matched.gobjTy);
// 새 소스 만들기
- const source = this.getFeatureSourceFromGeoserver(lyrTyNm, featureId);
+ const source = this.getFeatureSourceFromGeoserver(lyrTyNm, featureId, matched);
// 1) 로드 완료시 extent 맞추기
const onLoadEnd = () => {
+ if (Object.keys(source.nullGeometryFeatures_).length > 0) alert('해당 시설의 위치 정보가 없습니다.');
+
const feats = source.getFeatures();
if (feats && feats.length > 0) {
const select = GisApp.Module.select;
@@ -665,12 +688,13 @@ GisOlLayer.prototype = {
* @param {*} featureId
* @returns
*/
- getFeatureSourceFromGeoserver: function (lyrTyNm, featureId) {
+ getFeatureSourceFromGeoserver: function (lyrTyNm, featureId, option) {
const typeName = this.storageNm + lyrTyNm;
const srsName = GisApp.TO_PROJ;
const baseUrl = GisApp.GEOSERVER_URL;
const source = new VectorSource({
+ ...option,
format: new GeoJSON(),
url: () => {
const params = new URLSearchParams({
@@ -695,13 +719,14 @@ GisOlLayer.prototype = {
* @param {Array|string} featureIds 피처 ID 배열 또는 단일 ID
*/
showMultipleSearchResultsFromGeoJSON: function (lyrTyNm, featureIds) {
- const layer = this.ensureSearchLayer();
-
- const prev = layer.getSource();
- if (prev) prev.clear(true);
const layerCode = GisApp.layerCode;
const matched = Object.values(layerCode).find(obj => obj.lyrTyNm === lyrTyNm);
+
+ // 이전 검색 레이어 완전히 제거
+ this.clearSearchLayer(matched);
+ // 새로운 검색 레이어 생성
+ const layer = this.ensureSearchLayer(matched);
layer.set("gobjTy", matched.gobjTy);
const source = this.getMultiFeatureSourceFromGeoserver(lyrTyNm, featureIds);
diff --git a/packages/common/business_components/src/ui/map/lib/gis.select.js b/packages/common/business_components/src/ui/map/lib/gis.select.js
index d0209a6ed..ed4f9a2a7 100644
--- a/packages/common/business_components/src/ui/map/lib/gis.select.js
+++ b/packages/common/business_components/src/ui/map/lib/gis.select.js
@@ -284,6 +284,7 @@ GisOlSelect.prototype = {
selectedFeatures.forEach(feature => {
selectedFeatures.remove(feature);
});
+ selectedFeatures.clear();
},
/**
* SELECT 이벤트 활성화