SCNText, containerFrame, wrapping and ARKit - scenekit

Has anyone managed to get an SCNText string wrapping correctly within a containerFrame in ARKit?
I've had a go, but the lines seem to be superimposed on top of each other, rather than being rendered vertically in sequence. If it was a problem with the size of the containerFrame being too small, I'd expect the string to just be truncated. It doesn't make a difference which truncation mode I use (...end / ...none / ..middle) etc.
This is code from my SCNNode subclass, creating the extruded text in the init method. The same code works fine (with different sizes obviously) to produce wrapped, extruded text in a standard SceneKit view.
let extrudedText = SCNText(string: definition.text, extrusionDepth: 0.1)
extrudedText.font = UIFont(name: definition.fontname, size: 0.2)!
extrudedText.containerFrame = CGRect(origin: .zero, size: CGSize(width: 1.8, height: 1.5))
extrudedText.truncationMode = kCATruncationMiddle
extrudedText.isWrapped = true
extrudedText.alignmentMode = kCAAlignmentLeft
let material = SCNMaterial.material(named: "rustediron-streaks")
extrudedText.materials = [material]
geometry = extrudedText
// Update pivot of object to its center
// https://stackoverflow.com/questions/44828764/arkit-placing-an-scntext-at-a-particular-point-in-front-of-the-camera
let (min, max) = boundingBox
let dx = min.x + 0.5 * (max.x - min.x)
let dy = min.y + 0.5 * (max.y - min.y)
let dz = min.z + 0.5 * (max.z - min.z)
pivot = SCNMatrix4MakeTranslation(dx, dy, dz)

Answer from Apple: my font size was too small. If I use a "normal" font size and containing frame on the SCNText object, and then set a scale on the node that contains it, everything wraps as expected. Something like:
extrudedText.font = UIFont(name: definition.fontname, size: 20)!
extrudedText.containerFrame = CGRect(origin: .zero, size: CGSize(width: 100.0, height: 500.0))
...
scale = SCNVector3Make(0.01, 0.01, 0.01)

Related

find max among 3 (user populated) arrays (which may be empty)

I am populating 3 arrays and I've no idea which one is being populated (depends on user). My goal is 2 fold.
find which array is being populated
find the Max value Among the 3 arrays (or the arrays which are populated)
eg:
hrGenY = [100,101,102]
cadGenY = [80, 81, 82]
powerGenY = [100,104,106]
This is what I'm doing right now. (This code here is just to determine which array is being populated and NOT nil)
var whichTelemery: [Int] = []
if !powerGenY.isEmpty {
whichTelemery = powerGenY
} else if !hrGenY.isEmpty {
whichTelemery = hrGenY
} else if !cadGenY.isEmpty {
whichTelemery = cadGenY
}
after which I utilise this to determine the X & Y scale for my chart. I use whichever is the Max to normalise the scale.
var yMax: CGFloat = 0.0
var xMax: CGFloat = 0.0
var yMaxTemp: [CGFloat] = [0,0]
var xMaxTemp: [CGFloat] = [0,0]
// Determine yMax & xMax for Scale Resolution
if !dataPointsY.isEmpty {
xMaxTemp[0] = dataPointsX.max()!
yMaxTemp[0] = CGFloat((dataPointsY.max()! >= ftpPlus) ? (1.2*dataPointsY.max()!) : ftpPlus)
xMax = xMaxTemp.max()!
yMax = yMaxTemp.max()!
}
if !whichTelemery.isEmpty && dataPointsY.isEmpty {
xMaxTemp[1] = CGFloat(whichTelemery.count < 900 ? 900 : whichTelemery.count + 1)
yMaxTemp[1] = CGFloat((CGFloat(whichTelemery.max()!) >= ftpPlus) ? (1.2*CGFloat(whichTelemery.max()!)) : ftpPlus)
xMax = xMaxTemp.max()!
yMax = yMaxTemp.max()!
}
The problem with this method is I am making the assumption that the user's power (if populated) will always be higher than the HR(heart rate) which may not be true. When this happens, the HR line will not get drawn as it's above the yMax limit.
The way I'm thinking of doing it is very crude which would involve yet another group of checks to see which of the 3 arrays has the highest number. Would appreciate some better more elegant way.
Thanks
What about getting the max value for your normalisation by doing
let max = [hrGenY.max() ?? 0.0, cadGenY.max() ?? 0.0, powerGenY.max() ?? 0.0].max()

