整理绘制

gerson

2025-02-09 6e2557b3ae3e1b43bc01a5122f5fd4aa9b83d755

 src/components/chat/chatComponents/summaryCom/components/recordSetTable/map/BasicMap.vue

@@ -69,6 +69,7 @@
import LayerControl from './LayerControl.vue';
import PanelTool from './panelTool/index.vue';
import {
   getMapDrawStyles,
   getMapLayerGroupList,
   getMapLayersByPost,
   getMapThemeList,
@@ -98,7 +99,6 @@
      }),
   }
);


const colsArray = computed(() => {
   return props.data.cols ?? [];
@@ -273,9 +273,8 @@

const maxResolution = 1;

const getText = function (feature, resolution) {
   const oname = feature.get('oname');
   let text = `first-${oname[0]}`;
const getText = function (textContent, resolution) {
   let text = `${textContent}`;
   if (resolution > maxResolution) {
      text = '';
   }
@@ -290,10 +289,10 @@

   return text;
};
const createTextStyle = (feature, resolution) => {
const createTextStyle = (textContent, resolution) => {
   return new Style({
      text: new Text({
         text: getText(feature, resolution),
         text: getText(textContent, resolution),
         font: '14px Arial',
         fill: new Fill({ color: '#000' }),
         stroke: new Stroke({ color: '#fff', width: 2 }),
@@ -304,8 +303,8 @@
};

const styleMap: Record<string, Record<string, Style>> = {
   junction: {},
   pipe: {},
   point: {},
   line: {},
   polygon: {},
};
/** @description 已经做的layer，后续全部做好，可以不做判断 */
@@ -316,41 +315,28 @@
   switch (shape) {
      case 'Point':
         const pSize = feature.get('psize');
         if (!pSize) return null;

         const pcolor = feature.get('pcolor');
         const pkey = `${pSize}_${pcolor}`;

         if (!styleMap.junction[pkey]) {
            styleMap.junction[pkey] = new Style({
               image: new Circle({
                  radius: pSize,
                  fill: new Fill({ color: `#${pcolor}` }),
               }),
         const pstyle = feature.get('pstyle');
         const pointStyle = olMap.value.getPointStyles({
            size: pSize,
            color: pcolor,
            style: pstyle,
            });
         }

         // const textStyle = createTextStyle(feature, resolution);
         styles.push(styleMap.junction[pkey]);
         styles.push(pointStyle);
         break;
      case 'LineString':
         const lSize = feature.get('lsize');
         if (!lSize) return null;
         const lColor = feature.get('lcolor');
         const lKey = `${lSize}_${lColor}`;
         if (!styleMap.pipe[lKey]) {
            styleMap.pipe[lKey] = new Style({
               // image: new Circle({
               //    radius: lsize,
               //    fill: new Fill({ color: `#${color}` }),
               // }),
               stroke: new Stroke({
                  color: `#${lColor}`,
                  width: lSize,
               }),
         const lstyle = feature.get('lstyle');

         const lineStyle = olMap.value.getLineStyles({
            lsize: lSize,
            lcolor: lColor,
            lstyle: lstyle,
            });
         }
         styles.push(styleMap.pipe[lKey]);
         styles.push(...lineStyle);
         break;
      case 'Polygon':
         break;
@@ -358,7 +344,6 @@
         break;
   }

   const otype = feature.get('otype');
   // switch (otype) {
   //    case 'WDM_JUNCTIONS':
   //       const textStyle = createTextStyle(feature, resolution);
@@ -369,9 +354,13 @@
   // }
   //#region ====================== 添加标注 ======================
   const tString = feature.get('tstring');
   if (tString) {
      const textStyle = createTextStyle(feature, resolution);
      styles.push(textStyle);

   const tStringStyle = olMap.value.getLabelStyles({
      textContent: tString,
      resolution,
   });
   if (tStringStyle) {
      styles.push(tStringStyle);
   }
   //#endregion

@@ -384,6 +373,11 @@
   return groupList;
};

const getDrawStyles = async () => {
   const res = await getMapDrawStyles();
   const styleList = res?.values ?? [];
   olMap.value.setDrawStyles(styleList);
};

const getThemeList = async () => {
   const res = await getMapThemeList();
@@ -406,7 +400,6 @@
         type: 'theme',
         activeTheme: null,
         legends: null,
			
      };
      mapGroupItem.children.push(data);
      return preVal;
@@ -414,6 +407,7 @@
   olMap.value.setAllThemes(themeTreeData);
};
const initVectorTileLayer = async () => {
   await getDrawStyles();
   const res = await getMapLayersByPost();
   const layers = reverse(res?.layers ?? []);
   if (layers.length === 0) return;
@@ -424,7 +418,6 @@

      layer.set('originStyle', styleFunc);
      layerModels.push(layer);
	
   }
   getGroupList().then((groupList) => {
      olMap.value.setAllLayers(layerModels, layers, groupList);