javascript - How to calculate and place circles on an rect area? -

-

I am trying to draw some charts on the canvas area. Following my problem ...

I have to draw 1-4 (or more) circles, the canvas size is like 500 x 400 px. How can I calculate the maximum radius of each circle to keep all the space on this canvas now and how can I get the position of each circle (center X / Y)? So can each circle be optimal in some margin area for each other?

Here are some example screens that show you what I mean ...

keep four circles keep circles like a table

very much Thanks!

Maximum radius you can use 

  var numberOfSections = 4 Are; Var width = 500; Var Height = 400; Var R = Math.sqrt ((width * height) / numberoffEXaction) / 2 var MX = MathRed (width / (R * 2)); // Maximum amount of squares, which can fit on width MY = Math field (height / (R * 2)); // The maximum amount of squares that can fit at height is skipLlast = 0; Var numOfCalculatedCircles = MX * MY; If (numOfCalculatedCircles! = NumberOfSections) {if (numOfCalculatedCircles & lt; numberOfSections) {console.log ('numOfCalculatedCircles', numOfCalculatedCircles); MX = MX + Math CEC ((Number of Numbers - Number Acrylicized Circles) / My); If (MX * MY! = NumberOfSections) {skipLast = Math.abs (MX * MY-numberOfSections); }} And {skipLast = numOfCalculatedCircles - numberOfSections ;; } Console.log ('MX * MY', MX * ME); } // Radius recalculation for X (R * 2 * MX> width) {R = (width / 2) / MX; } // Re-calculate the radius for Y if (R * 2 * MY> gt; height) {R = (height / 2} / MY}   
 For X and Y Calculate the margin:  
  preferences weld = R * 2 * mx; Var circles hi = R * 2 * MY; Var margin x = 0; Var margin Y = 0; If (circlewidth and width) {marginX = (width - circlesview) / 2} if (circalite lieutenance; height) {margin Y = (height - circle height) / 2}   
 You can calculate the centers:  
  var RE = margin Y + R; Var radius padding = 10; (Var i = 0; i & lt; MY; i ++) for {var RX = margin x + r; (Var j = 0; j & lt; mx; j ++) {if (i === MY - 1) {if (j === MX - skipLast) {break; }} Canvas.drawArc ({center: true, strokeStyle: 'red', strokeWidth: 1, start: 0, end: 360, radius: R - radiating padding, x: rx, y: ry}}; rx + = 2 * R;} RI + = 2 * R;   
 Update: This is still incomplete but it can work in this special example:

Comments

Post a Comment

Popular posts from this blog

ios - Adding an SKSpriteNode to SKScene from a child SKSpriteNode -

-
I have a SKScene where I am adding an SKSpriteNode I have subclassed the SKSpriteNode class to create this node. In the subclass I am defining some SKActions on Sprite. What do I want to do when the end of this phantom ends the SKAction sequence, then I add a new Prayer node to this scene. How is this possible. The following code is mine: The code for the sequence is that I'm running on the Scansprinitode subclass (TEMissileNode): - SKAction * moveDown = [SKAction moveToY: Self.position.y - 20 Duration: 0.2]; SKAction * animation = [SKAction animateWithTextures: textures timePerFrame: time / 7]; SKAction * moveMissileProjectile = [SKAction Moving: Pointoffscreen Term: Time]; SKAction * group = [SKAction group: @ [animation, movement projectile]]; SKAction * Sequence = [SKAction Sequence: @ [Hilldown, Group, [SKAction removalFromParent]]]; [Self run action: sequence]; From the main scene, I call those actions that execute these tasks TEMissileNode * missile = [tmissil...
Read more

Matlab transpose a table vector -

-
An embarrassing simple question seems to be, but how can I move a Matlab table vector? aTableT = aTable '; I tried a standard syntax for the simple interaction of a line vector to a line vector aTable : ATableT = reshape (aTable, 1, Height (aTable)); and aTableT = rot90 (aTable); According to the head, the last time table should work for table, see. However, I get this error code: Error type in using table / permit (line 396) Undefined function 'permute' for the input arguments. Error in rot 90 (line 29) b = magnitude (b, [2 1 3: ndims (a)]); NB: fliplr is not useful either pretty sure I have covered clear angles - any ideas? Thanks! Try changing your table into an array, move it, then back to a table In other words, try doing this: aTableArray = table2array (aTable); ATableT = array 2table (aTableArray. '); I have also read the document for rot90 , and it says that rot90 is definitely working for tables Do, and I find you...
Read more

c# - Textbox not clickable but editable -

-
I have a small form with 10 text boxes, I have set them in the correct tab order. I want them on my tab service I was wondering if there is a way to set the text box so that they can be selected for editing until they are tabbed. That is ... I do not want the end user to edit the text box to click on them, I just want to make them editable through tabu. this should do the trick public partial category poor text box: Text Box {Safe Override Zero WndProc (Ref: Message Message) {if (m.msg == (Int) WM.LBUTTONDOWN) {Return; // mount down events} base.WndProc (ref m); }} Window message enum can be found. How to do this without anherizing: text box : class EatMouseDown: netwindows {safe override zero WndProc (ref message message) {if (m.msg == (int) WM.LBUTTONDOWN) {return; } Base.WandProc (Ref M); }} Safe Override Zero Onload (EventEurge E) {base.OnLoad (e); How to do this without any part: left a clean part, whatever is important, this can be a buggy but it works R...
Read more