How to eliminate grayish ARKit/SceneKit shadow plane?

I've implemented one of the many ways to add a shadow plane to an ARKit and SceneKit scene. It works pretty well and the shadows look fine.
The problem is that most of the time the plane also has a grayish cast to it. In other words, it's not completely transparent. On the other hand, sometimes the grayish cast goes away only to reappear a few seconds later. I've tried tweaking just about every SCNNode and SCNMaterial property I can think of, but so far, I can't seem to get the gray to reliably go away. Does anyone have any suggestion on how to solve this?
// Make a transparent shadow plane for the Ground.
let shadowPlane = SCNPlane(width: CGFloat(self.width * 2), height: CGFloat(self.depth * 2))
shadowPlane.cornerRadius = 2
let shadowPlaneNode = SCNNode(geometry: shadowPlane)
shadowPlaneNode.name = shadowPlaneNodeName
shadowPlaneNode.eulerAngles.x = -.pi / 2
shadowPlaneNode.castsShadow = false
let material = SCNMaterial()
material.isDoubleSided = false
material.lightingModel = .constant // .shadowOnly does not show any shadows on iOS
material.colorBufferWriteMask = [.alpha]
shadowPlane.materials = [material]
node.addChildNode(shadowPlaneNode)
After more experimentation I found a solution that seems to be working well. Setting the material .lightingModel to .shadowOnly actually works correctly without any gray cast, but only if you set the .shadowModel on the shadow-producing direct light to .forward instead of .deferred.
In addition, I found that there seems to be a bug in .shadowOnly that causes the plane to be rendered completely black if there is any light in the scene with .type == .omni or == .spot.
Here's the code that's working for me:
let shadowPlane = SCNPlane(width: CGFloat(self.width * 1.5), height: CGFloat(self.depth * 1.5))
let shadowPlaneNode = SCNNode(geometry: shadowPlane)
shadowPlaneNode.name = shadowPlaneNodeName
shadowPlaneNode.eulerAngles.x = -.pi / 2
shadowPlaneNode.castsShadow = false
let material = SCNMaterial()
material.isDoubleSided = false
material.lightingModel = .shadowOnly // Requires SCNLight shadowMode = .forward and no .omni or .spot lights in the scene or material rendered black
shadowPlane.materials = [material]
node.addChildNode(shadowPlaneNode)

Getting black and white image when doing rotation?

I want to rotate my image by 45 degree. I have defined a function for the same. When I run it over my RGB images, it is getting saved as grayscale images?
def rotateImage(image, angle):
row,col = image.shape
center=tuple(np.array([row,col])/2)
rot_mat = cv2.getRotationMatrix2D(center,angle,1.0)
new_image = cv2.warpAffine(image, rot_mat, (col,row))
return new_image
rotate_img_path = '../data/rotate_45_img'
rotate_mask_path = '../data/rotate_45_mask'
real_img_path = '../data/img'
real_mask_path = '../data/mask'
for img in os.listdir(real_img_path):
edge_img = cv2.imread(os.path.join(real_img_path,img))
edges = rotateImage(edge_img, 45)
cv2.imwrite(os.path.join(rotate_img_path, img), edges)
print("Finished Copying images")
for img in os.listdir(real_mask_path):
edge_img = cv2.imread(os.path.join(real_mask_path,img))
edges = rotateImage(edge_img, 45)
cv2.imwrite(os.path.join(rotate_mask_path, img), edges)
# cv2.imwrite('edge_' + '.jpg', edges)
print("Finished Copying masks")
A clue here may be
row,col = image.shape
which would raise an error if image was three dimensional (i.e., in color with separate channels for B, G, and R) instead of two (i.e., grayscale). Unless you're reading RGB images with code not shown here, this suggests that your images are already grayscale.

