Page 1 of 3

Ver 2 : VectorDrawing Chart

Posted: Thu Feb 11, 2016 6:26 am
by RASHAD
Hi all
Feel free to add or modify
Remember to use your own IMAGE

Code: Select all

Global xx

LoadFont(0,"Consalos",10)  
LoadImage(0, "e:\image12.bmp") ;Use your own image
CreateImage(1,200,200,32)
  
StartVectorDrawing(ImageVectorOutput(1))  
  VectorSourceLinearGradient(0, 0, 200, 200)
  VectorSourceGradientColor(RGBA(255, 255, 255, 128), 0.0)
  VectorSourceGradientColor(RGBA(0, 0, 0, 128), 1.0)      
  AddPathBox(0, 0, 200, 200)
  FillPath()    
StopVectorDrawing()

CreateImage(2,200,200,32)    
StartVectorDrawing(ImageVectorOutput(2))
  VectorSourceCircularGradient(200, 100, 150, -50, -50)
  VectorSourceGradientColor(RGBA(255, 255, 255, 255), 0.0)
  VectorSourceGradientColor(RGBA(0, 0, 0, 255), 1.0)      
  FillVectorOutput()    
StopVectorDrawing()  
  
Procedure myBKG(image,ialpha,effect,ealpha,width,height)
  ResetPath()
  ResetCoordinates()
  MovePathCursor(0,0)
  DrawVectorImage(ImageID(image),ialpha,width,height)
  MovePathCursor(4,4)
  If effect <> image And effect > 0
     DrawVectorImage(ImageID(effect),ealpha,width-8,height-8)
  EndIf
EndProcedure

Procedure myTitle(Text$,left,top,Color)
  VectorFont(FontID(0),32)
  VectorSourceColor($FFFFFFFF)
  ResetPath()
  ResetCoordinates()
  MovePathCursor(left+2,top)
  ;RotateCoordinates(0,0, 45)             
  DrawVectorText(Text$)
  VectorSourceColor($FF0000FF)
  ResetPath()
  ResetCoordinates()
  MovePathCursor(left,top-2)
  ;RotateCoordinates(0,0, 45)             
  DrawVectorText(Text$) 
EndProcedure

Procedure myAxis()
  ResetPath()
  ResetCoordinates()
  VectorSourceColor($FFE3E3E3)  
  For y = 35 To 370 Step 25  
    MovePathCursor(30,y)    
    AddPathLine(590, y)
  Next
  For x = 35 To 590 Step 25  
    MovePathCursor(x,35)    
    AddPathLine(x, 370)
  Next
  StrokePath(1)  
EndProcedure

Procedure myCylbar(Dta,left,Color)
  ResetPath()
  ResetCoordinates()
  VectorSourceLinearGradient(20, 0, 45, 0)
  VectorSourceGradientColor(RGBA(Red(Color), Green(Color), Blue(Color), 255), 0.5)            
  AddPathBox(left,360-Dta, 20, Dta)
  FillPath()  
EndProcedure

