import svgObject from "./svgOjbect"
|
import ConstParas from "@/utils/constParas.js";
|
import UnitHelper from "@/utils/unit.js";
|
import PointToleranceConfig from "./PointToleranceConfig.js";
|
|
const ZlpChartDiagram = function () {
|
var m_svg = null;
|
|
var m_unit = { Q: 1, H: 0, P: 1 }; //功率、流量、扬程单位集合
|
var m_pumpInfo; //泵基本信息
|
var m_wrkCurve4Pixel; //工作曲线
|
var m_displayStyle; //显示样式
|
var m_chartSize;
|
var m_localizationType = 0; //中文zhCN = 0, zhTW = 1, enUS = 2
|
var m_divChartName; //容器DIV名称
|
var m_chartSetting;
|
var m_coordinatePara; //坐标信息
|
var m_chartObject; //图表上的物体
|
var m_warterMarkText; //水印
|
|
|
var m_toolTipContent;
|
|
var m_dispEquipmentCurve = false; //装置曲线是否显示
|
var m_equipZeroH = 0; //装置曲线静扬程
|
|
|
|
|
|
//初始化显示设置
|
var initialDispStyle = function (displayStyle, chartSetting) {
|
if (displayStyle != null) {
|
m_displayStyle = displayStyle;
|
} else {
|
m_displayStyle = {};
|
m_displayStyle.IsMonoColor = false;
|
m_displayStyle.DesignPointDispType = 0; //设计点显示方式(eDesignPointDispType) Cross 0 LeftDownTriangle 2
|
}
|
|
m_displayStyle.GridLine = {
|
"stroke": "#cccccc",
|
"stroke-width": "1",
|
"fill": "none",
|
"zIndex": 10
|
};
|
|
|
m_displayStyle.ColorH = "#0000ff";
|
m_displayStyle.ColorE = "#8e870e";
|
m_displayStyle.ColorEquipment = "#013317";
|
|
if(m_displayStyle.IsMonoColor){
|
m_displayStyle.ColorH = "#000000";
|
m_displayStyle.ColorE = "#000000";
|
m_displayStyle.ColorP = "#000000";
|
m_displayStyle.ColorNPSH = "#000000";
|
m_displayStyle.ColorEquipment = "#000000";
|
m_displayStyle.ColorEqualParaCurvesE = "#000000";
|
m_displayStyle.ColorCurveLabel = "#000000";
|
}
|
|
m_displayStyle.ColorCurveSize = 10;
|
if (m_displayStyle.IsDispCurveLabel == null)
|
m_displayStyle.IsDispCurveLabel = true;
|
|
m_displayStyle.isAxisIntervalX = true;
|
m_displayStyle.isDispMiniTick = true; //是否显示子刻度
|
m_displayStyle.MiniTickNumber = 1;
|
};
|
//转成Bezier曲线模型
|
var transBezierCurveModel = function (pixelPoints) {
|
if (pixelPoints == null || pixelPoints.length < 4)
|
return null;
|
|
var iPointCout = pixelPoints.length;
|
var a = 0.09;
|
var b = 0.09;
|
var controlPoint = new Array();
|
|
for (var i = 0; i < iPointCout - 1; i++) {
|
var bezier = {};
|
bezier.Point0 = pixelPoints[i];
|
if (i == 0) {
|
var x1 = pixelPoints[i].X + a * (pixelPoints[i + 1].X - pixelPoints[i].X);
|
var y1 = pixelPoints[i].Y + a * (pixelPoints[i + 1].Y - pixelPoints[i].Y);
|
bezier.Point1 = {
|
"X": x1,
|
"Y": y1
|
};
|
} else {
|
var x1 = pixelPoints[i].X + a * (pixelPoints[i + 1].X - pixelPoints[i - 1].X);
|
var y1 = pixelPoints[i].Y + a * (pixelPoints[i + 1].Y - pixelPoints[i - 1].Y);
|
bezier.Point1 = {
|
"X": x1,
|
"Y": y1
|
}
|
}
|
|
if (i == iPointCout - 2) {
|
var x2 = pixelPoints[i + 1].X - b * (pixelPoints[i + 1].X - pixelPoints[i].X);
|
var y2 = pixelPoints[i + 1].Y - b * (pixelPoints[i + 1].Y - pixelPoints[i].Y);
|
bezier.Point2 = {
|
"X": x2,
|
"Y": y2
|
}
|
} else {
|
var x2 = pixelPoints[i + 1].X - b * (pixelPoints[i + 2].X - pixelPoints[i].X);
|
var y2 = pixelPoints[i + 1].Y - b * (pixelPoints[i + 2].Y - pixelPoints[i].Y);
|
bezier.Point2 = {
|
"X": x2,
|
"Y": y2
|
}
|
}
|
|
bezier.Point3 = pixelPoints[i + 1];
|
controlPoint.push(bezier);
|
}
|
return controlPoint;
|
};
|
|
//转成曲线路径
|
var transBezierCurveToPath = function (pixelPoints) {
|
var bezierCurveValue = transBezierCurveModel(pixelPoints);
|
if (bezierCurveValue == null) {
|
return;
|
}
|
var pathValue = new Array();
|
for (var h = 0; h < bezierCurveValue.length; h++) {
|
if (h == 0) {
|
pathValue.push("M ", bezierCurveValue[h].Point0.X, " ", bezierCurveValue[h].Point0.Y);
|
pathValue.push(" C ", bezierCurveValue[h].Point1.X, " ", bezierCurveValue[h].Point1.Y, " ", bezierCurveValue[h].Point2.X, " ", bezierCurveValue[h].Point2.Y, " ", bezierCurveValue[h].Point3.X, " ", bezierCurveValue[h].Point3.Y);
|
} else {
|
pathValue.push(" L ", bezierCurveValue[h].Point0.X, " ", bezierCurveValue[h].Point0.Y);
|
pathValue.push(" C ", bezierCurveValue[h].Point1.X, " ", bezierCurveValue[h].Point1.Y, " ", bezierCurveValue[h].Point2.X, " ", bezierCurveValue[h].Point2.Y, " ", bezierCurveValue[h].Point3.X, " ", bezierCurveValue[h].Point3.Y);
|
}
|
if (h == bezierCurveValue.length - 1) {
|
pathValue.push(" L ", bezierCurveValue[h].Point3.X, " ", bezierCurveValue[h].Point3.Y);
|
}
|
}
|
return pathValue;
|
};
|
|
var getActualValue = function (actualMinValue, actualMaxValue, pixelMinValue, pixelMaxValue, pixelValue) {
|
var actual = null;
|
actual = (pixelValue - pixelMinValue) / (pixelMaxValue - pixelMinValue) * (actualMaxValue - actualMinValue) + actualMinValue;
|
// actual = (pixelValue - pixelMinValue) / (pixelMaxValue - pixelMinValue) * (actualMaxValue - actualMinValue) + pixelMinValue;
|
return actual;
|
};
|
// actualValue 是标准单位下的值
|
var getPixelValueQ = function(actualValue) {
|
//console.log(actualValue)
|
var min= UnitHelper.ConvertQ_toM3H(m_coordinatePara.UnitQ, m_coordinatePara.CoordMinQ) ;
|
var space = UnitHelper.ConvertQ_toM3H(m_coordinatePara.UnitQ, m_coordinatePara.CoordSpaceQ);
|
return m_chartSize.SpaceLeft + (actualValue -
|
min ) * m_chartSize.DiagramWidth / ( space * m_coordinatePara.GridNumberQ);
|
|
//return (actualValue - actualMinValue) / (actualMaxValue - actualMinValue) * (pixelMaxValue - pixelMinValue) + pixelMinValue;
|
};
|
var getPixelValueH = function(actualValue) {
|
|
return m_chartSize.DiagramBottomY - (actualValue - m_coordinatePara.CoordMinH) * m_chartSize.DiagramHeight / (m_coordinatePara.CoordSpaceH * m_coordinatePara.GridNumberH);
|
};
|
var getPixelValue = function (actualValue, actualMinValue, actualMaxValue, pixelMinValue, pixelMaxValue) {
|
return (actualValue - actualMinValue) / (actualMaxValue - actualMinValue) * (pixelMaxValue - pixelMinValue) + pixelMinValue;
|
};
|
|
var getSectPoint4Pixel = function (curve, x) {
|
|
var iPtCount = curve.length;
|
|
if (x < curve[0].Point0.X) {
|
return null;
|
}
|
if (x > curve[iPtCount - 1].Point3.X) {
|
return null;
|
}
|
|
for (var i = 0; i < iPtCount; i++) {
|
|
if (x > curve[i].Point0.X && x < curve[i].Point3.X) {
|
var ptBizer = curve[i];
|
//
|
try {
|
//alert(i);
|
var minDis = Math.abs(ptBizer.Point3.X - ptBizer.Point0.X);
|
//alert(x + " " + curve[i].Point0.X + " " + curve[i].Point3.X);
|
var sectY = 0;
|
var sectX = 0;
|
for (var uu = 0; uu <= 1; uu = uu + 0.05) {
|
var x0 = ptBizer.Point0.X * uu * uu * uu;
|
var x1 = 3 * ptBizer.Point1.X * uu * uu * (1 - uu);
|
var x2 = 3 * ptBizer.Point2.X * uu * (1 - uu) * (1 - uu);
|
var x3 = ptBizer.Point3.X * (1 - uu) * (1 - uu) * (1 - uu);
|
|
var curveX = x0 + x1 + x2 + x3;
|
if (Math.abs(curveX - x) < minDis) {
|
var y0 = ptBizer.Point0.Y * uu * uu * uu;
|
var y1 = 3 * ptBizer.Point1.Y * uu * uu * (1 - uu);
|
var y2 = 3 * ptBizer.Point2.Y * uu * (1 - uu) * (1 - uu);
|
var y3 = ptBizer.Point3.Y * (1 - uu) * (1 - uu) * (1 - uu);
|
minDis = Math.abs(curveX - x);
|
sectY = y0 + y1 + y2 + y3;
|
sectX = curveX;
|
}
|
}
|
return {
|
x: sectX,
|
y: sectY
|
};
|
} catch (ex) {
|
alert(ex.message);
|
}
|
}
|
|
}
|
};
|
|
//通过流量获取扬程
|
var getHbyQ4WrkWaterCurve = function (q) {
|
var qPixel = getPixelValue(q, m_coordinatePara.CoordMinQ, m_coordinatePara.CoordMaxQ, m_chartSize.SpaceLeft, m_chartSize.DiagramRightX);
|
var r = getSectPoint4Pixel(m_wrkCurve4Pixel, qPixel);
|
if (r == null)
|
return 0;
|
return getActualValue(m_coordinatePara.CoordMinH, m_coordinatePara.CoordMaxH, m_chartSize.DiagramBottomY, m_chartSize.SpaceTop, r.y);
|
};
|
|
//通过流量获取效率
|
var getEbyQ4WrkWaterCurve = function (q) {
|
var qPixel = getPixelValue(q, m_coordinatePara.CoordMinQ, m_coordinatePara.CoordMaxQ, m_chartSize.SpaceLeft, m_chartSize.DiagramRightX);
|
var r = getSectPoint4Pixel(m_wrkCurve4Pixel.QE, qPixel);
|
if (r == null)
|
return 0;
|
return getActualValue(m_coordinatePara.CoordMinE, m_coordinatePara.CoordMaxE, m_chartSize.DiagramBottomY, m_chartSize.SpaceTop, r.y);
|
};
|
|
//通过流量获取功率
|
var getPbyQ4WrkWaterCurve = function (q) {
|
var qPixel = getPixelValue(q, m_coordinatePara.CoordMinQ, m_coordinatePara.CoordMaxQ, m_chartSize.SpaceLeft, m_chartSize.DiagramRightX);
|
var r = getSectPoint4Pixel(m_wrkCurve4Pixel.QP, qPixel);
|
if (r == null)
|
return 0;
|
return getActualValue(m_coordinatePara.CoordMinP, m_coordinatePara.CoordMaxP, m_chartSize.DiagramBottomY, m_chartSize.SpaceTop, r.y);
|
};
|
//
|
var getSvgObjByName = function (objName) {
|
return m_svg.getPathByName(objName);
|
};
|
|
//查询线
|
var m_infoDv4VerticalLine;
|
var m_verticalLine;
|
var m_dispVerticalLine = false;
|
var dispVerticalLine = function (disp) {
|
m_dispVerticalLine = disp;
|
if(m_infoDv4VerticalLine){
|
if (disp) {
|
m_infoDv4VerticalLine.show();
|
m_verticalLine.show();
|
} else {
|
//console.log(m_infoDv4VerticalLine, 210)
|
m_infoDv4VerticalLine.hide();
|
m_verticalLine.hide();
|
}
|
}
|
|
};
|
|
var intersection = function (isShow) {
|
//alert(m_svg.getPathByName("verticalLine"));
|
|
if (isShow) {
|
$(m_svg.getPathByName("verticalLine")).show();
|
} else {
|
$(m_svg.getPathByName("verticalLine")).hide();
|
//$("#verticalLine").hide();
|
}
|
};
|
|
var createVerticalLine = function () {
|
|
if ($("#infoDv4VerticalLine").is("div")) {
|
$("#infoDv4VerticalLine").remove();
|
}
|
|
//先创建用于放置查询信息的Div
|
var htmlDiv = "<lable style='font-size:6px'>流量</label>";
|
$("#" + m_divChartName).append($("<div id='infoDv4VerticalLine'></div>").css({
|
"position": "relative", //relative absolute
|
"color": "gray",
|
"font-size": "8px",
|
//"font-family": "Times New Roman",
|
//"font-weight": "bold",
|
"width": "120px",
|
"left": (m_chartSize.DiagramRightX - 100).toString() + "px",
|
"top": (12 - m_chartSize.TotalHeight).toString() + "px", // + m_divChartName + "px"
|
}).html(htmlDiv).hide());
|
|
m_infoDv4VerticalLine = $("#infoDv4VerticalLine");
|
//console.log(m_infoDv4VerticalLine, 247)
|
|
var attr4verticalLine = {
|
"stroke": "#A52A2A",
|
"stroke-width": "2",
|
"fill": "none",
|
"zIndex": 100,
|
"cursor": 'pointer',
|
"stroke-opacity": '1',
|
"shape-rendering": "geometricPrecision",
|
};
|
|
var xStartValuePixel = (m_chartSize.SpaceLeft + m_chartSize.DiagramRightX) / 2; // 开始位置
|
|
|
//创建竖直线
|
var pathValue = new Array();
|
var vertialLinePathName = "verticalLine";
|
pathValue.push("M ", xStartValuePixel, " ", m_chartSize.SpaceTop, " L ", xStartValuePixel, " ", m_chartSize.DiagramBottomY);
|
m_svg.createPath(vertialLinePathName, pathValue.join(''), {
|
id: vertialLinePathName
|
}, attr4verticalLine, null);
|
var xPixel = xStartValuePixel
|
dispQueryLineInfo(xStartValuePixel);
|
|
|
|
var isMoveVerticalLine = false;
|
//m_svg.getPathByName("verticalLine")
|
m_verticalLine = $(getSvgObjByName(vertialLinePathName));
|
m_verticalLine.mousedown(function (e) {
|
isMoveVerticalLine = true;
|
//WebApp.stopDefault(e);
|
e.preventDefault();
|
// $("#infoDv4VerticalLine").show();
|
//$("#infoDv4VerticalLine").show().css({
|
// "left": e.clientX + 5,
|
// "top": e.clientY
|
//});
|
});
|
|
$(document).mousemove(function (e) {
|
var svg = m_svg.getNode();
|
|
if (isMoveVerticalLine) {
|
var e = window.event || e;
|
if (e.clientX - $(svg).offset().left > m_chartSize.SpaceLeft &&
|
m_chartSize.DiagramRightX + $(svg).offset().left - e.clientX > 0 &&
|
e.clientY - $(svg).offset().top > m_chartSize.SpaceTop &&
|
m_chartSize.DiagramBottomY + $(svg).offset().top - e.clientY > 0) {
|
//x的像素
|
var xPixel2 = parseFloat(e.clientX - $(svg).offset().left);
|
|
dispQueryLineInfo(xPixel2);
|
|
var pathValue = new Array();
|
pathValue.push("M ", e.clientX - $(svg).offset().left,
|
" ", m_chartSize.SpaceTop, " L ", e.clientX - $(svg).offset().left, " ", m_chartSize.DiagramBottomY);
|
m_verticalLine.attr("d", pathValue.join('')); //修改位置
|
}
|
}
|
}).mouseup(function (e) {
|
if (isMoveVerticalLine) {
|
isMoveVerticalLine = false;
|
//m_verticalLine.hide();
|
}
|
});
|
|
|
//设置显示
|
dispVerticalLine(m_dispVerticalLine);
|
};
|
|
var dispQueryLineInfo = function (xPixel) { //x的像素
|
|
var flow = "流量";
|
var head = "扬程";
|
|
if (m_localizationType == 2) {
|
flow = "Q";
|
head = "H";
|
}
|
|
flow = flow + " : " + parseFloat(getActualValue(m_coordinatePara.CoordMinQ, m_coordinatePara.CoordMaxQ, m_chartSize.SpaceLeft, m_chartSize.DiagramRightX, xPixel)).toFixed(1);
|
flow = flow; //+ "m³/h";
|
var hPt = getSectPoint4Pixel(m_wrkCurve4Pixel, xPixel);
|
if (hPt == null)
|
return;
|
var h = getActualValue(m_coordinatePara.CoordMinH, m_coordinatePara.CoordMaxH, m_chartSize.DiagramBottomY, m_chartSize.SpaceTop, hPt.y);
|
head = head + " : " + h.toFixed(1);
|
head = head; //+ "m";
|
|
|
m_infoDv4VerticalLine.show().html(flow + "</br>" + head + "</br>");
|
};
|
|
var svgClick = function (e, svg) {
|
if (m_toolTipContent == null)
|
return;
|
if (e.clientX - $(svg).offset().left > m_chartSize.SpaceLeft && m_chartSize.DiagramRightX + $(svg).offset().left - e.clientX > 0 &&
|
e.clientY - $(svg).offset().top > m_chartSize.SpaceTop && m_chartSize.DiagramBottomY + $(svg).offset().top - e.clientY > 0) {
|
|
var htmlContent = new Array();
|
var xPixel = e.clientX - $(svg).offset().left;
|
var yPixel = e.clientY + $(document).scrollTop() - $(svg).offset().top; //可视区域 滚动有问题,所以要加上$(document).scrollTop()
|
|
|
var flow = "点击处: 流量";
|
var head = "扬程";
|
|
var power = "功率";
|
if (m_localizationType == 2) {
|
flow = "Click point : Q";
|
head = "H";
|
cavitation = "NPSH";
|
}
|
|
|
flow = flow + " : " + parseFloat(getActualValue(m_coordinatePara.CoordMinQ, m_coordinatePara.CoordMaxQ, m_chartSize.SpaceLeft, m_chartSize.DiagramRightX, xPixel)).toFixed(1);
|
htmlContent.push(flow + " m³/h");
|
htmlContent.push(" ");
|
|
|
if (yPixel <= m_coordinatePara.ValidPixelMinH && yPixel >= m_coordinatePara.ValidPixelMaxH) {
|
head = head + " : " + parseFloat(getActualValue(m_coordinatePara.CoordMinH, m_coordinatePara.CoordMaxH, m_chartSize.DiagramBottomY, m_chartSize.SpaceTop, yPixel)).toFixed(1);
|
//alert(yPixel); alert(head);
|
htmlContent.push(head + " m");
|
htmlContent.push(" ");
|
}
|
|
|
m_toolTipContent.html(htmlContent.join(''));
|
}
|
|
|
};
|
|
var svgMove = function (e, svg) {
|
//alert("svgMove");
|
};
|
|
//初始化面板
|
var initialPanelSize = function ( ) {
|
var divName = m_divChartName;
|
if (divName == null) {
|
return;
|
}
|
if (m_chartSize == null) {
|
m_chartSize = {};
|
m_chartSize.TotalWidth = document.getElementById(divName).clientWidth;
|
m_chartSize.TotalHeight = document.getElementById(divName).clientHeight;
|
}
|
if (m_chartSize.TotalHeight < 400)
|
m_chartSize.TotalHeight = 400;
|
|
var space_left = 44;
|
var space_right = 12;
|
var space_top = 15;
|
var space_bottom = 55;
|
|
if (m_localizationType == 2) {
|
space_left = 65;
|
space_right = 65;
|
}
|
|
m_chartSize.DiagramWidth = m_chartSize.TotalWidth - space_left - space_right;
|
m_chartSize.DiagramHeight = m_chartSize.TotalHeight - space_top - space_bottom;
|
|
m_chartSize.SpaceLeft = space_left;
|
m_chartSize.SpaceTop = space_top;
|
m_chartSize.SpaceRight = space_right;
|
m_chartSize.SpaceBottom = space_bottom;
|
|
m_chartSize.DiagramRightX = m_chartSize.TotalWidth - space_right;
|
m_chartSize.DiagramBottomY = m_chartSize.TotalHeight - space_bottom;
|
|
m_coordinatePara.SpaceSpixelX = m_chartSize.DiagramWidth / m_coordinatePara.GridNumberQ;
|
m_coordinatePara.SpaceSpixelY = m_chartSize.DiagramHeight / m_coordinatePara.GridNumberH;
|
|
m_coordinatePara.ValidPixelMinH = m_chartSize.DiagramBottomY - m_coordinatePara.SpaceSpixelY * m_coordinatePara.StartLineNoH;
|
m_coordinatePara.ValidPixelMaxH = m_chartSize.DiagramBottomY - m_coordinatePara.SpaceSpixelY * m_coordinatePara.EndLineNoH;
|
|
|
//把间隙弄小点
|
var areaAttr = {
|
x: space_left,
|
y: space_top,
|
width: m_chartSize.DiagramWidth,
|
height: m_chartSize.DiagramHeight
|
};
|
|
var areaStyle = {
|
"stroke-width": "1px",
|
"stroke": "#cccccc",
|
"fill": "#ffffff",
|
"fill-opacity": "0.5",
|
"zIndex:": 5
|
};
|
|
//
|
//console.log(m_chartSize);
|
m_svg = new svgObject().init(divName, m_chartSize.TotalWidth, m_chartSize.TotalHeight, svgClick, svgMove);
|
|
//
|
m_svg.createArea(areaAttr, areaStyle);
|
};
|
|
//初始化工作曲线
|
var intitalWrkCurveInfo = function () {
|
|
m_wrkCurve4Pixel = null;
|
|
if (m_chartObject.WorkCurve != null) {
|
var pixelPoints = new Array();
|
|
var points = m_chartObject.WorkCurve;
|
for (var v = 0; v < points.length; v++) {
|
var pt = points[v];
|
var x = m_chartSize.SpaceLeft + (pt.X - m_coordinatePara.CoordMinQ) * m_chartSize.DiagramWidth / (m_coordinatePara.CoordSpaceQ * m_coordinatePara.GridNumberQ);
|
var y = m_chartSize.DiagramBottomY - (pt.Y - m_coordinatePara.CoordMinH) * m_chartSize.DiagramHeight / (m_coordinatePara.CoordSpaceH * m_coordinatePara.GridNumberH);
|
pixelPoints.push({
|
"X": x,
|
"Y": y
|
});
|
}
|
|
m_wrkCurve4Pixel = transBezierCurveModel(pixelPoints);
|
} else {
|
|
for (var i = 0; i < m_chartObject.CurveListQH.length; i++) {
|
if (m_chartObject.CurveListQH[i].CurvePara == 0) {
|
var pixelPoints = new Array();
|
|
var points = m_chartObject.CurveListQH[i].PointInfo;
|
for (var v = 0; v < points.length; v++) {
|
var pt = points[v];
|
var x = m_chartSize.SpaceLeft + (pt.X - m_coordinatePara.CoordMinQ) * m_chartSize.DiagramWidth / (m_coordinatePara.CoordSpaceQ * m_coordinatePara.GridNumberQ);
|
var y = m_chartSize.DiagramBottomY - (pt.Y - m_coordinatePara.CoordMinH) * m_chartSize.DiagramHeight / (m_coordinatePara.CoordSpaceH * m_coordinatePara.GridNumberH);
|
pixelPoints.push({
|
"X": x,
|
"Y": y
|
});
|
}
|
|
m_wrkCurve4Pixel = transBezierCurveModel(pixelPoints);
|
}
|
}
|
}
|
|
};
|
|
//产生网格线竖直方向
|
var createGridLineX = function () {
|
if (m_coordinatePara == null) {
|
return;
|
}
|
|
var attr = {
|
"stroke": "#cccccc",
|
"stroke-width": "1",
|
"fill": "none",
|
"zIndex": 10
|
};
|
if (m_displayStyle != null && m_displayStyle.GridLine != null) {
|
attr = m_displayStyle.GridLine;
|
}
|
|
for (var i = 0; i <= m_coordinatePara.GridNumberQ; i++) {
|
var distance = m_coordinatePara.SpaceSpixelX * i;
|
var valueTemp = new Array();
|
valueTemp.push("M ", m_chartSize.SpaceLeft + distance, " ", m_chartSize.SpaceTop, " L ", m_chartSize.SpaceLeft + distance, " ", m_chartSize.DiagramBottomY);
|
m_svg.createPath("GridLienX" + i, valueTemp.join(''), attr, null);
|
}
|
|
|
};
|
|
//产生网格线水平方向
|
var createGridLineY = function () {
|
if (m_coordinatePara == null) {
|
return;
|
}
|
|
var attr = {
|
"stroke": "#cccccc",
|
"stroke-width": "1",
|
"fill": "none",
|
"zIndex": 10
|
};
|
if (m_displayStyle != null && m_displayStyle.GridLine != null) {
|
attr = m_displayStyle.GridLine;
|
}
|
|
for (var i = 0; i <= m_coordinatePara.GridNumberH; i++) {
|
var distance = m_coordinatePara.SpaceSpixelY * i;
|
var valueTemp = new Array();
|
valueTemp.push("M ", m_chartSize.SpaceLeft, " ", m_chartSize.SpaceTop + distance, " L ", m_chartSize.DiagramRightX, " ", m_chartSize.SpaceTop + distance);
|
m_svg.createPath("GridLienY" + i, valueTemp.join(''), attr, null);
|
}
|
};
|
//翻译
|
var getTranslateString = function(cn) {
|
if (m_localizationType == 0)
|
return cn;
|
if (cn == "流量")
|
return "Flow";
|
else if (cn == "压力")
|
return "Press";
|
else if (cn == "扬程")
|
return "Head";
|
else if (cn == "效率")
|
return "Eta";
|
else if (cn == "功率")
|
return "Power";
|
else
|
return cn;
|
};
|
//绘制x坐标(含标题)
|
var createXAxis = function () {
|
if (m_coordinatePara == null) {
|
return;
|
}
|
|
//刻度线
|
var attrAxisTickX = {
|
"stroke": "black",
|
"stroke-width": "1",
|
"fill": "none",
|
"zIndex": 10
|
};
|
|
//刻度长度
|
var minTickLength = 4;
|
var tickLength = 6;
|
|
//刻度文字
|
var styleAxisLabelX = "font-size:10px;fill:red;fill-opacity:1;fill:black;"; //font-weight:bold
|
|
//标题文字
|
var styleAxisTitleX = "font-size:12px;fill:red;fill-opacity:1;fill:black;font-weight:bold;"; //
|
|
m_displayStyle.isAxisIntervalX = false;
|
m_displayStyle.isRotateLabelX = false;
|
if(m_coordinatePara.GridNumberQ >7){
|
m_displayStyle.isAxisIntervalX = true;
|
m_displayStyle.isRotateLabelX = true;
|
}
|
|
|
//
|
for (var i = 0; i <= m_coordinatePara.GridNumberQ; i++) {
|
var q = (m_coordinatePara.CoordMinQ + i * m_coordinatePara.CoordSpaceQ);
|
// console.log(q,m_displayStyle.isAxisIntervalX)
|
var content = UnitHelper.valueFormat(q);// UnitHelper.valueFormat(UnitHelper.getDispValueQ(UnitHelper.ConvertQ_fromM3H(m_unit.Q, q)));
|
|
var posiX_grid = m_chartSize.SpaceLeft + m_coordinatePara.SpaceSpixelX * i;
|
|
//刻度线
|
var valueMain = new Array();
|
valueMain.push("M ", posiX_grid, " ", m_chartSize.DiagramBottomY, " L ", posiX_grid, " ", m_chartSize.DiagramBottomY + tickLength);
|
m_svg.createPath("TickLineX" + i, valueMain.join(''), attrAxisTickX, null);
|
|
|
|
//文字 m_isAxisIntervalX
|
var label_y = m_chartSize.DiagramBottomY + tickLength + 12;
|
if (m_displayStyle.isRotateLabelX)
|
label_y = label_y + 1;
|
var attrAxisLabelX = {
|
"opacity": 1,
|
"x": posiX_grid,
|
"y": label_y,
|
"text-anchor": "middle"
|
};
|
var transform = null;
|
if (m_displayStyle.isRotateLabelX)
|
transform = "rotate(45 " + posiX_grid + "," + label_y + ")";
|
if ( m_displayStyle.isAxisIntervalX) {
|
if (i % 2 == 0)
|
m_svg.createText(attrAxisLabelX, styleAxisLabelX, content, 10, null, transform);
|
} else {
|
m_svg.createText(attrAxisLabelX, styleAxisLabelX, content, 10, null, transform);
|
}
|
|
//子刻度线
|
if (m_displayStyle.isDispMiniTick && i != m_coordinatePara.GridNumberQ) {
|
for (var j = 0; j <= m_displayStyle.MiniTickNumber; j++) {
|
var pois_minTick = posiX_grid + m_coordinatePara.SpaceSpixelX * j / (m_displayStyle.MiniTickNumber + 1);
|
var valueMini = new Array();
|
valueMini.push("M ", pois_minTick, " ", m_chartSize.DiagramBottomY, " L ", pois_minTick, " ", m_chartSize.DiagramBottomY + minTickLength);
|
m_svg.createPath("TickMinLineX" + i, valueMini.join(''), attrAxisTickX, null);
|
}
|
}
|
}
|
|
var attrAxisTitleX = {
|
"opacity": 1,
|
"x": (m_chartSize.SpaceLeft + m_chartSize.DiagramRightX) / 2,
|
"y": m_chartSize.DiagramBottomY + 38,
|
"text-anchor": "middle"
|
};
|
|
if (m_displayStyle.isRotateLabelX)
|
attrAxisTitleX.y = attrAxisTitleX.y + 12;
|
let unit_name = UnitHelper.GetUnitNameQ(m_unit.Q);
|
var axis_title = getTranslateString("流量") + " (" + unit_name + ")";
|
m_svg.createText(attrAxisTitleX, styleAxisTitleX,axis_title );
|
};
|
|
//绘制Y坐标(含标题)
|
var createYAxis = function () {
|
if (m_coordinatePara == null) {
|
return;
|
}
|
|
//刻度长度
|
var minTickLength = 3;
|
var tickLength = 6;
|
|
|
//刻度线
|
var attrAxisTickH = {
|
"stroke": m_displayStyle.ColorH,
|
"stroke-width": "1",
|
"fill": "none"
|
};
|
|
//刻度文字
|
var styleAxisLabelH = "font-size:10px; fill-opacity:1; fill:" + m_displayStyle.ColorH + ";";
|
//标签
|
var styleAxisTitleH = "font-size:12px; ;fill-opacity:1; font-weight:bold; fill:" + m_displayStyle.ColorH + ";";
|
|
//标签
|
var attrAxisTitleH = {
|
"opacity": 1,
|
"x": m_chartSize.SpaceLeft - 32,
|
"y": m_chartSize.DiagramBottomY - m_chartSize.DiagramHeight / 2,
|
"text-anchor": "middle"
|
};
|
|
if (m_localizationType == 0) { //中文
|
attrAxisTitleH.y = attrAxisTitleH.y - 5;
|
m_svg.createText(attrAxisTitleH, styleAxisTitleH, "扬");
|
attrAxisTitleH.y = attrAxisTitleH.y + 15;
|
m_svg.createText(attrAxisTitleH, styleAxisTitleH, "程");
|
if (m_coordinatePara.UnitH == 0) {
|
attrAxisTitleH.y = attrAxisTitleH.y + 18;
|
m_svg.createText(attrAxisTitleH, styleAxisTitleH, "(m)");
|
}
|
} else {
|
attrAxisTitleH.y = attrAxisTitleH.y + 15;
|
attrAxisTitleH.x = attrAxisTitleH.x - 5;
|
m_svg.createText(attrAxisTitleH, styleAxisTitleH, "Head");
|
if (m_coordinatePara.UnitH == 0) {
|
attrAxisTitleH.y = attrAxisTitleH.y + 18;
|
m_svg.createText(attrAxisTitleH, styleAxisTitleH, "(m)");
|
}
|
}
|
|
|
//
|
for (var i = 0; i <= m_coordinatePara.GridNumberH; i++) {
|
var content = UnitHelper.valueFormat(m_coordinatePara.CoordMinH + i * m_coordinatePara.CoordSpaceH);
|
|
var posiY_grid = m_chartSize.DiagramBottomY - m_coordinatePara.SpaceSpixelY * i;
|
//主刻度
|
var valueMain = new Array();
|
valueMain.push("M ", m_chartSize.SpaceLeft, " ", posiY_grid, " L ", m_chartSize.SpaceLeft - tickLength, " ", posiY_grid);
|
m_svg.createPath("TickLineH" + i, valueMain.join(''), attrAxisTickH, null);
|
|
//文字
|
var attrAxisLabelH = {
|
"opacity": 1,
|
"x": m_chartSize.SpaceLeft - 10,
|
"y": posiY_grid + 9,
|
"text-anchor": "end"
|
};
|
|
m_svg.createText(attrAxisLabelH, styleAxisLabelH, content);
|
|
//子刻度线
|
if (m_displayStyle.isDispMiniTick && i != m_coordinatePara.EndLineNoH) {
|
for (var j = 1; j <= m_displayStyle.MiniTickNumber; j++) {
|
var pois_minTick = posiY_grid - m_coordinatePara.SpaceSpixelY * j / (m_displayStyle.MiniTickNumber + 1);
|
var valueMini = new Array();
|
valueMini.push("M ", m_chartSize.SpaceLeft, " ", pois_minTick, " L ", m_chartSize.SpaceLeft - minTickLength, " ", pois_minTick);
|
m_svg.createPath("TickMinLineH" + i, valueMini.join(''), attrAxisTickH, null);
|
}
|
}
|
}
|
|
|
};
|
|
//产生装置曲线
|
var CreateEquipmentCurve = function () {
|
$("#EquipmentCurve").remove();
|
if (m_chartObject.EquipmentSectPt == null)
|
return;
|
var pointNumber = 20;
|
var EquipmentCurve = [];
|
var space = m_chartObject.EquipmentSectPt.X / (pointNumber - 1);
|
var k = (m_chartObject.EquipmentSectPt.Y - m_equipZeroH) / (m_chartObject.EquipmentSectPt.X * m_chartObject.EquipmentSectPt.X);
|
for (var i = 0; i < pointNumber; i++) {
|
var pt = {};
|
pt.X = space * i;
|
pt.Y = m_equipZeroH + k * pt.X * pt.X;
|
EquipmentCurve.push(pt);
|
}
|
createCurveQH("EquipmentCurve", EquipmentCurve, 1, m_displayStyle.ColorEquipment, m_dispEquipmentCurve);
|
};
|
|
|
//绘制曲线
|
var createCurveQH = function (objName, points, curveWidth, curveColor, isDisp, strokeDasharray) {
|
if (points == null) {
|
return;
|
}
|
if (objName == null) {
|
return;
|
}
|
|
|
var pixelPoints = new Array();
|
for (var v = 0; v < points.length; v++) {
|
var pt = points[v];
|
var x = getPixelValueQ(pt.X);
|
var y = getPixelValueH(pt.Y);
|
|
pixelPoints.push({
|
"X": x,
|
"Y": y
|
});
|
}
|
|
var pathValue = transBezierCurveToPath(pixelPoints);
|
if (pathValue == null || pathValue == undefined)
|
return;
|
//有时会报错，加上这个就没事 tangxu 20151122
|
if (pathValue.toString().indexOf("M ,NaN, ,NaN") == 0) {
|
return;
|
};
|
|
|
|
var style = {
|
"stroke-width": "2px",
|
"stroke": m_displayStyle.ColorH,
|
"fill": "none",
|
"fill-opacity": "0.5",
|
//"stroke-dasharray":"5 3",
|
"shape-rendering": "geometricPrecision",
|
"zIndex:": 7
|
};
|
if (curveWidth != null) {
|
style["stroke-width"] = curveWidth;
|
}
|
if (curveColor != null) {
|
style["stroke"] = curveColor;
|
}
|
if (strokeDasharray != null) {
|
style["stroke-dasharray"] = strokeDasharray; //'10, 10';//'10, 10, 5, 5'
|
}
|
|
m_svg.createPath(objName, pathValue.join(''), {
|
"id": objName
|
}, style);
|
if (isDisp != null && !isDisp) {
|
$("#" + objName).hide();
|
}
|
return pixelPoints;
|
};
|
//绘制直线
|
var createLineQH = function (objName, point1, point2, curveWidth, curveColor, objTag) {
|
if (point1 == null || point2 == null) {
|
return;
|
}
|
if (objName == null) {
|
return;
|
}
|
|
var x1 = getPixelValueQ(point1.X);
|
var y1 = getPixelValueH(point1.Y);
|
|
var x2 = getPixelValueQ(point2.X);
|
var y2 =getPixelValueH(point2.Y);
|
|
var style = {
|
"stroke-width": "2px",
|
"stroke": m_displayStyle.ColorH,
|
"fill": "none",
|
"fill-opacity": "0.5",
|
//"stroke-dasharray":"5 3",
|
"shape-rendering": "geometricPrecision",
|
"zIndex:": 7
|
};
|
if (curveWidth != null) {
|
style["stroke-width"] = curveWidth;
|
}
|
if (curveColor != null) {
|
style["stroke"] = curveColor;
|
}
|
var temp = "M x1 y1 L x2 y2";
|
var pathValue = temp.replace("x1", x1).replace("y1", y1).replace("x2", x2).replace("y2", y2);
|
if (objTag == null)
|
m_svg.createPath(objName, pathValue, null, style);
|
else
|
m_svg.createPath(objName, pathValue, {
|
"tag": objTag
|
}, style);
|
};
|
//绘制点
|
var createPointQH = function (objName, point, circleSize, circleColor) {
|
if (point == null) {
|
return;
|
}
|
if (objName == null) {
|
return;
|
}
|
|
var xPixel = getPixelValueQ(point.X);
|
var yPixel = getPixelValueH(point.Y);
|
|
var attr = {
|
"cx": xPixel,
|
"cy": yPixel,
|
"r": 2
|
}
|
var style = {
|
"stroke-width": "2px",
|
"stroke": m_displayStyle.ColorH,
|
"fill": "none",
|
"fill-opacity": "0.5",
|
//"stroke-dasharray":"5 3",
|
"shape-rendering": "geometricPrecision",
|
"zIndex:": 7
|
};
|
if (circleSize != null) {
|
attr.r = circleSize;
|
}
|
if (circleColor != null) {
|
style["stroke"] = circleColor;
|
}
|
|
m_svg.createCircle(objName, attr, style);
|
};
|
//绘制文字
|
//textAnchor 文字对齐 start | middle | end
|
var drawTextByQH = function (objName, text, point, textSize, textColor, offsetPixelX, offsetPixelY, textAnchor) {
|
if (!text) {
|
return;
|
}
|
if (!point) {
|
return;
|
}
|
var xPixel =getPixelValueQ(point.X);
|
if (offsetPixelX != null) {
|
xPixel += offsetPixelX;
|
}
|
|
var yPixel = getPixelValueH(point.Y);
|
if (offsetPixelY != null) {
|
yPixel -= offsetPixelY;
|
}
|
|
var textStyle = "stroke-width:1px; "; //font-weight:bold; fill-opacity:0.9;
|
if (textColor != null) {
|
textStyle += " fill:" + textColor + ";";
|
} else {
|
textStyle += " fill:#000000;";
|
}
|
if (textSize != null) {
|
textStyle += " font-size:" + textSize + "px;"
|
} else {
|
textStyle += " font-size:12px;";
|
}
|
if (textAnchor != null) {
|
textStyle += " text-anchor:" + textAnchor + ";";
|
}
|
if (objName == null) {
|
return m_svg.createText({
|
"opacity": 1,
|
"y": yPixel,
|
"x": xPixel
|
}, textStyle, text);
|
} else {
|
return m_svg.createText({
|
"id": objName,
|
"opacity": 1,
|
"y": yPixel,
|
"x": xPixel
|
}, textStyle, text);
|
}
|
};
|
var drawDiagramPanel = function(){
|
//绘制网格线
|
createGridLineX();
|
createGridLineY();
|
|
|
//绘制坐标
|
createXAxis();
|
|
createYAxis();
|
|
};
|
|
//绘制图表
|
var drawChart = function () {
|
|
|
drawDiagramPanel();
|
|
//
|
if (m_chartObject.CurveListQH != null) {
|
for (var i = 0; i < m_chartObject.CurveListQH.length; i++) {
|
var points = m_chartObject.CurveListQH[i].PointInfo;
|
if (points.length >= 4) { //曲线
|
createCurveQH("CurveQH" + i, points, 1, m_displayStyle.ColorH);
|
} else if (points.length == 2 || points.length == 3) { //直线
|
createLineQH("CurveQH" + i, points[0], points[1], 1, m_displayStyle.ColorH);
|
} else if (points.length == 1) {
|
createPointQH("CurveQH" + i, points[0], 3, m_displayStyle.ColorH);
|
}
|
|
}
|
}
|
|
if (m_chartObject.CurveListQE != null) {
|
for (var i = 0; i < m_chartObject.CurveListQE.length; i++) {
|
var points = m_chartObject.CurveListQE[i].PointInfo;
|
if (points.length >= 4) { //曲线
|
createCurveQH("CurveQE" + i, points, 1, m_displayStyle.ColorE);
|
} else if (points.length == 2 || points.length == 3) { //直线
|
createLineQH("CurveQE" + i, points[0], points[1], 1, m_displayStyle.ColorE);
|
} else if (points.length == 1) {
|
createPointQH("CurveQE" + i, points[0], 3, m_displayStyle.ColorE);
|
}
|
}
|
}
|
|
if (m_chartObject.LabelPosi != null) {
|
for (var i = 0; i < m_chartObject.LabelPosi.length; i++) {
|
var lbl = m_chartObject.LabelPosi[i];
|
var posi = {};
|
posi.X = lbl.X;
|
posi.Y = lbl.Y;
|
|
//textAnchor 文字对齐 start | middle | end
|
var curveName = "CurvePara" + lbl.CurveTag + i;
|
// var drawTextByQH = function (objName, text, point, textSize, textColor, offsetPixelX, offsetPixelY, textAnchor) {
|
// Right = 0, Bottom = 1, Left = 2, Top = 3,
|
// console.log(lbl.CurveTag + " " + lbl.Text + " " + lbl.TextAligment);
|
var lblColor = m_displayStyle.ColorH;
|
if (lbl.CurveTag == "QE")
|
lblColor = m_displayStyle.ColorE;
|
if (lbl.TextAligment == 0) {
|
drawTextByQH(curveName, lbl.Text, posi, 9, lblColor, 2, -4, "start");
|
} else if (lbl.TextAligment == 1) {
|
drawTextByQH(curveName, lbl.Text, posi, 9, lblColor, 0, -15, "middle");
|
} else if (lbl.TextAligment == 2) {
|
drawTextByQH(curveName, lbl.Text, posi, 9, lblColor, -2, -4, "end");
|
} else if (lbl.TextAligment == 3) {
|
drawTextByQH(curveName, lbl.Text, posi, 9, lblColor, 0, 5, "middle");
|
}
|
}
|
}
|
|
//设置设计点
|
drawDesignPoint(m_displayStyle.DesignPointDispType);
|
|
|
//绘制工作曲线
|
if (m_chartObject.WorkCurve != null) {
|
createCurveQH("WorkCurve", m_chartObject.WorkCurve, 2, "#ff0000");
|
}
|
|
|
//初始化工作曲线
|
intitalWrkCurveInfo();
|
|
////装置曲线
|
//CreateEquipmentCurve();
|
|
//
|
//if (m_isDrawWaterMark && m_warterMarkText != null && m_warterMarkText.CN != "")
|
// drawTextWaterMark(m_warterMarkText.CN);
|
|
//createVerticalLine();
|
}
|
|
//绘制水印
|
var drawTextWaterMark = function (text) {
|
if (!text) {
|
return;
|
}
|
|
var logoStyle = "-webkit-transform: rotate(5deg);-moz-transform: rotate(5deg);transform: rotate(5deg);fill:#000000;fill-opacity:0.6;font-weight:bold;stroke-width:1px";
|
var srt = text.toString();
|
var w = 30;
|
var h = 80;
|
var isDrawSecond = true;
|
var left = null;
|
var lingHeight = 250;
|
|
logoStyle += ";font-size:10px";
|
w = 12;
|
h = 35;
|
isDrawSecond = false;
|
|
|
left = (m_chartSize.DiagramRightX - m_chartSize.SpaceLeft - srt.length * w) / 2;
|
|
for (var i = 0; i < srt.length; i++) {
|
m_svg.createText({
|
"opacity": 0.5,
|
"y": m_chartSize.SpaceTop + h + i * 10,
|
"x": m_chartSize.SpaceLeft + left + i * w
|
}, logoStyle, srt[i]);
|
|
if (isDrawSecond) {
|
var endHeight = h + srt.length * 10; //: h + srt.length * 10 - 80;
|
m_svg.createText({
|
"opacity": 0.5,
|
"y": m_chartSize.DiagramBottomY - endHeight + i * 10,
|
"x": m_chartSize.SpaceLeft + left + i * w
|
}, logoStyle, srt[i])
|
}
|
}
|
|
};
|
|
//绘制设计点
|
var drawDesignPoint = function (DispStyleType) {
|
if (m_chartObject.DesignPoint1 == null)
|
return;
|
|
if (DispStyleType == 2) { //倒三角
|
|
var xPixel = m_chartSize.SpaceLeft +
|
(m_chartObject.DesignPoint1.X - m_coordinatePara.CoordMinQ) * m_chartSize.DiagramWidth / (m_coordinatePara.CoordSpaceQ * m_coordinatePara.GridNumberQ);
|
var yPixel = m_chartSize.DiagramBottomY -
|
(m_chartObject.DesignPoint1.Y - m_coordinatePara.CoordMinH) * m_chartSize.DiagramHeight / (m_coordinatePara.CoordSpaceH * m_coordinatePara.GridNumberH);
|
|
var xTri = m_chartSize.DiagramWidth / 20;
|
var yTri = xTri / 2;
|
var style = {
|
"stroke-width": "2px",
|
"stroke": "red",
|
"fill": "none",
|
"fill-opacity": "0.5",
|
//"stroke-dasharray":"5 3",
|
"shape-rendering": "geometricPrecision",
|
"zIndex:": 18
|
};
|
//if (curveWidth != null) {
|
// style["stroke-width"] = curveWidth;
|
//}
|
//if (curveColor != null) {
|
// style["stroke"] = curveColor;
|
//}
|
|
|
var temp = "M x1 y1 L x2 y2";
|
var pathValue = temp.replace("x1", xPixel).replace("y1", yPixel).replace("x2", (xPixel - xTri)).replace("y2", yPixel);
|
m_svg.createPath("DesignPointWater1", pathValue, {
|
//"class": "DesignPoint1",
|
"tag": "DesignPoint1"
|
}, style);
|
pathValue = temp.replace("x1", xPixel).replace("y1", yPixel).replace("x2", xPixel).replace("y2", (yPixel + yTri));
|
m_svg.createPath("DesignPointWater2", pathValue, {
|
//"class": "DesignPoint1",
|
"tag": "DesignPoint1"
|
}, style);
|
pathValue = temp.replace("x1", xPixel - xTri).replace("y1", yPixel).replace("x2", xPixel).replace("y2", (yPixel + yTri));
|
m_svg.createPath("DesignPointWater3", pathValue, {
|
//"class": "DesignPoint1",
|
"tag": "DesignPoint1"
|
}, style);
|
|
|
//m_svg.createPath(objName, pathValue.join(''), {
|
// "id": objName
|
//}, style);
|
|
pathValue = temp.replace("x1", xPixel - xTri / 3).replace("y1", yPixel).replace("x2", xPixel).replace("y2", (yPixel + yTri / 3));
|
m_svg.createPath("DesignPointWater4", pathValue, {
|
//"class": "DesignPoint1",
|
"tag": "DesignPoint1"
|
}, style);
|
|
pathValue = temp.replace("x1", xPixel - xTri * 2 / 3).replace("y1", yPixel).replace("x2", xPixel).replace("y2", (yPixel + yTri * 2 / 3));
|
m_svg.createPath("DesignPointWater5", pathValue, {
|
//"class": "DesignPoint1",
|
"tag": "DesignPoint1"
|
}, style);
|
|
} else { //十字线
|
var x = m_chartObject.DesignPoint1.X;
|
var y = m_chartObject.DesignPoint1.Y;
|
var point1 = {
|
X: x,
|
Y: y * 0.92
|
};
|
var point2 = {
|
X: x,
|
Y: y * 1.08
|
};
|
createLineQH("DesignPointWater1", point1, point2, 3, "red", "DesignPoint1");
|
|
point1 = {
|
X: x * 0.95,
|
Y: y
|
};
|
point2 = {
|
X: x * 1.05,
|
Y: y
|
};
|
createLineQH("DesignPointWater2", point1, point2, 3, "red", "DesignPoint1");
|
}
|
|
};
|
|
/** ----------------对外函数-------------------- **/
|
|
//设置设计点公差
|
this.SetUnit = function (unitQ, unitH, unitP) {
|
m_unit.Q = unitQ;
|
m_unit.H = unitH;
|
m_unit.P = unitP;
|
};
|
|
//设置语言 中文zhCN = 0, zhTW = 1, enUS = 2
|
this.setLocalizationType = function (localizationType) {
|
m_localizationType = localizationType;
|
};
|
|
//设置容器
|
this.setContainerDiv = function (divChartName, divWidth, divHeight) {
|
m_divChartName = divChartName;
|
if (m_chartSize == null) {
|
m_chartSize = {};
|
}
|
|
if (divWidth != null) {
|
m_chartSize.TotalWidth = divWidth;
|
} else {
|
m_chartSize.TotalWidth = document.getElementById(divChartName).clientWidth;
|
}
|
|
if (divHeight != null) {
|
m_chartSize.TotalHeight = divHeight;
|
} else {
|
m_chartSize.TotalHeight = document.getElementById(divChartName).clientHeight;
|
}
|
|
};
|
|
//初始化图表(入口)
|
this.initialChart = function (ChartFullInfo, displayStyle) {
|
|
//console.log(m_divChartName, ChartFullInfo, 1191)
|
if (!m_divChartName)
|
return;
|
|
if (ChartFullInfo.ChartObjectDict == null)
|
return;
|
if (ChartFullInfo.ChartObjectDict.Coordinate == null)
|
return;
|
|
|
m_pumpInfo = ChartFullInfo.BaseInfo;
|
m_chartObject = ChartFullInfo.ChartObjectDict;
|
m_chartSetting = ChartFullInfo.SettingInfo;
|
m_coordinatePara = ChartFullInfo.ChartObjectDict.Coordinate; //extend(m_coordinatePara, ChartFullInfo.Coordinate);
|
|
|
// m_chartSetting.UnitQ = m_coordinatePara.UnitQ;
|
// m_chartSetting.UnitH = m_coordinatePara.UnitH;
|
|
//console.log(m_chartSetting, m_coordinatePara, 1191)
|
this.SetUnit( //设置单位
|
m_chartSetting.UnitQ,
|
m_chartSetting.UnitH,
|
m_chartSetting.UnitP);
|
|
//初始化显示设置
|
initialDispStyle(displayStyle, m_chartSetting);
|
|
//初始化面板
|
initialPanelSize( );
|
|
//console.log("开始初始化", 1234)
|
drawChart();
|
|
return this;
|
};
|
|
//更新工作曲线信息
|
this.updateWrkInfo = function (ChartFullInfo) {
|
|
//设置设计点
|
var listDesignPointWater = $("path[tag='DesignPoint1']");
|
listDesignPointWater.remove();
|
m_chartObject.DesignPoint1 = ChartFullInfo.ChartObject.DesignPoint1;
|
drawDesignPoint(m_displayStyle.DesignPointDispType);
|
|
|
//
|
m_chartObject.WorkCurve = ChartFullInfo.ChartObject.WorkCurve;
|
|
|
|
$("#WorkCurve").remove();
|
//objName, points, curveWidth, curveColor, isDisp, strokeDasharray
|
createCurveQH("WorkCurve", m_chartObject.WorkCurve, 2, "#ff0000");
|
|
|
|
//
|
intitalWrkCurveInfo();
|
|
//装置曲线
|
//CreateEquipmentCurve();
|
};
|
//重新刷新装置曲线
|
this.RefreshEquipmentCurve = function (equipZeroH) {
|
m_equipZeroH = equipZeroH;
|
CreateEquipmentCurve();
|
};
|
//设置装置曲线静扬程
|
this.SetEquipZeroH = function (equipZeroH) {
|
m_equipZeroH = equipZeroH;
|
};
|
//显示装置曲线
|
this.DispEquipmentCurve = function (isDisp) {
|
m_dispEquipmentCurve = isDisp;
|
if (isDisp) {
|
$("#EquipmentCurve").show();
|
|
//var char = 'http://www.w3.org/2000/svg',
|
//path = document.getElementsByTagNameNS(char, 'path')[0],
|
//var path = document.getElementById("EquipmentCurve");
|
var pathEquipmentCurve = document.getElementById("EquipmentCurve"); //.getElementsByTagNameNS(char, 'path')[0],
|
var len = pathEquipmentCurve.getTotalLength();
|
|
pathEquipmentCurve.style.strokeDasharray = len;
|
pathEquipmentCurve.style.strokeDashoffset = len;
|
pathEquipmentCurve.style.animation = 'act 1s linear forwards';
|
|
} else {
|
$("#EquipmentCurve").hide();
|
}
|
}
|
|
//设置工具提示栏
|
this.setToolTipName = function (toolTipName) {
|
m_toolTipContent = $("#" + toolTipName);
|
};
|
//根据ID设置物体显示状态
|
this.setObjectDispByID = function (name, isDisp) {
|
if (isDisp) {
|
$("#" + name).show();
|
} else {
|
$("#" + name).hide();
|
}
|
};
|
//删除
|
this.removeByName = function (name) {
|
m_svg.removeByName(name);
|
};
|
|
|
//设置物体显示
|
this.setObjectVisibleByID = function (objName, isDisp) {
|
var obj = m_svg.getPathByName(name);
|
if (obj == null)
|
return;
|
if (isDisp) {
|
series.style.display = "";
|
} else {
|
series.style.display = "none";
|
}
|
};
|
|
this.setObjectVisibleByTag = function (objTag, isDisp) {
|
var list = $("path[tag='" + objTag + "']");
|
if (list.length == 0)
|
return;
|
|
if (isDisp) {
|
list.show();
|
} else {
|
list.hide();
|
}
|
};
|
|
this.getHbyQ4WrkWaterCurve = function (q) {
|
return getHbyQ4WrkWaterCurve(q);
|
};
|
|
this.getEbyQ4WrkWaterCurve = function (q) {
|
return getEbyQ4WrkWaterCurve(q);
|
};
|
|
this.getPbyQ4WrkWaterCurve = function (q) {
|
return getPbyQ4WrkWaterCurve(q);
|
};
|
|
this.DispVerticalLine = function (disp) {
|
dispVerticalLine(disp);
|
};
|
this.ToggleVerticalLine = function () {
|
if(m_infoDv4VerticalLine){
|
if (m_infoDv4VerticalLine.is(":hidden")) {
|
dispVerticalLine(true);
|
} else {
|
dispVerticalLine(false);
|
}
|
}
|
|
};
|
|
//设计点显示方式(eDesignPointDispType) Cross 0 LeftDownTriangle 2
|
this.SetDesignPointStyle = function (type) {
|
var list = $("path[tag='DesignPoint1']");
|
list.remove();
|
drawDesignPoint(type);
|
};
|
|
//
|
this.GetTotalHeigth = function () {
|
return m_chartSize.TotalHeight;
|
};
|
this.GetTotalWidth = function () {
|
return m_chartSize.TotalWidth;
|
};
|
this.GetCoordinatePara = function () {
|
return m_coordinatePara;
|
};
|
this.UpdateByCoordinate = function (Coordinate) {
|
m_coordinatePara = Coordinate;
|
|
m_coordinatePara.CoordMaxQ = m_coordinatePara.CoordMinQ + m_coordinatePara.CoordSpaceQ * m_coordinatePara.GridNumberQ;
|
m_coordinatePara.CoordMaxH = m_coordinatePara.CoordMinH + m_coordinatePara.CoordSpaceH * m_coordinatePara.GridNumberH;
|
|
|
|
$("#" + m_divChartName).empty();
|
|
//初始化面板
|
initialPanelSize( );
|
|
|
drawChart();
|
};
|
//右边间隙
|
this.ChangePanelRightPadding = function (rightPadding) {
|
|
m_chartSize.TotalWidth = document.getElementById(m_divChartName).clientWidth - rightPadding;
|
m_chartSize.TotalHeight = document.getElementById(m_divChartName).clientHeight;
|
|
$("#" + m_divChartName).empty();
|
|
//初始化面板
|
initialPanelSize( );
|
|
|
drawChart();
|
};
|
//重绘图表大小
|
this.Resize = function () {
|
m_chartSize = null; //现在置空原有的尺寸
|
$("#" + m_divChartName).empty();
|
|
//初始化面板
|
initialPanelSize( );
|
|
|
drawChart();
|
};
|
};
|
|
export default ZlpChartDiagram
|
