feiniao-be-data/src/utils/ol-map/VectorStyle.js

import LTBaseObject from './KBaseObject'
import XYZ from 'ol/source/XYZ'
import Tile from 'ol/layer/Tile'
import Common from './Common'
import Style from "ol/style/Style";
import Fill from "ol/style/Fill";
import Stroke from "ol/style/Stroke";
import Text from "ol/style/Text";
import Icon from "ol/style/Icon";
import Circle from "ol/style/Circle";
/**
 * @description 样式类
 */
class VectorStyle{
	constructor(){
		this.cachePointSimpleStyle = {}
	}
	getLineStyle(fillColor, strokeColor, strokeWidth){
		let style = new Style({
			stroke: new Stroke({
				color: strokeColor,
				width: strokeWidth || 1,
			}),
		});
		return style;
	}

	getPolygonStyle(fillColor, strokeColor, strokeWidth){
		let style = new Style({
			fill: new Fill({
				color: fillColor
			}),
			stroke: new Stroke({
				color: strokeColor,
				width: strokeWidth || 1,
			}),
		});
		return style;
	}
	getPointStyle(src, scale, anchor, text, font, textColor){
		let textObj = null;
		text &&	(textObj = new Text({
			text:text,
			stroke: new Stroke({
				color: textColor,
				width: 1,
			}),
			fill: new Fill({
				color: textColor,
			}),
			font:font
		}))
		let style = new Style({
			image: new Icon({
				text:textObj,
				src:src,
				scale:scale,
				anchor:anchor,
			})
		});
		return style
	}

	/**
	 *
	 * @param radius 半径
	 * @param fillColor 填充颜色
	 * @param strokeColor 边框颜色
	 * @param strokeWidth 边框宽度
	 * @returns {Style}
	 */
	getPointSimpleStyle(radius, fillColor, strokeColor, strokeWidth){
		let key = radius + fillColor + strokeColor + strokeWidth
		if(this.cachePointSimpleStyle[key]){
			return this.cachePointSimpleStyle[key]
		}
		let style = new Style({
			image: new Circle({
				radius: radius,                             // 半径
				stroke: new Stroke({           // 边界样式
					color: strokeColor,                    // 边界颜色
					width: strokeWidth                           // 边界宽度
				}),
				fill: new Fill({               // 填充样式
					color: fillColor                       // 填充颜色
				})
			})
		});
		this.cachePointSimpleStyle[key] = style
		return style
	}

	/**
	 *
	 * @param text
	 * @param fillColor 填充颜色
	 * @param strokeColor 边框颜色
	 * @param strokeWidth 边框宽度
	 * @returns {Style}
	 */
	getPointTextStyle(text, fillColor, strokeColor, strokeWidth, fontSize){
		let style = new Style({
			text: new Text({
				text:text,
				stroke: new Stroke({
					color: strokeColor,
					width: strokeWidth,
				}),
				fill: new Fill({
					color: fillColor,
				}),
				font: fontSize+"px sans-serif"
			}),
		});
		return style
	}
}
export default VectorStyle