Procedure myBlockbar(Dta,left,Color)
  ResetPath()
  ResetCoordinates()
  VectorSourceColor(RGBA(Red(Color), Green(Color), Blue(Color), 255))
  MovePathCursor(left,360-Dta)
  AddPathLine(20, 0, #PB_Path_Relative)
  AddPathLine(0,Dta, #PB_Path_Relative)
  AddPathLine(10,-10, #PB_Path_Relative)
  AddPathLine(0,-Dta, #PB_Path_Relative)
  AddPathLine(-20,0, #PB_Path_Relative)
  ClosePath()
  FillPath()
  StrokePath(1)
  ResetCoordinates()
  VectorSourceColor(RGBA(0,0,0, 255))  
  AddPathBox(left,360-Dta, 19, Dta)
  FillPath()
  VectorSourceColor(RGBA(Red(Color), Green(Color), Blue(Color), 128))  
  AddPathBox(left,360-Dta, 19, Dta)
  FillPath()  
EndProcedure

Procedure myInitPie(x, y, RadiusX, RadiusY)
  ResetPath()
  ResetCoordinates()
  VectorSourceCircularGradient(x, y, 160, 0, 0)
  VectorSourceGradientColor(RGBA(255, 255, 0, 255), 0.0) 
  MovePathCursor(x, y+12)
  ;AddPathEllipse(x, 212,100,70,0,360,#PB_Path_Connected)
  ;FillPath()
  AddPathEllipse(x, y+14,100,70,0,360,#PB_Path_Connected)
  FillPath()
  Restore PieData
EndProcedure

Procedure myPie(x, y, RadiusX, RadiusY , StartAngle, EndAngle,Color)
  VectorSourceCircularGradient(200, 150, 400, 10, 10)
  VectorSourceGradientColor(Color, 0.0)
  MovePathCursor(x, y)      
  AddPathEllipse(x, y, RadiusX, RadiusY , StartAngle, EndAngle,#PB_Path_Connected)
  FillPath()
  xx + 25
  MovePathCursor(x+120, y-50 + xx) 
  VectorFont(FontID(0),24)
  VectorSourceColor(Color|$FF000000)
  DrawVectorText(Str((EndAngle-StartAngle)*100/360)+" %")
EndProcedure
  
If OpenWindow(0, 0, 0, 600, 400, "Chart Drawing", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)
  CanvasGadget(0, 0, 0, 600, 400)    
  
  If StartVectorDrawing(CanvasVectorOutput(0))
  
    myBKG(0,200,2,200,600,400)  ;bkground(image,ialpha,effect,ealpha,width,height)
    
    myAxis()
    
    myTitle("RASHAD",230,20,$FF0000FF)
    
    myInitPie(150, 250,100,75)
    Read StartAngle : Read EndAngle
    myPie(150, 250,100,75 , StartAngle, EndAngle,RGBA(0, 255, 255, 255))
    Read StartAngle : Read EndAngle
    myPie(150, 250,100,75 , StartAngle, EndAngle,RGBA(0, 0, 255, 255))
    Read StartAngle : Read EndAngle
    myPie(150, 250,100,75 , StartAngle, EndAngle,RGBA(255, 0, 0, 255))
    Read StartAngle : Read EndAngle
    myPie(150, 250,100,75 , StartAngle, EndAngle,$FF53FDF3)      
    
;     Read.l dta
;     myBlockbar(dta,50,RGBA(255,0, 0, 255))
;      
;     Read.l dta
;     myBlockbar(dta,100,RGBA(0, 255, 0, 255))
;      
;     Read.l dta
;     myBlockbar(dta,150,RGBA(0, 0, 255, 255))
;      
;     Read.l dta
;     myBlockbar(dta,200,RGBA(255, 255, 10, 255))      
;    
;     VectorFont(FontID(0),12)
;     VectorSourceColor($FFFFFFFF) 
;     
;     Restore ChartData
;     For x = 60 To 210 Step 50
;       Read.l a
;       ResetPath()
;       ResetCoordinates()
;       MovePathCursor(x, 370)  
;       RotateCoordinates(0,0, 45)              
;       DrawVectorText(Str(a))        
;     Next    
    StopVectorDrawing()
  EndIf
  
  Repeat
    Event = WaitWindowEvent()
  Until Event = #PB_Event_CloseWindow
EndIf

DataSection
  ChartData:
    Data.l 160, 260, 210, 190
  PieData:
    Data.l 0,70,70,130,120,219,220,360
EndDataSection
Edit :Added myBlockbar(dta,left,Color)
Edit :Added Pie Chart

Re: VectorDrawing Chart

Posted: Thu Feb 11, 2016 6:49 am
by Keya
Image

Impressive result! there doesn't appear to be enough code for it though, lol

Re: VectorDrawing Chart

Posted: Thu Feb 11, 2016 7:11 am
by RASHAD
Hi Keya :P
It is just a start to let the guys take some attention to what we have here
Specially guy like you with his recently effects
I do think that there is no end with this lib.
Have fun mate

Re: VectorDrawing Chart

Posted: Thu Feb 11, 2016 11:32 am
by srod
Very nice Rashad.

I agree that the vector lib is looking very special.

Re: VectorDrawing Chart

Posted: Thu Feb 11, 2016 11:52 am
by RASHAD
Hi big man
I am glad you are around srod

Re: VectorDrawing Chart

Posted: Thu Feb 11, 2016 12:18 pm
by HanPBF
Hello RASHAD,

despite the great result (which comes just in time for my project;-), You also did:
- clean, readable, understandable code
- demonstrate how easy it is with PB to draw such things.

I will definitely merge this into my source.

THANKS A LOT!!!!

Re: VectorDrawing Chart

Posted: Thu Feb 11, 2016 12:53 pm
by davido
Hi RASHAD,

An excellent demo. Thank you, very much. :D

Re: VectorDrawing Chart

Posted: Thu Feb 11, 2016 2:13 pm
by Kwai chang caine
No words come to me :shock:

Except perhaps one :
Image

I'm so proud to know you
Thanks a lot to exist 8)

Re: VectorDrawing Chart

Posted: Fri Feb 12, 2016 7:13 am
by RASHAD
@HanPBF
@davido
@KCC
Thanks guys

Previous post updated
Added myBlockbar(Dta,left,Color)

Re: VectorDrawing Chart

Posted: Fri Feb 12, 2016 7:55 am
by infratec
Only a small addition:

Code: Select all

If IsImage(image)
  DrawVectorImage(ImageID(image),ialpha,width,height)
EndIf
For those who doesn't read enough :mrgreen:

Bernd

Re: VectorDrawing Chart

Posted: Fri Feb 12, 2016 1:06 pm
by RASHAD
Hi Bernd
Previous post updated
Added Pie Chart

Waiting for a list from you with your suggestions :P

Re: VectorDrawing Chart

Posted: Fri Feb 12, 2016 3:06 pm
by Julian

Re: VectorDrawing Chart

Posted: Fri Feb 12, 2016 3:13 pm
by heartbone
32-bit XP running PB 5.41 LTS
using 600x400 local image
LoadImage(0, "C:\PureBasic\miscellaneous\Penguin Again.png") ;Use your own image

Does anyone else get this error?
DrawVectorImage(ImageID(image),ialpha,width,height) <--- [ERROR] VectorDrawing Chart.pb (Line: 27) [ERROR] The specified #Image is not initialised.

Re: VectorDrawing Chart

Posted: Fri Feb 12, 2016 3:59 pm
by Julian
Make sure you have put UsePNGImageDecoder() above the LoadImage() as you're loading a png not a bmp

Re: VectorDrawing Chart

Posted: Fri Feb 12, 2016 7:18 pm
by heartbone
Julian wrote:Make sure you have put UsePNGImageDecoder() above the LoadImage() as you're loading a png not a bmp
Ah yes, one of those 'wish it was automatic' compiler gotchas.
Thanks for the correction Julian, it works now.