Loop in the svg.js

rect
.animate(1000,"<>",0).dmove(50,0)
.animate(1000,"<>",0).dmove(-10,0)
.animate(1000,"<>",0).dmove(20,0)
.animate(1000,"<>",0).dmove(-60,0).loop(true, true);
Why (and should it?) does the loop not repeat the entire animation? He skips 2 and the 3 step.
Demonstration: https://codepen.io/Andreslav/pen/BxGygp
A very similar issue was solved here. The solution can be adapted for your problem:
let w = 100,
h = 100,
t = 1000,
draw = SVG('svg').size('100%', '100%').viewbox(0,0,w,h);
function animation() {
draw.rect(10,10)
.animate(t,">",0).dx(w/2).width(20).height(10)
.animate(t,">",0).dy(h/2).width(15).height(15)
.animate(t,">",0).dx(-w/2).width(10).height(15)
.animate(t,">",0).dy(-h/2).width(10).height(10).after(animation)
}
animation()
It appears the loop only works on the last action.
You can try a different approach to accomplish the same thing by using a path.
E.g: (you'll need to adjust to replicate the same points)
let width = 1000,
height = 100,
draw = SVG('svg').size('100%', '100%').viewbox(0,0,width,height);
// use path to replicate movement
const path = draw.path("M200 0 H 250 H 100 H 120 H 80")
const length = path.length()
path.fill('none').stroke({width:1, color: '#ccc'})
const rect = draw.rect(100, 100)
rect.animate(5000, '<>').during(function(pos, morph, eased){
var p = path.pointAt(eased * length)
rect.center(p.x, p.y)
}).loop(true, true)
(from tutorials)

Swift - Create circle and add to array

I've been looking for a little while on how to create a circle in Swift, but it seems quite complicated. I want to create a circle at run time, with a specified x and y, and width and height. I then want to add this circle to an array where I can create more circles and add to it.
How do I do this?
Edit: This is what I've tried so far:
var center : CGPoint = touchLocation
var myContext : CGContextRef = UIGraphicsGetCurrentContext()
let color : [CGFloat] = [0, 0, 1, 0.5]
CGContextSetStrokeColor (myContext, color);
CGContextStrokeEllipseInRect (myContext, CGRectMake(touchLocation.x, touchLocation.y, 20, 20));
touchLocation is the location of the users finger. This crashes on execution on this line:
var myContext : CGContextRef = UIGraphicsGetCurrentContext()
The error says "Unexpectedly found nil while unwrapping an Optional value
Also, this doesn't allow me to add the circle to an array, because I don't know what variable type it is.
There are many ways to draw a circle, here is a snippet that I have been hacking with:
func circleWithCenter(c:CGPoint, radius r:CGFloat,
strokeColor sc: UIColor = UIColor.blackColor(),
fillColor fc: UIColor = UIColor.clearColor()) -> CAShapeLayer {
var circle = CAShapeLayer()
circle.frame = CGRect(center:c, size:CGSize(width:2*r, height:2*r))
circle.path = UIBezierPath(ovalInRect:circle.bounds).CGPath
circle.fillColor = fc.CGColor
circle.strokeColor = sc.CGColor
circle.fillColor = fc == UIColor.clearColor() ? nil : fc.CGColor
return circle
}
Note that I extended CGRect (using Swift specific features) to add a initializer that takes a center, but that is not material to your question.
Your code is not "creating" a circle as an object, it is attempting to draw one in the graphics context. What you need to do is to create a bezier path object, draw into that and save the path in your array. Something like:
var circleArray = [CGMutablePathRef]()
// ...
let path: CGMutablePathRef = CGPathCreateMutable()
CGPathAddArc(path, nil, touchLocation.x, touchLocation.y, radius, 0, M_PI * 2, true)
circleArray += [path]
You then need to stroke the path(s) in your draw routine.

Resources