flex-dev mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From Peter Ent <p...@adobe.com>
Subject Re: [FlexJS] Drawing API
Date Mon, 08 Sep 2014 20:59:27 GMT
I haven't tried the JS side - this is all Flash. In SVG, the fill takes
care of closing the path; I'm not using any line or border.

Which brings me to the next issue. When drawing a series of connected
lines (for the LineChart), the first and last points are getting
connected, which I do not want. My loop to build the path looks like this,
below. point[0] != point[last] so they should not be connected. I tried
"z" and "Z" thinking one meant leave the path closed and one closed the
path, but that didn't make any difference.

                                var pathString:String = "";
				
				for (var i:int=0; i < points.length; i++) {
				    var point:Object = points[i];
					if (i == 0) pathString += "M "+point.x+" "+point.y+" ";
					else pathString += "L "+point.x+" "+point.y+" ";
				}
				
				pathString += "Z";
				
				path.drawPath(0, 0, pathString);


Thanks,
Peter Ent
Adobe Systems

On 9/8/14 4:13 PM, "OmPrakash Muppirala" <bigosmallm@gmail.com> wrote:

>On Mon, Sep 8, 2014 at 12:48 PM, Peter Ent <pent@adobe.com> wrote:
>
>> I took care of the gjslint issues.
>>
>
>Thanks!  Hope it was not too much trouble.
>
>
>>
>> Can you supply more information about Path and what is in the path
>>string?
>> I have a path working in SVG to do the wedges for the pie chart, but
>>that
>> same string isn't working with core.graphics.Path.
>>
>> var pathString:String = 'M' + x + ' ' + y + ' L' + x1 + ' ' + y1 + ' A'
>>+
>> radius + ' ' + radius +
>>                                 ' 0 0 1 ' + x2 + ' ' + y2 + ' z';
>>
>>
>> It doesn't look, to me, like "A" is being recognized.
>>
>
>The path looks like it is doing the following:
>M x y : move to x, y
>L x1 y1 : draw line from x,y to x1,y1
>A radius radius  : draw an arc with xradius=radius and yradius = radius
>(so, a circular arc)
>0 0 1 : x-axis rotation=0, large-arc = false, sweep = true
>x2 y2 : ending point of the arc
>z : finish drawing
>
>BTW, don't you need another line to complete the wedge?
>
>Is it working fine on the flash side?  I will take a look soon.
>
>Thanks,
>Om
>
>
>>
>> Thanks,
>> Peter Ent
>> Adobe Systems
>>
>> On 9/8/14 12:04 PM, "OmPrakash Muppirala" <bigosmallm@gmail.com> wrote:
>>
>> >On Sep 8, 2014 8:24 AM, "Peter Ent" <pent@adobe.com> wrote:
>> >>
>> >> I forgot to add that when I build flex-asjs, gjslint finds a number
>>of
>> >> issues in the new JS graphics code (its usual, spaces at the end of
>> >>lines,
>> >> sort of thing). I think I am using version 2.3.10 of gjslint but I'm
>>not
>> >> 100% sure.
>> >
>> >Yeah, unfortunately there is no gjslint available for Windows.  I
>>guess I
>> >will need you Mac folks to help me out with this :-)
>> >
>> >Thanks,
>> >Om
>> >
>> >>
>> >> Peter Ent
>> >> Adobe Systems
>> >>
>> >> On 9/8/14 3:48 AM, "OmPrakash Muppirala" <bigosmallm@gmail.com>
>>wrote:
>> >>
>> >> >FlexJS now supports a basic drawing API (Rect, Ellipse, Circle,
>>Path,
>> >> >SolidColor, SolidColorStroke)  Here are the AS3 [1] and JS [2]
>>versions
>> >> >
>> >> >So far, the rendering fidelity between the Flash and SVG/HTML5
>>version
>> >>is
>> >> >very very close.  For sure, there are some pretty major things to be
>> >> >worked
>> >> >out, but generally so far, the results have been very encouraging.
>> >> >
>> >> >You can see a quick and dirty example here:
>> >> >Flash version:
>> >>http://people.apache.org/~bigosmallm/flexjs/drawing/flash/
>> >> >HTML5 version:
>> >>http://people.apache.org/~bigosmallm/flexjs/drawing/html5/
>> >> >
>> >> >HTML5 version has been tested to work fine on Chrome, Firefox, IE11,
>> >> >Android browser and iPad Safari.
>> >> >
>> >> >Next up, i will be working on the following items:
>> >> >Polygons, Linear gradients, Radial gradients, filters and drop
>>shadows.
>> >> >These should bring us very close to our current FXG based drawing
>>APIs.
>> >> >
>> >> >After that, I plan on programmatically recreating a few FXG based
>>skins
>> >in
>> >> >FlexJS and see how we can apply it skins on UI components.
>> >> >
>> >> >Feedback welcome!
>> >> >
>> >> >[1]
>> >> >
>> >
>> 
>>https://github.com/apache/flex-asjs/tree/develop/frameworks/as/projects/F
>>l
>> >> >exJSUI/src/org/apache/flex/core/graphics
>> >> >[2]
>> >> >
>> >
>> 
>>https://github.com/apache/flex-asjs/tree/develop/frameworks/js/FlexJS/src
>>/
>> >> >org/apache/flex/core/graphics
>> >>
>>
>>


Mime
View raw message