Flash AS3绘制线显示文字

时间:2016-08-15 15:40:07

标签: xml actionscript-3 flash range line-drawing

我正在制作一个诺模图,我能够创建2个与线连接的滑块,但有没有办法让线读取中间数字,如下例所示。

我需要该行显示多个“距离”数字。

也可以让滑块以不同的度量单位显示多个数字,例如米/英尺

选项2

是否有可能让line.graphic每次通过时都会播放一个动画片段或按钮?

截至目前我正在考虑使用一种类型的敌人类,所以每当line.graphic通过它时,它都会显示数字。

example nomograph

这就是我到目前为止...对于滑块我将一个movieclip“imageholder1”放在另一个movieclip“rect”之上

var imgWidth:Number = imageHolder1.width;
var imgHeight:Number = imageHolder1.height;
var rectWidth:Number = rect.width;
var rectHeight:Number = rect.height;
var rectX:Number = rect.x;
var rectY:Number = rect.y;
var img1Width:Number = imageHolder2.width;
var img1Height:Number = imageHolder2.height;
var rect1Width:Number = rect1.width;
var rect1Height:Number = rect1.height;
var rect1X:Number = rect1.x;
var rect1Y:Number = rect1.y;
// Do math to correctly make the drag bounds using values attained above
var boundWidth = rectWidth - imgWidth;
var boundHeight = rectHeight - imgHeight;
var bound1Width = rect1Width - img1Width;
var bound1Height = rect1Height - img1Height;

var line:MovieClip = new MovieClip();
addChild(line);

draw(null);

imageHolder1.width = txtout.width
imageHolder1.minimum = 0;
imageHolder1.maximum = 100;
imageHolder1.value = 100;
imageHolder1.snapInterval = 2;

var sliderValues:uint = imageHolder1.y;
imageHolder1.addEventListener(Event.CHANGE, sliderChanged);
function sliderChanged(evt:Event):void {
sliderValues = imageHolder1.value/100;
txtout.text = (imageHolder1.value/100).toFixed(2);
}
// Now apply the variable numbers with the math we want as bounds
var boundsRect:Rectangle = new Rectangle(rectX, rectY, 
boundWidth, boundHeight);
    // Enable drag
    imageHolder1.addEventListener(MouseEvent.MOUSE_DOWN, DragImage1);
    function DragImage1(event:MouseEvent) {
// Here you see we apply the boundsRect when they drag
imageHolder1.startDrag(false, boundsRect);
 stage.addEventListener(Event.ENTER_FRAME, draw);
}
// Stop drag
imageHolder1.addEventListener(MouseEvent.MOUSE_UP, DropImage1);
function DropImage1(event:MouseEvent) {
imageHolder1.stopDrag();
 stage.addEventListener(Event.ENTER_FRAME, draw);
}

 var bounds1Rect:Rectangle = new Rectangle(rect1X, rect1Y, 
bound1Width, bound1Height);
    // Enable drag
    imageHolder2.addEventListener(MouseEvent.MOUSE_DOWN, DragImage2);
    function DragImage2(event:MouseEvent) {
    // Here you see we apply the boundsRect when they drag
imageHolder2.startDrag(false, bounds1Rect);
     stage.addEventListener(Event.ENTER_FRAME, draw);
}
// Stop drag
imageHolder2.addEventListener(MouseEvent.MOUSE_UP, DropImage2);
function DropImage2(event:MouseEvent) {
    imageHolder2.stopDrag();
     stage.addEventListener(Event.ENTER_FRAME, draw);
}

function draw(event:Event):void{
    line.graphics.clear();
    line.graphics.lineStyle(1,1);
    line.graphics.moveTo(imageHolder1.x,imageHolder1.y);
    line.graphics.lineTo(imageHolder2.x,imageHolder2.y);
}

var sliderValue:uint = imageHolder2.y;
addEventListener(Event.ENTER_FRAME, onEnterFrame);
function onEnterFrame(event:Event):void {
    sliderValue = imageHolder2.y;
    status_txt.text = "Slider position is: "+sliderValue;
}

更新

因此,我正在编辑以满足我的需求,我能够跟踪闪存中的所有信息,并了解有关xml的更多信息。

但我现在的问题是如何将它全部实现到flash阶段?

 <?xml version="1.0" encoding="utf-8"?>

<flow>
    <axis name="diameter" type="parallel" 
    scaleFunction="log(t)"> 
    <range>0.01,02, ,50</range> 
    <xposition>0.0</xposition> 
    <crop>0.032,0.977</crop> 
    <title>Diameter [in.]</title> 
    </axis>
    <axis name="weightFlow" type="parallel" 
    scaleFunction="log(t)"> 
    <range>0.001,100000</range> 
    <xposition>0.16</xposition> 
    <crop>0.127,0.941</crop> 
    <title>Weight Flow [1000 
    lb./hr.]</title> 
    </axis> 
    <axis name="massVelocity" 
    type="parallel" scaleFunction="log(t)"> 
    <range>1.0,10000</range> 
    <xposition>0.325</xposition> 
    <crop>0.091,0.91</crop> 
    <title>Mass Velocity 
    [lb./(hr.)(sq.ft.)]</title> 
    </axis> 
    <axis name="turning" type="turning"> 
    <xposition>0.48</xposition> 
    </axis> 
    <axis name="pressureDrop" 
    type="parallel" scaleFunction="log(t)"> 
    <range>0.000001,100</range> 
    <xposition>0.713</xposition> 
    <crop>0.175,0.902</crop> 
    <title>Pressure Drop 
    [lb./sq.in./ft.pipe]</title> 
    </axis> 
    <axis name="pressure" type="parallel" 
    scaleFunction="log(t)" layout="left"> 
    <range>0.001,100</range> 
    <xposition>1.0</xposition> 
    <title>Centipoises^0.16/(lb./cu.ft. 
    at 1 atm)</title> 
    </axis>
</flow>

1 个答案:

答案 0 :(得分:0)

此代码将向您展示如何计算&#34; Bore size&#34; (中间值)来自指定数量的&#34; Rate&#34;和&#34;速度&#34;。您可以更改inputNum_RateinputNum_Velo。例如,在该列表 image 中,您可以看到他们的流量为100升/分钟,速度为4.5米/秒。中间值应约为22毫米(或0.85至0.89英寸?)。尝试使用这两个公式来确定您认为哪个项目更精确。

行业标准的公式就是:

  

D = Q / V (其中 D =直径, Q =流量且 V = < EM>速度)。

然而,为了与你的诺模图像紧密匹配,似乎这个其他公式效果更好:

  

Q = input_FlowRate x offset_of_Rate;
V =   input_Velocity x offset_of_Velocity;
result = Q /    V ; 结果 = Math.sqrt(4 * 结果< / strong> / Math.PI);
   结果 * = 10; //#乘以10表示毫米

演示 - 按代码测试数字:
启动新项目并将代码粘贴到操作面板中,然后按 ctrl + 输入进行调试。
结果显示在调试器中(如果您没有看到文字/反馈/输出,请尝试按 F2

在代码部分&#34; TEST APP &#34; ...转到步骤(2)并更改inputNum_Rate = 100;和{{ 1}}你想要的任何单位(如你的诺模图所列)。

inputNum_Velo = 4.5;