символ нагнетательной скважины исправлен

index.html

@@ -111,7 +111,7 @@
             return this
         }
 
-        set_style(style) {
+        add_style(style) {
             this.style = { ...this.style || {}, ...style }
             return this
         }
@@ -385,13 +385,13 @@
     axios.post('http://localhost:4000/proxy/sqlite', { query }).then(x => x.data)
         .then(wells => {
 
-            let layer_wells = wells.map(w => circle(15).set_style(style_wellhead).move(w.whx, w.why).render())
+            let layer_wells = wells.map(w => circle(15).add_style(style_wellhead).move(w.whx, w.why).render())
-            let layer_wells_wpr = wells.map(w => svg_sector(70, 0, 70).set_style(style_wir).move(w.whx, w.why).render())
+            let layer_wells_wpr = wells.map(w => svg_sector(70, 0, 70).add_style(style_wir).move(w.whx, w.why).render())
 
-            let layer_wells_gpr = wells.map(w => svg_sector(70, 70, 130).set_style(style_gpr).move(w.whx, w.why).render())
+            let layer_wells_gpr = wells.map(w => svg_sector(70, 70, 130).add_style(style_gpr).move(w.whx, w.why).render())
-            let layer_wells_opr = wells.map(w => svg_sector(70, 130, 360).set_style(style_opr).move(w.whx, w.why).render())
+            let layer_wells_opr = wells.map(w => svg_sector(70, 130, 360).add_style(style_opr).move(w.whx, w.why).render())
 
-            let layer_well_names = wells.map(w => svg_text(w.well).set_style(style_wellhead_text).move(w.whx + 10, w.why - 10).render())
+            let layer_well_names = wells.map(w => svg_text(w.well).add_style(style_wellhead_text).move(w.whx + 10, w.why - 10).render())
             // let layers = [...layer_wells, ...layer_wells_wpr, ...layer_well_names]
             // let layers = layer_wells_wpr
             let layers = [...layer_wells_wpr, ...layer_wells_gpr, ...layer_wells_opr, ...layer_wells, ...layer_well_names,

src/App.svelte

@@ -9,8 +9,8 @@
 	import file_lib from "./libs/file";
 
 	import Modal from "./components/Modal.svelte";
-	import MapApp from './services/map'
+
-	import SvgMapParser from './svgmap/SvgMapParser'
+	import SvgMapParser from './svgmap/SvgMap.js'
 
 	import get_bbox from './libs/bbox'
 
@@ -30,21 +30,21 @@
 	let WellsRenderer = {
 		// [{x,y}]
 		heads(wells, r, style) {
-			return wells.map((w) => SvgNodes.circle(r).set_style(style).move(w.x, w.y));
+			return wells.map((w) => SvgNodes.circle(r).add_style(style).move(w.x, w.y));
 		},
 
 		// [{x,y,name}]
 		names(wells, style, shift) {
 			return wells.map((w) =>
 				SvgNodes.text(w.name)
-					.set_style(style)
+					.add_style(style)
 					.move(w.x + shift.x, w.y + shift.y)
 			);
 		},
 
 		// {x,y,ring[1,2,3,4,5]}
 		ring(x, y, r0, r1, a0, a1, style) {
-			return SvgNodes.ring_sector(r0, r1, a0, a1).move(x, y).set_style(style);
+			return SvgNodes.ring_sector(r0, r1, a0, a1).move(x, y).add_style(style);
 		},
 	};
 
@@ -82,7 +82,9 @@
 		// console.log(res.form['some'].value)
 		let file = await file_lib.toBase64(res.form["file"]);
 
-		let ans = await axios.post(`${back_url}/import/excel`, { name: "production_injection", file });
+		const name_hash = {'well': 'well_name'}
+
+		let ans = await axios.post(`${back_url}/import/excel`, { name: "production_injection", file, name_hash });
 		console.log(ans);
 		// ui.modal.show(`Hallo ${res.form['some'].value}`, ['ok'])
 
@@ -236,17 +238,17 @@
 		let a0 = 0;
 		let a1 = 130;
 		let layer_gpt = scaled_wells.map((w) =>
-			SvgNodes.ring_sector(r0, r1, a0, a1).move(w.whx, w.why).set_style(styles.gpt)
+			SvgNodes.ring_sector(r0, r1, a0, a1).move(w.whx, w.why).add_style(styles.gpt)
 		);
 
 
 
 		let layer_wells = scaled_wells.map((w) =>
-			SvgNodes.circle(whr).set_attrs({ cx: w.whx, cy: w.why }).set_style(styles.wellhead)
+			SvgNodes.circle(whr).set_attrs({ cx: w.whx, cy: w.why }).add_style(styles.wellhead)
 		);
 		let layer_wellnames = scaled_wells.map((w) =>
 			SvgNodes.text(w.well)
-				.set_style(styles.style_wellhead)
+				.add_style(styles.style_wellhead)
 				.move(w.whx + shift.x, w.why + shift.y)
 		);
 
@@ -254,18 +256,18 @@
 			sectored_ring(0, 50, [{v: 10, style: styles.gpt}, {v: 20, style: styles.opt}, {v: 30, style: styles.wopt}]).move(w.whx, w.why)
 		);
 
-		// let layer_wells_wpr = wells.map((w) => svg_sector(70, 0, 70).set_style(style_wir).move(w.whx, w.why).render());
+		// let layer_wells_wpr = wells.map((w) => svg_sector(70, 0, 70).add_style(style_wir).move(w.whx, w.why).render());
 
 		// let layer_wells_gpr = wells.map((w) =>
-		// 	svg_sector(70, 70, 130).set_style(style_gpr).move(w.whx, w.why).render()
+		// 	svg_sector(70, 70, 130).add_style(style_gpr).move(w.whx, w.why).render()
 		// );
 		// let layer_wells_opr = wells.map((w) =>
-		// 	svg_sector(70, 130, 360).set_style(style_opr).move(w.whx, w.why).render()
+		// 	svg_sector(70, 130, 360).add_style(style_opr).move(w.whx, w.why).render()
 		// );
 
 		// let layer_well_names = wells.map((w) =>
 		// 	svg_text(w.well)
-		// 		.set_style(style_wellhead_text)
+		// 		.add_style(style_wellhead_text)
 		// 		.move(w.whx + 10, w.why - 10)
 		// 		.render()
 		// );

src/back_.js

@@ -1,29 +1,73 @@
-import fs, { symlinkSync } from "fs";
+import fs from "fs";
 import axios from "axios";
 
-import SvgMapParser from "./svgmap/SvgMapParser.js";
+import SvgMap from "./svgmap/SvgMap.js";
+import SvgMapBuilder from "./svgmap/SvgMapBuilder.js";
+import CoordSystem from "./libs/CoordSystem.js";
+import SvgNode from "./svgmap/SvgNode.js";
 import SvgNodes from "./svgmap/SvgNodes.js";
+import Transfrom from "./libs/Transform.js";
+import BBox from "./libs/bbox.js";
+
+import sql_pi from "./services/sql/prod_inj.js";
+
+// import SvgNodes from "./svgmap/SvgNodes.js";
+
+// import math_lib from './libs/math.js'
 
 const back_url = "http://localhost:4000";
 
-const path = "../../data/2022-03-16";
+const path = "../../data/prodmaps";
 
 // let file = fs.readFileSync('../data/2022-03-16/49_Кар тек и сум отб 7 об_вост.svg')
 // let file = fs.readFileSync('../data/2022-03-16/49_Кар тек и сум отб 7 об_вост-sm.svg')
 // let file = fs.readFileSync('../data/2022-03-16/49_Кар тек и сум отб 7 об_вост-inch.svg')
 // let file = fs.readFileSync(`${path}/49_Кар тек и сум отб 7 об_вост-mm.svg`)
-let file = fs.readFileSync(`D:/dev/git/kz/prodmaps/src/49_Кар тек и сум отб 7 об_вост.svg`);
+// let file = fs.readFileSync(`${path}/49_Кар тек и сум отб 7 об_вост.svg`);
 
 // let file = fs.readFileSync('../data/2022-03-16/49_Кар тек и сум отб 7 об_вост-px.svg')
 
+const query = (sql) => axios.post(`${back_url}/proxy/sqlite`, { query: sql }).then((x) => x.data.data);
+
 let styles = JSON.parse(fs.readFileSync("./moc/styles.json").toString());
 
-let parser = new SvgMapParser();
+const all_settings = {
+	pt: {
+		tons_in_cm2: 20000,
+		ppu: 100, // 100
+		styles,
+		// Масштаб 1мм карты / 1мм реальный (1000мм в 1м)
+		map_scale: (1 / 10000) * 1000,
+	},
 
-function build_scaler() {
+	it: {
-	// Получить функцию для перевода координат из геологических в локальные.
+		tons_in_cm2: 100000,
-	// Получить функцию для перевода расстояний кругов (из тонн в см2)
+		ppu: 100, // 100
-}
+		styles,
+		// Масштаб 1мм карты / 1мм реальный (1000мм в 1м)
+		map_scale: (1 / 10000) * 1000,
+	},	
+
+	pr: {
+		tons_in_cm2: 50,
+		ppu: 100,
+		styles,
+		// Масштаб 1мм карты / 1мм реальный (1000мм в 1м)
+		map_scale: (1 / 10000) * 1000,
+	},
+
+	ir: {
+		tons_in_cm2: 50,
+		ppu: 100,
+		styles,
+		// Масштаб 1мм карты / 1мм реальный (1000мм в 1м)
+		map_scale: (1 / 10000) * 1000,
+	},		
+};
+
+// all_settings.styles = SvgMapBuilder.update_styles(all_settings.styles, all_settings.ppu)
+
+let parser = new SvgMap();
 
 async function start() {
 	await parser.parse(file.toString());
@@ -49,90 +93,274 @@ async function start() {
 	let ww1 = wells.filter((x) => x.well == anchor.w1.name)[0];
 	let ww2 = wells.filter((x) => x.well == anchor.w2.name)[0];
 
-	console.log(ww1, ww2);
-
 	if (!ww1) return ui.modal.show(`Скважины ${anchor.w1.name} не найдено в базе.`, ["ok"]);
 	if (!ww2) return ui.modal.show(`Скважины ${anchor.w2.name} не найдено в базе.`, ["ok"]);
 
-	anchor.w1.whx = ww1.whx;
+	// function cs(x0, y0, x1, y1) {
-	anchor.w1.why = ww1.why;
+	// 	return { x0, y0, x1, y1 };
-	anchor.w2.whx = ww2.whx;
+	// }
-	anchor.w2.why = ww2.why;
 
-	function dist(x1, y1, x2, y2) {
+	// function build_tr(cs1, cs2) {
-		let dx = x2 - x1,
+	//     let dx1 = cs1.x1 - cs1.x0
-			dy = y2 - y1;
+	//     let dy1 = cs1.y1 - cs1.y0
-		return Math.sqrt(dx * dx + dy * dy);
+	//     let dx2 = cs2.x1 - cs2.x0
-	}
+	//     let dy2 = cs2.y1 - cs2.y0
 
-	function cs(x0, y0, x1, y1) {
+	// 	const kx12 = dx2 / dx1
-		return { x0, y0, x1, y1 };
+	//     const ky12 = dy2 / dy1;
-	}
+	// 	const kx21 = dx1 / dx2
+	//     const ky21 = dy1 / dy2;
 
-	function build_tr(cs1, cs2) {
+	// 	let tr = {
-        let dx1 = cs1.x1 - cs1.x0
+	// 		tr12: {
-        let dy1 = cs1.y1 - cs1.y0
+	// 			trx(x) {
-        let dx2 = cs2.x1 - cs2.x0
+	// 				return (x - cs1.x0) * kx12 + cs2.x0;
-        let dy2 = cs2.y1 - cs2.y0
+	// 			},
+	// 			try(y) {
+	// 				return (y - cs1.y0) * ky12 + cs2.y0;
+	// 			},
+	// 		},
+	// 		tr21: {
+	// 			trx(x) {
+	// 				return (x - cs2.x0) * kx21 + cs1.x0;
+	// 			},
+	// 			try(y) {
+	// 				return (y - cs2.y0) * ky21 + cs1.y0;
+	// 			},
+	// 		},
+	// 	};
 
-		const kx12 = dx2 / dx1
+	// 	return tr;
-        const ky12 = dy2 / dy1;
+	// }
-		const kx21 = dx1 / dx2
-        const ky21 = dy1 / dy2;
-
-		let tr = {
-			tr12: {
-				trx(x) {
-					return (x - cs1.x0) * kx12 + cs2.x0;
-				},
-				try(y) {
-					return (y - cs1.y0) * ky12 + cs2.y0;
-				},
-			},
-			tr21: {
-				trx(x) {
-					return (x - cs2.x0) * kx21 + cs1.x0;
-				},
-				try(y) {
-					return (y - cs2.y0) * ky21 + cs1.y0;
-				},
-			},
-		};
-
-		return tr;
-	}
 
 	// Функция перевода координат из глобальных в локальные.
-	const cs1 = cs(anchor.w1.x, anchor.w1.y, anchor.w2.x, anchor.w2.y);
+	const cs1 = new CoordSystem(anchor.w1.x, anchor.w1.y, anchor.w2.x, anchor.w2.y);
-	const cs2 = cs(anchor.w1.whx, anchor.w1.why, anchor.w2.whx, anchor.w2.why);
+	const cs2 = new CoordSystem(ww1.whx, ww1.why, ww2.whx, ww2.why);
-	let tr = build_tr(cs1, cs2);
+	// let tr = Transfrom.fromCoordSyses(cs2, cs1);
-	console.log(tr);
+
+	// let tr = Transfrom.fromCoordSyses(cs2, cs1);
+
+	// console.log('tr is:', tr);
 
 	// console.log(wells)
 
-	const query_all = `SELECT well, whx, why FROM wells`// WHERE well='${anchor.w1.name}'`;
+	const DATE = "2023-01-01";
-    // const query_all = `SELECT well, whx, why FROM wells WHERE well='${anchor.w1.name}' OR well='${anchor.w2.name}'`;
+
+	const query_all = `SELECT
+		wells.well, wells.whx, wells.why,
+		MAX(production_injections.date) as date
+		,SUM(production_injections.woptm) as wopt
+		,SUM(production_injections.wwptm) as wwpt
+		,SUM(production_injections.wsgptv) as wgpt
+		,SUM(production_injections.wwitv) as wwit
+		,SUM(production_injections.wwptm)+SUM(production_injections.woptm) as wlpt
+		,SUM(production_injections.wwptm)/(SUM(production_injections.wwptm)+SUM(production_injections.woptm)) as wlf
+	FROM
+		wells, production_injections
+	WHERE
+		wells.well=production_injections.well
+		AND production_injections.date<='${DATE}'
+	GROUP BY
+		wells.well
+
+	`; // WHERE well='${anchor.w1.name}'`;
+
+	// Получим максимально удаленные скважины не лежащие вдоль оси.
 	let all_wells = await axios.post(`${back_url}/proxy/sqlite`, { query: query_all }).then((x) => x.data.data);
 
-	let mapped_wells = all_wells.map((x) => ({ ...x, lx: tr.tr21.trx(x.whx), ly: tr.tr21.try(x.why) }));
+	let bbox = BBox.from_array(all_wells.map((w) => ({ x: w.whx, y: w.why })));
+	console.log("BBOX", bbox);
+	console.log("BBOX", bbox.toLTWH());
+	console.log("BBOX", bbox.toLTRB());
 
-	console.log(mapped_wells.slice(0, 2));
+	tr = Transfrom.fromCoordSyses();
 
-	let svg = SvgNodes.svg().set_attrs({
+	let mapped_wells = all_wells.map((x) => ({ ...x, lx: tr.trx(x.whx), ly: tr.try(x.why) }));
-		width: sc.w + "mm",
-		height: sc.h + "mm",
-		viewBox: `0 0 ${sc.w * sc.k} ${sc.h * sc.k}`,
-	});
 
-    svg = SvgNodes.group()
+	// const tons_in_cm2 = 10000
 
-    svg.append(mapped_wells.map((x) => SvgNodes.ring_sector(1.5 * sc.k, 6 * sc.k, 0, 120).move(x.lx, x.ly).set_style(styles.gpt)));
+	// function t2r(tons){
-	svg.append(		mapped_wells.map((x) =>			SvgNodes.circle(1.5 * sc.k)				.move(x.lx, x.ly)				.set_style(styles.wellhead)		)	);
+	// 	// tonns/mm2 = tonns/cm2 / 100. S(mm)=Pi*r*r=tons/tons_in_cm2*100. r = sqrt(tons/tons_in_cm2*100 / PI)
-	svg.append(mapped_wells.map((x) => SvgNodes.text(x.well).move(x.lx, x.ly).set_style(styles.wellhead)));
+	// 	return Math.sqrt(tons / tons_in_cm2 * 100 / Math.PI)
+	// }
 
-    let data = file.toString().replace('</svg>', svg.render() + '</svg>')
+	// console.log(mapped_wells.filter(x => x.well == '213').map(x => ({...x, ttt: t2r(x.wlpt)})))
 
-	fs.writeFileSync("out.svg", data) //svg.render());
+	// console.log(math_lib.make_ranges(vals))
+
+	// svg.append(mapped_wells.map((x) => SvgNodes.ring_sector(1.5 * sc.k, 6 * sc.k, 0, 120).move(x.lx, x.ly).add_style(styles.gpt)));
+
+	const settings = {
+		tons_in_cm2: 10000,
+		styles,
+	};
+
+	{
+		let ti_layer = parser.build_tp_layer(mapped_wells, settings);
+		let svg = SvgNodes.svg()
+			.set_attr("width", "1000px")
+			.set_attr("height", "1000px")
+			.set_attr("viewBox", "0 0 1000 1000");
+		// let defs = new SvgNode('defs')
+		// defs.append(ti_layer.defs)
+		// console.log(ti_layer.defs.tag)
+		svg.append(ti_layer.defs);
+		svg.append(ti_layer.svg);
+		fs.writeFileSync(`${path}/out.svg`, svg.render());
 	}
 
-start();
+	// let ti_layer = parser.build_tp_layer(mapped_wells, settings)
+	// let data = file.toString()
+	// 	.replace('</defs>', ti_layer.defs.render() + '</defs>')
+	// 	.replace('</svg>', ti_layer.svg.render() + '</svg>')
+	// fs.writeFileSync("../tmp/out_prod.svg", data) //svg.render());
+
+	// let ti_layer_inj = parser.build_ti_layer(mapped_wells, settings)
+	// let data2 = file.toString()
+	// 	.replace('</defs>', ti_layer_inj.defs.render() + '</defs>')
+	// 	.replace('</svg>', ti_layer_inj.svg.render() + '</svg>')
+	// fs.writeFileSync("../tmp/out_inj.svg", data2) //svg.render());
+}
+
+class SvgSaver {
+	constructor(settings, bbox) {
+		// Функция перевода координат из глобальных в локальные.
+		const cs1 = new CoordSystem(bbox.l, bbox.t, bbox.r, bbox.b);
+		const cs_mm = cs1.clone().flipy().moveto(0, 0).scale(settings.map_scale);
+		const cs_ppu = cs_mm.clone().scale(settings.ppu);
+		const csw = Math.abs(cs_mm.x1 - cs_mm.x0);
+		const csh = Math.abs(cs_mm.y1 - cs_mm.y0);
+		const bbox_ppu = BBox.fromLTRB(cs_ppu.x0, cs_ppu.y0, cs_ppu.x1, cs_ppu.y1);
+
+		this.svg = SvgNodes.svg()
+			.set_attr("width", csw + "mm")
+			.set_attr("height", csh + "mm")
+			.set_attr("viewBox", `${bbox_ppu.l} ${bbox_ppu.t} ${bbox_ppu.w()} ${bbox_ppu.h()}`);
+
+		this.tr = Transfrom.fromCoordSyses(cs1, cs_ppu);
+
+		settings.styles = SvgMapBuilder.update_styles(settings.styles, settings.ppu);
+	}
+
+	append_defs(defs) {
+		this.svg.append(defs);
+	}
+
+	append_svg(svg) {
+		this.svg.append(svg);
+	}
+
+	append_layer(layer) {
+		this.append_defs(layer.defs);
+		this.append_svg(layer.svg);
+	}
+
+	save(filename) {
+		fs.writeFileSync(filename, this.svg.render());
+	}
+}
+
+function build_bbox(data){
+	let bbox = BBox.from_array(data);
+	if (bbox.w() == 0 || bbox.h() == 0) {
+		bbox.r += 1000;
+		bbox.b += 1000;
+	}
+
+	return bbox
+}
+
+async function build_map_pt(devobj) {
+	let wells = await query(sql_pi.totals(devobj));
+	wells = wells.filter((x) => x.wopt > 0);
+	if (!wells.length) return
+
+	let bbox = build_bbox(wells.map(w => ({ x: w.whx, y: w.why })));	
+	const saver = new SvgSaver(all_settings.pt, bbox);
+
+	let mapped_wells = wells.map((x) => ({ ...x, lx: saver.tr.trx(x.whx), ly: saver.tr.try(x.why) }));
+	let tp_layer = SvgMapBuilder.build_tp_layer(mapped_wells, all_settings.pt);
+
+	saver.append_layer(tp_layer);
+	saver.save(`${path}/out_devobj-${devobj}-PT.svg`);
+}
+
+async function build_map_it(devobj) {
+	let wells = await query(sql_pi.totals(devobj));
+	wells = wells.filter((x) => x.wwit > 0);
+	if (!wells.length) return
+
+	let bbox = build_bbox(wells.map(w => ({ x: w.whx, y: w.why })));	
+	const saver = new SvgSaver(all_settings.it, bbox);
+
+	let mapped_wells = wells.map((x) => ({ ...x, lx: saver.tr.trx(x.whx), ly: saver.tr.try(x.why) }));
+	let tp_layer = SvgMapBuilder.build_ti_layer(mapped_wells, all_settings.it);
+
+	saver.append_layer(tp_layer);
+	saver.save(`${path}/out_devobj-${devobj}-IT.svg`);
+}
+
+
+async function build_map_pr(devobj) {
+	console.log("build_map_pr", devobj);
+
+	const md = await query(sql_pi.max_date(devobj)).then((x) => x[0].date);
+	let wells = await query(sql_pi.rates(devobj, md))
+	wells = wells.filter((x) => x.wopr > 0);	
+	if (!wells.length) return
+
+	let bbox = build_bbox(wells.map(w => ({ x: w.whx, y: w.why })));	
+	const saver = new SvgSaver(all_settings.pr, bbox);
+
+	let mapped_wells = wells.map((x) => ({
+		...x,
+		wopt: x.wopr, //x.wopt / x.days,
+		wwpt: x.wwpr, // x.wwpt / x.days,
+		wlpt: x.wopr+x.wwpr, //  (x.wopt + x.wwpt) / x.days,
+		// wlf: x.wwpt / (x.wopt + x.wwpt),
+		lx: saver.tr.trx(x.whx),
+		ly: saver.tr.try(x.why),
+	}));
+
+	// let mapped_wells = wells.map((x) => ({ ...x, lx: saver.tr.trx(x.whx), ly: saver.tr.try(x.why) }));
+	let tp_layer = SvgMapBuilder.build_tp_layer(mapped_wells, all_settings.pr);
+
+	saver.append_layer(tp_layer);
+	saver.save(`${path}/out_devobj-${devobj}-PR.svg`);
+}
+
+async function build_map_ir(devobj) {
+	// const DATE = '2023-01-01'
+
+	const md = await query(sql_pi.max_date(devobj)).then((x) => x[0].date);
+	let wells = await query(sql_pi.rates(devobj, md))
+	wells = wells.filter((x) => x.wwir > 0);
+	if (!wells.length) return
+
+	let bbox = build_bbox(wells.map(w => ({ x: w.whx, y: w.why })));	
+	const saver = new SvgSaver(all_settings.ir, bbox);
+
+	let mapped_wells = wells.map((x) => ({
+		...x,
+		wwit: x.wwir, //x.wwit / x.days,
+		lx: saver.tr.trx(x.whx),
+		ly: saver.tr.try(x.why),
+	}));
+
+	let tp_layer = SvgMapBuilder.build_ti_layer(mapped_wells, all_settings.ir);
+
+	saver.append_layer(tp_layer);
+	saver.save(`${path}/out_devobj-${devobj}-IR.svg`);
+}
+
+
+async function start2() {
+	const objects = await query(sql_pi.devobjs()).then((r) => r.map((x) => x.devobj));
+
+	objects.map(build_map_pt);
+	objects.map(build_map_it)
+	objects.map(build_map_pr)
+	objects.map(build_map_ir)
+}
+
+start2();

src/libs/CoordSystem.js

@@ -0,0 +1,54 @@
+export default class CoordSystem{
+	/**
+	 * Создает ненормированную систему координат с началом в x0,y0 и направлением x1,y1
+	 * @param {*} x0
+	 * @param {*} y0
+	 * @param {*} x1
+	 * @param {*} y1
+	 * @returns
+	 */
+	constructor(x0, y0, x1, y1) {
+		this.x0 = x0
+        this.y0 = y0
+        this.x1 = x1
+        this.y1 = y1
+	}
+
+    scale(k){
+        this.x1 *= k
+        this.y1 *= k
+        return this
+    }
+
+    move(dx, dy){
+		this.x0 += dx
+        this.y0 += dy
+        this.x1 += dx
+        this.y1 += dy
+        return this
+    }
+
+    moveto(x, y){
+        let dx = x - this.x0
+        let dy = y - this.y0
+        return this.move(dx, dy)
+    }
+
+    flipx(){
+        let x = this.x0
+        this.x0 = this.x1
+        this.x1 = x
+        // this.x0 += 500
+        // this.x1 = 2 * this.x0 - this.x1 + 500
+        return this
+    }
+
+    flipy(){
+        this.y1 = 2 * this.y0 - this.y1
+        return this        
+    }
+
+    clone(){
+        return new CoordSystem(this.x0, this.y0, this.x1, this.y1)
+    }
+};

src/libs/Transform.js

@@ -0,0 +1,30 @@
+export default class Transfrom {
+	static fromCoordSyses(cs1, cs2){
+		let tr = new Transfrom()
+
+		tr.cs1 = cs1
+		tr.cs2 = cs2
+
+		let dx1 = cs1.x1 - cs1.x0;
+		let dy1 = cs1.y1 - cs1.y0;
+		let dx2 = cs2.x1 - cs2.x0;
+		let dy2 = cs2.y1 - cs2.y0;
+
+		tr.kx12 = dx1 ? dx2 / dx1 : 1;
+		tr.ky12 = dy1 ? dy2 / dy1 : 1;
+
+		return tr
+	}
+
+	trx(x){
+		return (x - this.cs1.x0) * this.kx12 + this.cs2.x0;
+	}
+
+	try(y){
+		return (y - this.cs1.y0) * this.ky12 + this.cs2.y0;
+	}
+
+	trp(p){
+		return {x: this.trx(p.x), y: this.trx(p.y)}
+	}
+}

src/libs/bbox.js

@@ -1,11 +1,95 @@
-module.exports = function (data) {
+export default class BBox {
-	return data.reduce(
+	static fromLTWH(l, t, w, h){
-		(s, c) => ({
+		return BBox.fromLTRB(l, t, l + w, t + h)
-			l: Math.min(s.l, c.x),
+	}
-			t: Math.min(s.t, c.y),
+
-			r: Math.max(s.r, c.x),
+	static fromLTRB(l, t, r, b){		
-			b: Math.max(s.b, c.y),
+		return Object.assign(new BBox(), {l: Math.min(l, r), t: Math.min(t, b), r: Math.max(l, r), b: Math.max(t, b)})
-		}),
+	}
-		{ l: data[0].x, t: data[0].y, r: data[0].x, b: data[0].y }
+
-	);
+	static from_array(arr_xy){
-};
+		const bbox = BBox.fromLTWH(arr_xy[0].x, arr_xy[0].y, 0, 0)
+		return bbox.append_many(arr_xy)
+	}
+
+	w(){
+		return this.r - this.l
+	}
+
+	h(){
+		return this.b - this.t
+	}
+
+	toLTWH(){
+		const {l, t, r, b} = this
+		return {l, t, w: r - l, h: b - t }
+	} 
+
+	toLTRB(){
+		const {l, t, r, b} = this
+		return {l, t, r, b}
+	}
+
+	toLTRBarr(){
+		const {l, t, r, b} = this
+		return [l, t, r, b]
+	}
+
+	append(x, y){
+		this.l = Math.min(this.l, x)
+		this.t = Math.min(this.t, y)
+		this.r = Math.max(this.r, x)
+		this.b = Math.max(this.b, y)
+		return this
+	}
+
+	append_many(arr_xy){
+		arr_xy.forEach(e => this.append(e.x, e.y))
+		return this
+	}
+
+    scale(k){		
+        this.r = this.l + (this.r - this.l) * k
+        this.b = this.t + (this.b - this.t) * k
+        return this
+    }
+
+    move(dx, dy){
+		this.l += dx
+        this.t += dy
+        this.r += dx
+        this.b += dy
+        return this
+    }
+
+    moveto(x, y){
+        let dx = x - this.l
+        let dy = y - this.t
+        return this.move(dx, dy)
+    }
+
+	clone(){
+		return BBox.fromLTRB(this.l, this.t, this.r, this.b)
+	}
+
+	// static from_data(data){		
+	// 	return data.reduce(
+	// 		(s, c) => ({
+	// 			l: Math.min(s.l, c.x),
+	// 			t: Math.min(s.t, c.y),
+	// 			r: Math.max(s.r, c.x),
+	// 			b: Math.max(s.b, c.y),
+	// 		}),
+	// 		 { l: data[0].x, t: data[0].y, r: data[0].x, b: data[0].y }
+	// 	);		
+	// 	// return data.reduce(
+	// 	// 	(s, c) => ({
+	// 	// 		l: Math.min(s.l, c.x),
+	// 	// 		t: Math.min(s.t, c.y),
+	// 	// 		r: Math.max(s.r, c.x),
+	// 	// 		b: Math.max(s.b, c.y),
+	// 	// 	}),
+	// 	// 	 { l: data[0].x, t: data[0].y, r: data[0].x, b: data[0].y }
+	// 	// );
+	// }
+}

src/libs/math.js

@@ -0,0 +1,13 @@
+export default {
+	/**
+	 * Создает данные дл круговой диаграммы из набора значений v0,v1,v2,v3 -> [{a0: 0, a1: v0}, {a0: v0, a1: v0+v1}, {a0: v0+v1, a1: v0+v1+v2},]
+	 * @param { [Number] } values Значения долей
+	 * @param { boolean } norm Нормировать ли значения диапазонов в отрезок 0-1
+	 * @returns Массив с диапазонами долей 1,2,3,4 -> [{0,0.1},{0.1,0.3},{0.3,0.6},{0.6,1}]
+	 */
+	make_ranges(values, norm = true) {
+		let ranges = values.reduce((s, c, i) => [...s, {...c, a0: i && s[i - 1].a1, a1: c + (i && s[i - 1].a1)}], [])
+        let max = ranges[ranges.length - 1].a1
+        return norm ? ranges.map(x => ({a0: x.a0 / max, a1: x.a1 / max})) : ranges
+	},
+};

src/moc/styles.json

@@ -1,25 +1,76 @@
 {
-    "wellhead": {
+    "_units": {
+        "1pt":"1pt",
+        "1mm":"1mm"
+    },
+
+    "black-line": {
+        "stroke-width": "1pt",
+        "stroke": "#000",
+        "fill": "none"
+    },
+
+    "white-body": {
+        "fill": "#fff"
+    },
+
+    "wellhead-name": {
         "font-family": "Times New Roman",
         "font-weight": "bold",        
-        "stroke-width": "0.5mm",
+        "font-size": "12pt",
-        "font-size":"10pt",
+        "fill": "#000",
+        "dx":1.7,
+        "dy":"-1"
+    },
+
+    "wellhead-black": {
+        "stroke-width": "0.1mm",
         "stroke": "#fff",
         "fill": "#000"
     },
+
+    "wellhead-gray": {
+        "stroke-width": "0.1mm",
+        "stroke": "#000",
+        "fill": "#ddd"
+    },
+
+    "wellhead-tri": {
+        "stroke-width": "0.1pt",
+        "stroke": "#fff",
+        "fill": "#000"
+    },
+
+    "wlf": {
+        "font-family": "Times New Roman",
+        "font-weight": "bold",
+        "stroke-width": "0",
+        "font-size": "8pt",
+        "font-style": "italic",
+        "stroke": "#fff",
+        "fill": "#00f",
+        "dx": 1.7,
+        "dy": 3
+    },
+
     "gpt": {
-        "stroke-width": 1,
+        "stroke-width": 20,
         "stroke": "#000",
         "fill": "#ff0"
     },
     "opt": {
-        "stroke-width": 1,
+        "stroke-width": 10,
         "stroke": "#000",
-        "fill": "#B86B41"
+        "fill": "url(#rg_opt)"
     },
     "wpt": {
-        "stroke-width": 1,
+        "stroke-width": 10,
         "stroke": "#000",
-        "fill": "#67c2e5"
+        "fill": "url(#rg_wpt)"
+    },
+    "wit": {
+        "stroke-width": 10,
+        "stroke": "#000",
+        "fill": "url(#rg1)"        
     }    
 }

src/services/sql/prod_inj.js

@@ -0,0 +1,116 @@
+export default {
+    max_date(){
+        return `SELECT MAX(date(year||'-01-01', (month - 1)||' month')) as date FROM production_injections`
+    },
+
+    devobjs(){
+        return `SELECT distinct(object) as devobj FROM production_injections`
+    },
+
+    totals(devobj){
+        return `SELECT
+            wells.well, wells.whx, wells.why
+            ,SUM(production_injections.woptm) as wopt
+            ,SUM(production_injections.wwptm) as wwpt
+            ,SUM(production_injections.wsgptv) as wgpt
+            ,SUM(production_injections.wwitv) as wwit
+            ,SUM(production_injections.days) as days
+            ,SUM(production_injections.wwptm)+SUM(production_injections.woptm) as wlpt
+            ,SUM(production_injections.wwptm)/(SUM(production_injections.wwptm)+SUM(production_injections.woptm)) as wlf
+        FROM
+            wells, production_injections
+        WHERE
+            wells.well=production_injections.well
+            AND production_injections.object='${devobj}'
+        GROUP BY
+            wells.well
+        ORDER BY
+            wlpt DESC, wwit DESC`
+    },
+
+    rates(devobj, date){
+        date = new Date(date)
+        const year_month = date.getFullYear()*100 + date.getMonth()
+        return `SELECT
+            wells.well, wells.whx, wells.why
+            ,SUM(production_injections.woptm)/SUM(production_injections.days) as wopr
+            ,SUM(production_injections.wwptm)/SUM(production_injections.days) as wwpr
+            ,SUM(production_injections.wsgptv)/SUM(production_injections.days) as wgpr
+            ,SUM(production_injections.wwitv)/SUM(production_injections.days) as wwir
+            ,SUM(production_injections.days) as days
+            ,(SUM(production_injections.wwptm)+SUM(production_injections.woptm)) / SUM(production_injections.days) as wlpr
+            ,SUM(production_injections.wwptm)/(SUM(production_injections.wwptm)+SUM(production_injections.woptm)) as wlf
+        FROM
+            wells, production_injections
+        WHERE
+            wells.well=production_injections.well
+            AND production_injections.object='${devobj}'
+            AND (year*100+month)=${year_month}  
+        GROUP BY
+            wells.well`
+    },
+
+
+    production_injection(field, devobj, date){
+        const f_date = date ? `AND year*1000+month=${date.getFullYear()*1000+date.getMonth()}` : ''
+        console.log(f_date)
+
+        return `SELECT
+            wells.well, wells.whx, wells.why
+            ,SUM(production_injections.woptm) as wopt
+            ,SUM(production_injections.wwptm) as wwpt
+            ,SUM(production_injections.wsgptv) as wgpt
+            ,SUM(production_injections.wwitv) as wwit
+            ,SUM(production_injections.days) as days
+            ,SUM(production_injections.wwptm)+SUM(production_injections.woptm) as wlpt
+            ,SUM(production_injections.wwptm)/(SUM(production_injections.wwptm)+SUM(production_injections.woptm)) as wlf
+        FROM
+            wells, production_injections
+        WHERE
+            AND wells.well=production_injections.well
+            AND production_injections.object='${devobj}'
+            AND (year*1000+month)=${max_year_month}        
+        GROUP BY
+            wells.well`
+    },
+
+    production_total(field, devobj){
+        return `SELECT
+            wells.well, wells.whx, wells.why
+            ,SUM(production_injections.woptm) as wopt
+            ,SUM(production_injections.wwptm) as wwpt
+            ,SUM(production_injections.wsgptv) as wgpt
+            ,SUM(production_injections.wwitv) as wwit
+            ,SUM(production_injections.wwptm)+SUM(production_injections.woptm) as wlpt
+            ,SUM(production_injections.wwptm)/(SUM(production_injections.wwptm)+SUM(production_injections.woptm)) as wlf
+        FROM
+            wells, production_injections
+        WHERE
+            wells.well=production_injections.well
+            AND object='${devobj}'
+        GROUP BY
+            wells.well`
+    },
+
+    injection_total(){
+        const query_all = `SELECT
+		wells.well, wells.whx, wells.why
+		,SUM(production_injections.woptm) as wopt
+		,SUM(production_injections.wwptm) as wwpt
+		,SUM(production_injections.wsgptv) as wgpt
+		,SUM(production_injections.wwitv) as wwit
+		,SUM(production_injections.wwptm)+SUM(production_injections.woptm) as wlpt
+		,SUM(production_injections.wwptm)/(SUM(production_injections.wwptm)+SUM(production_injections.woptm)) as wlf
+	FROM
+		wells, production_injections
+	WHERE
+		wells.well=production_injections.well
+		AND object='${devobj}'
+	GROUP BY
+		wells.well
+	HAVING
+		wwit>0
+
+	`
+    }
+}

src/svgmap/SvgMap.js

@@ -0,0 +1,140 @@
+import { parse } from "svg-parser";
+
+import SvgNode from './SvgNode.js'
+import SvgNodes from './SvgNodes.js'
+
+export default class {
+	async parse(xml) {
+		let result1 = parse(xml);
+
+		this.svg = result1.children.filter((x) => x.tagName == "svg")[0];
+	}
+
+    /**
+     * Получить слои документа. Имя слоя можно получить через поле id.
+     * @returns 
+     */
+	get_layers() {
+		return this.svg.children.filter((x) => x.tagName == "g");
+	}
+
+    /**
+     * Получить данные масштаба карты.
+     * @returns {w, h, k, u} Ширина в мм, высота в мм, k * v[px] = v[мм], юниты (mm, cm, inch)
+     */
+	get_map_scale() {
+		// console.log(this.svg)
+		let vb = this.svg.properties.viewBox.split(" ").map((x) => parseFloat(x));
+		let w = this.svg.properties.width;
+		let h = this.svg.properties.height;
+
+		let units = {
+			in: 25.4,
+			mm: 1,
+			cm: 10,
+			px: 0.0846646,
+			// '%': 1
+		};
+
+		const u = Object.keys(units).filter((x) => w.endsWith(x))[0];
+		if (!u) throw "Unsupported units";
+
+		w = Math.round(parseFloat(w.substring(0, w.length - u.length)) * units[u] * 100) / 100;
+		h = Math.round(parseFloat(h.substring(0, h.length - u.length)) * units[u] * 100) / 100;
+		let k = vb[2] / w;
+
+		return { w, h, k, u };
+	}
+
+	/**
+	 * Достать из слоя опордные скважины
+	 * @param {*} layer Слой в котором 2 последние группы содержат опорные скважины.
+	 * @returns { w1, w2 } Опрорные скважины
+	 */
+	extract_anchor(layer) {
+		let w1 = this.extract_well(layer.children[layer.children.length - 1]);
+		let w2 = this.extract_well(layer.children[layer.children.length - 2]);
+
+		return { w1, w2 };
+	}
+
+	_flat(node) {
+		if (!node.children) return [node];
+		return node.children.reduce((s, c) => s.concat(this._flat(c)), [node]);
+	}
+
+	/**
+	 * Получить из группы данные скважины (имя, координаты)
+	 * @param {*} pivot_group Svg группа
+	 * @returns { {x, y, name} }
+	 */
+	extract_well(pivot_group) {
+		let flat = this._flat(pivot_group);
+		let ellipse = flat.filter((x) => x.tagName == "circle" || x.tagName == "ellipse")[0];
+		let tr = ellipse.properties.transform
+			.replace("matrix(", "")
+			.replace(")", "")
+			.split(" ")
+			.map((x) => parseFloat(x));
+
+		let text = flat.filter((x) => x.type == "text")[0];
+		let name = text.value;
+		return { x: tr[4], y: tr[5], name };
+	}
+
+    build_tp_layer(wells, settings){
+        const sc = this.get_map_scale()
+
+        function t2r(tons){
+            // tonns/mm2 = tonns/cm2 / 100. S(mm)=Pi*r*r=tons/tons_in_cm2*100. r = sqrt(tons/tons_in_cm2*100 / PI)
+            return Math.sqrt(tons / settings.tons_in_cm2 * 100 / Math.PI)
+        }
+
+        let {styles} = settings
+
+		let defs = new SvgNode("defs")
+		defs.append(SvgNodes.defs.simple.radialGradient("rg_opt", "#fff", "#B86B41"))
+		defs.append(SvgNodes.defs.simple.radialGradient("rg_wpt", "#fff", "#67c2e5"))
+
+		let svg = SvgNodes.group(['<metadata id="CorelCorpID_WWPTCorel-Layer"/>']).set_attr("id", "WWPT")
+		// Круги
+		svg.append(wells.map((x) => SvgNodes.ring_sectors(1.5 * sc.k, t2r(x.wlpt) * sc.k, [{v: x.wopt, style: styles.opt}, {v: x.wwpt, style: styles.wpt}]).move(x.lx, x.ly)));
+		// Знак скважины
+		svg.append(wells.map((x) => SvgNodes.circle(1.5 * sc.k).move(x.lx, x.ly).add_style(styles.wellhead)));
+		// Имя скважины
+		svg.append(wells.map((x) => SvgNodes.text(x.well).move(x.lx + styles.wellhead.dx * sc.k, x.ly + styles.wellhead.dy * sc.k).add_style(styles.wellhead)));
+		// Обводненность
+		svg.append(wells.map((x) => SvgNodes.text(`${Math.round(x.wlf * 1000)/10 || ''}%`).move(x.lx + styles.wlf.dx * sc.k, x.ly + styles.wlf.dy * sc.k).add_style(styles.wlf)));
+
+		return {defs, svg}		
+	}
+
+	build_ti_layer(wells, settings){
+        const sc = this.get_map_scale()
+
+        function t2r(tons){
+            // tonns/mm2 = tonns/cm2 / 100. S(mm)=Pi*r*r=tons/tons_in_cm2*100. r = sqrt(tons/tons_in_cm2*100 / PI)
+            return Math.sqrt(tons / settings.tons_in_cm2 * 100 / Math.PI)
+        }
+
+        let {styles} = settings
+
+		let defs = SvgNodes.container()
+		defs.append(SvgNodes.defs.simple.radialGradient("rg1", "#fff", "#c1ff5e"))
+
+		let svg = SvgNodes.group(['<metadata id="CorelCorpID_WWITCorel-Layer"/>']).set_attr("id", "WWIT")
+		// Круги	
+		// let g_rings = SvgNodes.group(['<metadata id="CorelCorpID_WWITRingsCorel-Layer"/>']).set_attr("id", "Круги")
+		// svg.append(g_rings)
+		svg.append(wells.map((x) => SvgNodes.circle(t2r(x.wwit) * sc.k).add_style(styles.wit).move(x.lx, x.ly)));
+		// Знак скважины
+		svg.append(wells.map((x) => SvgNodes.circle(1.5 * sc.k).move(x.lx, x.ly).add_style(styles.wellhead)));
+		// Имя скважины
+		svg.append(wells.map((x) => SvgNodes.text(x.well).move(x.lx + styles.wellhead.dx * sc.k, x.ly + styles.wellhead.dy * sc.k).add_style(styles.wellhead)));
+		// Обводненность
+		svg.append(wells.map((x) => SvgNodes.text(`${Math.round(x.wlf * 1000)/10 || ''}%`).move(x.lx + styles.wlf.dx * sc.k, x.ly + styles.wlf.dy * sc.k).add_style(styles.wlf)));
+
+		return {defs, svg}
+	}
+
+}

src/svgmap/SvgMapBuilder.js

@@ -1,24 +1,101 @@
-export default class SvgMapBulder{
+import SvgNode from "./SvgNode.js";
-    	let WellsRenderer = {
+import SvgNodes from "./SvgNodes.js";
-		// [{x,y}]
+import SvgWellNodes from "./SvgWellNodes.js";
-		heads(wells, r, style) {
+
-			return wells.map((w) => SvgNodes.circle(r).set_style(style).move(w.x, w.y));
+export default {
+	/**
+	 * Преобразовать размер шрифта в единицы карты
+	 * @param { string | Number } v Значение для перевода "10mm", "22pt"
+	 * @param {*} ppu Pixel per unit
+	 * @returns
+	 */
+	fontsize2ppu(v, ppu) {
+		if (typeof v !== "string") return v;
+
+		if (v.endsWith("mm")) {
+			return parseFloat(v.substring(0, v.length - 2) * ppu * 100) / 69;
+		}
+		if (v.endsWith("pt")) {
+			return parseFloat(v.slice(0, v.length - 2)) * ppu * 100 / 283.46;
+		}
 	},
 
-		// [{x,y,name}]
+	/**
-		names(wells, style, shift) {
+	 * Перегоняет стиль в единицы карты (возвращает новый объект)
-			return wells.map((w) =>
+	 * @param {*} style Объект стиля для преобразования
-				SvgNodes.text(w.name)
+	 * @param {*} ppu Pixel per unit
-					.set_style(style)
+	 */
-					.move(w.x + shift.x, w.y + shift.y)
+	update_style(style, ppu) {
+		let s = Object.assign({}, style);
+		const convertable = ["font-size", "stroke-width", "1pt", "1mm"];
+		Object.keys(s).forEach((k) => {
+			if (convertable.includes(k)) s[k] = this.fontsize2ppu(s[k], ppu);
+		});
+		return s;
+	},
+
+	/**
+	 * Перегоняет все стили в единицы карты (возвращает новый объект)
+	 * @param {*} style Объект стиля для преобразования
+	 * @param {*} ppu Pixel per unit
+	 */
+	update_styles(styles, ppu) {
+		return Object.keys(styles).reduce((s, c) => ({ ...s, [c]: this.update_style(styles[c], ppu) }), {});
+	},
+
+	build_tp_layer(wells, settings) {
+		function t2r(tons) {
+			// tonns/mm2 = tonns/cm2 / 100. S(mm)=Pi*r*r=tons/tons_in_cm2*100. r = sqrt(tons/tons_in_cm2*100 / PI)
+			return Math.sqrt(((tons / settings.tons_in_cm2) * 100) / Math.PI);
+		}
+
+		let { ppu, styles } = settings;
+
+		let defs = new SvgNode("defs");
+		defs.append(SvgNodes.defs.simple.radialGradient("rg_opt", "#fff", "#B86B41"));
+		defs.append(SvgNodes.defs.simple.radialGradient("rg_wpt", "#fff", "#67c2e5"));
+
+		let svg = SvgNodes.group(['<metadata id="CorelCorpID_WWPTCorel-Layer"/>']).set_attr("id", "WWPT");
+		// Круги
+		svg.append(wells.map((x) => SvgWellNodes.ring.pt(x.wopt, x.wwpt, t2r(x.wlpt), ppu, styles).move(x.lx, x.ly)));
+
+		// Знак скважины
+		svg.append(
+			wells.map((x) => SvgWellNodes.wellhead[t2r(x.wlpt) > 1.6 ? "prod" : "gray"](ppu, styles).move(x.lx, x.ly))
 		);
+
+		// Имя скважины
+		svg.append(wells.map((x) => SvgWellNodes.wellhead.name(x.well, ppu, styles).move(x.lx, x.ly)));
+		// Обводненность
+		svg.append(wells.map((x) => SvgWellNodes.wellhead.wlp(x.wlf, ppu, styles).move(x.lx, x.ly)));
+
+		return { defs, svg };
 	},
 
-		// {x,y,ring[1,2,3,4,5]}
+	build_ti_layer(wells, settings) {
-		ring(x, y, r0, r1, a0, a1, style) {
+		function t2r(tons) {
-			return SvgNodes.ring_sector(r0, r1, a0, a1).move(x, y).set_style(style);
+			// tonns/mm2 = tonns/cm2 / 100. S(mm)=Pi*r*r=tons/tons_in_cm2*100. r = sqrt(tons/tons_in_cm2*100 / PI)
+			return Math.sqrt(((tons / settings.tons_in_cm2) * 100) / Math.PI);
+		}
+
+		let { ppu, styles } = settings;
+
+		let defs = new SvgNode("defs");
+		defs.append(SvgNodes.defs.simple.radialGradient("rg1", "#fff", "#c1ff5e"));
+
+		let svg = SvgNodes.group(['<metadata id="CorelCorpID_WWITCorel-Layer"/>']).set_attr("id", "WWIT");
+
+		// Круги
+		svg.append(wells.map((x) => SvgWellNodes.ring.it(t2r(x.wwit), ppu, styles).move(x.lx, x.ly)));
+
+		// Знак скважины
+		svg.append(
+			wells.map((x) => SvgWellNodes.wellhead[t2r(x.wwit) > 1.6 ? "inj" : "gray"](ppu, styles).move(x.lx, x.ly))
+		);
+
+		// Имя скважины
+		svg.append(wells.map((x) => SvgWellNodes.wellhead.name(x.well, ppu, styles).move(x.lx, x.ly)));
+
+		return { defs, svg };
 	},
 };
-
-
-}

src/svgmap/SvgMapParser.js

@@ -1,74 +0,0 @@
-// import convert from 'xml-js/index.js'
-// import { XMLParser, XMLBuilder, XMLValidator} from 'fast-xml-parser'
-import { parse } from 'svg-parser'
-
-// var convert = require('xml-js');
-
-export default class {
-    async parse(xml){
-        let result1 = parse(xml);
-
-        this.svg = result1.children.filter(x => x.tagName =='svg')[0]
-    }
-
-    get_layers(){
-        return this.svg.children.filter(x => x.tagName == 'g')
-    }
-
-    get_map_scale(){
-        // console.log(this.svg)
-        let vb = this.svg.properties.viewBox.split(' ').map(x => parseFloat(x))
-        let w = this.svg.properties.width
-        let h = this.svg.properties.height
-    
-        let units = {
-            'in': 25.4,
-            'mm': 1,
-            'cm': 10,
-            'px': 0.0846646,
-            // '%': 1
-        }
-    
-        const u = Object.keys(units).filter(x => w.endsWith(x))[0]
-        if (!u) throw "Unsupported units"
-    
-        w = Math.round(parseFloat(w.substring(0, w.length - u.length)) * units[u] * 100) / 100
-        h = Math.round(parseFloat(h.substring(0, h.length - u.length)) * units[u] * 100) / 100
-        let k = vb[2] / w
-    
-        return {w, h, k, u}        
-    }
-
-    extract_anchor(layer){
-        let w1 = this.extract_well(layer.children[layer.children.length - 1])
-        let w2 = this.extract_well(layer.children[layer.children.length - 2])
-
-        return{w1, w2}
-    }
-
-    _flat(node){
-        if (!node.children) return [node];
-        return node.children.reduce((s, c) => s.concat(this._flat(c)), [node])
-    }
-
-    extract_well(pivot_group){
-        let scale = this.get_map_scale()
-
-        let flat = this._flat(pivot_group)
-        ///// console.log('pivot_group', pivot_group.children)
-        // console.log('FLAT---', flat)
-        let ellipse = flat.filter(x => x.tagName =='circle' || x.tagName =='ellipse')[0]
-        // console.log('ellipse', ellipse)
-        let tr = ellipse.properties.transform.replace('matrix(', '').replace(')', '').split(' ').map(x => parseFloat(x))
-        // console.log('tr', tr)
-        // let x = ellipse.properties.transform
-        // let y = ellipse.cy.baseVal.value
-
-        let text = flat.filter(x => x.type =='text')[0]
-        // console.log('text', text)
-        let name = text.value
-        return {x: tr[4], y: tr[5], name}
-    }
-
-    
-}

src/svgmap/SvgNode.js

@@ -5,8 +5,8 @@ export default class SvgNode {
         this.items = items || []
     }
 
-    append(items){
+    append(...items){
-        this.items.push(items)
+        this.items.push(...items)
         return this
     }
 
@@ -20,17 +20,20 @@ export default class SvgNode {
         return this
     }
 
-    set_style(style) {
+    add_style(style) {
         this.style = { ...this.style || {}, ...style }
         return this
     }
 
-    clear_style(style) {
+    clear_style() {
         this.style = null
         return this
     }
 
     move(x, y) {
+        if (this.transform)
+            this.transform = { x: this.transform.x + x, y: this.transform.y + y }
+        else
             this.transform = { x, y }
         return this
     }
@@ -49,13 +52,16 @@ export default class SvgNode {
     }
 
     render() {
-        let attrs = Object.keys(this.attrs).map(x => ` ${x}="${this.attrs[x]}"`).join('')
+        let attrs = Object.keys(this.attrs).filter(x => this.attrs[x]).map(x => ` ${x}="${this.attrs[x]}"`).join('')
         // console.log(this.style ? Object.keys(this.style).map(x => `${x}:${this.style[x]}`) : '')
         let style = this.style ? ' style="' + Object.keys(this.style).map(x => `${x}:${this.style[x]}`).join('; ') + '"' : ''
         let transfrom = this.transform ? ` transform="translate(${this.transform.x},${this.transform.y})"` : ''
         let items = this.items ? this.items.map(x => this._render_node(x)).join('') : ''
 
         // console.log('this.items', this.items, items)
+        if (this.tag)
             return `<${this.tag}${attrs}${style}${transfrom}>${items}</${this.tag}>`
+        else
+            return items
     }
 }

src/svgmap/SvgNodes.js

@@ -26,6 +26,10 @@ export default {
         })
     },
 
+    container(items){
+        return new SvgNode(null, null, items)
+    },
+
     group(items){
         return new SvgNode("g", null, items)
     },
@@ -34,6 +38,22 @@ export default {
 		return new SvgNode("circle", {r})
 	},
 
+	ngon(r, n, ang = 0) {
+		const da = 2 * Math.PI / n
+		ang = ang * Math.PI / 180
+		const pts = Array(n).fill(0).map((x, i) => [Math.sin(i * da + ang) * r, Math.cos(i * da + ang) * r])
+		return new SvgNode("polygon", {points: pts.map(x => `${x[0]},${x[1]}`)})
+	},
+
+	spike1(w, h, ang){
+		const da = ang * Math.PI / 180
+		const sa = Math.sin(da)
+		const ca = Math.cos(da)
+		h = h / 2
+		const pts = `${-sa*h},${-ca*h} ${ca*w},${-sa*w}, ${sa*h},${ca*h}`
+		return new SvgNode("polygon", {points: pts})
+	},
+
 	sector(r, a0, a1) {
 		const k = Math.PI / 180;
 		let s0 = -Math.sin(a0 * k) * r;
@@ -65,13 +85,6 @@ export default {
 		});
 	},
 
-	text(text) {
-		let node = new SvgNode("text");
-		node.items = [text];
-		node.set_attrs({x: 0, y: 0})
-		return node;
-	},
-
 	/**
 	 * 
 	 * @param r0
@@ -80,12 +93,39 @@ export default {
 	 * @param a1
 	 * @param { [{v, style}] } rings
 	 */
-	 sectored_ring(r0, r1, rings){		
+	 ring_sectors(r0, r1, sectors){		
-		let sum = rings.reduce((s,c) => s + c.v, 0)
+		let sum = sectors.reduce((s,c) => s + c.v, 0)
-		let angs = rings.reduce((s, c, i) => [...s, {...c, a0: i && s[i - 1].a1, a1: c.v + (i && s[i - 1].a1)}], [])
+		let angs = sectors.reduce((s, c, i) => [...s, {...c, a0: i && s[i - 1].a1, a1: c.v + (i && s[i - 1].a1)}], [])
-		let items = angs.map(x => SvgNodes.ring_sector(r0, r1, x.a0 * 360 / sum, x.a1 * 360 / sum).set_style(x.style))
+		let items = angs.map(x => this.ring_sector(r0, r1, x.a0 * 360 / sum, x.a1 * 360 / sum).add_style(x.style))
+
+		return this.group(items)
+	},
+
+	text(text) {
+		let node = new SvgNode("text");
+		node.items = [text];
+		node.set_attrs({x: 0, y: 0})
+		return node;
+	},
+
+	defs: {
+		simple: {
+			radialGradient(id, color0, color1){
+				let s0 = new SvgNode("stop", {offset: "0%", "stop-color": color0})
+				let s1 = new SvgNode("stop", {offset: "100%", "stop-color": color1})
+				return new SvgNode("radialGradient", {id}).append(s0, s1)
+			}
+		},
+
+		radialGradient(id, cx, cy, r){
+			return new SvgNode("radialGradient", {id, cx, cy, r})
+		},
+
+		stop(offset, color){
+			return new SvgNode("stop", {offset, "stop-color": color})
+		},
+
 		
-		return SvgNodes.group(items)
 	}
 
 };

src/svgmap/SvgWellNodes.js

@@ -0,0 +1,86 @@
+import SvgNode from "./SvgNode.js";
+import SvgNodes from "./SvgNodes.js";
+
+export default {
+	wellhead: {
+		name(text, ppu, styles) {
+			return SvgNodes.text(text)
+				.move(styles["wellhead-name"].dx * ppu, styles["wellhead-name"].dy * ppu)
+				.add_style(styles["wellhead-name"]);
+		},
+
+		wlp(wlf, ppu, styles) {
+			return SvgNodes.text(`${Math.round(wlf * 1000) / 10 || ""}%`)
+				.move(styles.wlf.dx * ppu, styles.wlf.dy * ppu)
+				.add_style(styles.wlf);
+		},
+
+		/**
+		 * Добывающая скважина
+		 * @param {*} ppu
+		 * @param {*} styles
+		 * @returns
+		 */
+		prod(ppu, styles) {
+			return SvgNodes.circle(1.5 * ppu).add_style(styles["wellhead-black"]);
+		},
+
+		/**
+		 * Нагнетательная
+		 * @param {*} ppu
+		 * @param {*} styles
+		 * @returns
+		 */
+		inj(ppu, styles) {
+			const style_spike = {
+				"stroke-width": "0",
+				fill: '#000'
+			}
+
+			const style_blue = {
+				"stroke-width": Math.round(styles._units["1pt"]),
+				stroke: '#000',
+				fill: '#00f'
+			}
+
+			return SvgNodes.group([
+				SvgNodes.group([
+					SvgNodes.spike1(1.8 * ppu, 1.7 * ppu, 0).move(2 * ppu, 0),
+					SvgNodes.spike1(1.8 * ppu, 1.7 * ppu, 90).move(0, -2 * ppu),
+					SvgNodes.spike1(1.8 * ppu, 1.7 * ppu, 180).move(-2 * ppu, 0),
+					SvgNodes.spike1(1.8 * ppu, 1.7 * ppu, 270).move(0, 2 * ppu),
+				]).add_style(style_spike),
+				new SvgNode("line", { x1: -2 * ppu, x2: 2 * ppu, y1: 0, y2: 0 }),
+				new SvgNode("line", { y1: -2 * ppu, y2: 2 * ppu, x1: 0, x2: 0 }),
+				SvgNodes.circle(1.5 * ppu).add_style(style_blue)				
+			]).add_style(style_blue);
+		},
+
+		/**
+		 * Серая с треугольником с малым дебитом/нагнетанием
+		 * @param {*} ppu
+		 * @param {*} styles
+		 * @returns
+		 */
+		gray(ppu, styles) {
+			return SvgNodes.group([
+				SvgNodes.circle(1.5 * ppu).add_style(styles["wellhead-gray"]),
+				SvgNodes.ngon(1.5 * ppu, 3, 0).add_style(styles["wellhead-black"]),
+			]);
+		},
+	},
+
+	ring: {
+		pt(wopt, wwpt, rmm, ppu, styles) {
+			return SvgNodes.ring_sectors(1.5 * ppu, rmm * ppu, [
+				{ v: wopt, style: styles.opt },
+				{ v: wwpt, style: styles.wpt },
+			]);
+		},
+
+		it(rmm, ppu, styles) {
+			return SvgNodes.circle(rmm * ppu)
+				.add_style(styles.wit)			
+		}
+	},
+};

src/svgmap/drawers/SvgWell.js

@@ -1,21 +1,31 @@
 export default {
+    wellhead: {
+        prod(x, y, r, style){
+            return SvgNodes.circle(r).add_style(style).move(w.x, w.y);
+        },
+
+        inj(x, y, r, style){
+            return SvgNodes.circle(r).add_style(style).move(w.x, w.y);
+        }
+    },
+
     // [{x,y}]
     heads(wells, r, style) {
-        return wells.map((w) => SvgNodes.circle(r).set_style(style).move(w.x, w.y));
+        return wells.map((w) => SvgNodes.circle(r).add_style(style).move(w.x, w.y));
     },
 
     // [{x,y,name}]
     names(wells, style, shift) {
         return wells.map((w) =>
             SvgNodes.text(w.name)
-                .set_style(style)
+                .add_style(style)
                 .move(w.x + shift.x, w.y + shift.y)
         );
     },
 
     // {x,y,ring[1,2,3,4,5]}
     ring(x, y, r0, r1, a0, a1, style) {
-        return SvgNodes.ring_sector(r0, r1, a0, a1).move(x, y).set_style(style);
+        return SvgNodes.ring_sector(r0, r1, a0, a1).move(x, y).add_style(style);
     },
 };