Jump to content

  • Log In with Google      Sign In   
  • Create Account


Member Since 14 Aug 2010
Offline Last Active May 23 2016 09:11 AM

Posts I've Made

In Topic: How to round 2 Straight lines

23 May 2016 - 03:33 AM

I wrote you some code for that problem using quadratic Bézier curves: http://no.duckdns.org/curve/index.html

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>Curve</title></head><body>
<canvas id="canvas" width="800" height="800" style="border:1px solid #000000;"></canvas>

var ax = 0;
var ay = 100;
var bx = 500;
var by = 200;
var cx = 300;
var cy = 800;

var radius = 200;

var canvas = document.getElementById("canvas");
var context = canvas.getContext("2d");

function drawLine(ax, ay, bx, by){
	context.moveTo(ax, ay);
	context.lineTo(bx, by);

function drawCircle(x, y, r){
	context.arc(x, y, r, 0, 2*Math.PI);

function drawQuadraticBezierCurve(ax, ay, bx, by, cx, cy){
	context.moveTo(ax, ay);
	var n = 100;
	for (var i = 1; i <= n; i++){
		var t = i/n;
		var s = 1 - t;
		var x = ax*s*s + 2*bx*s*t + cx*t*t;
		var y = ay*s*s + 2*by*s*t + cy*t*t;
		context.lineTo(x, y);

function redraw(){
	context.clearRect(0, 0, canvas.width, canvas.height);

	var bax = bx - ax;
	var bay = by - ay;

	var bcx = bx - cx;
	var bcy = by - cy;

	var ba = Math.sqrt(bax*bax + bay*bay);
	var bc = Math.sqrt(bcx*bcx + bcy*bcy);

	bax *= radius/ba;
	bay *= radius/ba;
	bcx *= radius/bc;
	bcy *= radius/bc;

	context.strokeStyle = "black";
	drawLine(ax, ay, bx - bax, by - bay);
	drawLine(bx - bcx, by - bcy, cx, cy);
	drawCircle(bx, by, radius);
	context.strokeStyle = "green";
	drawQuadraticBezierCurve(bx - bax, by - bay, bx, by, bx - bcx, by - bcy);


window.onmousemove = function(e){
	var dx = e.clientX - bx;
	var dy = e.clientY - by;
	radius = Math.sqrt(dx*dx + dy*dy);


Just copy&paste into a *.txt file, rename it to *.html and open in your browser.

In Topic: Color Curve in a 2D GLSL Filter

12 May 2016 - 04:17 PM

How does it work?


You did not say what you mean with "it". If you mean "How does the smoothstep function work?", the answer can be found on https://en.wikipedia.org/wiki/Smoothstep and https://www.opengl.org/sdk/docs/man/html/smoothstep.xhtml


Or you could create the color gradient with a painting program and load it as a texture. That would allow for more complex gradients with less math operations.

In Topic: Performance on Android

16 April 2016 - 09:35 AM

The Samsung Galaxy Tab A seems to have a Qualcomm Adreno 306 GPU. In my experience, pixel fillrate is often the limiting factor, which according to https://gfxbench.com/device.jsp?D=Qualcomm+msm8916_32+%28Adreno+306%2C+development+board%29 is about 458 Mtexels/s or roughly 7.6 Mtexels per frame so it should be possible to touch each pixel about 9 times per frame with a simple fragment shader that does a texture lookup at a resolution of 1024x768 while running at 60 fps. But those are just theoretical numbers, so better benchmark it yourself to make sure they aren't off by too much.

In Topic: What is more expensive in float?

16 April 2016 - 09:23 AM

(I am assuming you mean trigonometric functions instead of goniometric functions)


Anyway, the correct answer is: Profile your code and test it yourself. My guess would be that the square root and one trigonometric function might be slightly faster, but I don't know which CPU you are using, so YMMV.


<insert obligatory rant about premature optimization here, blablabla>

In Topic: Local hash

23 March 2016 - 04:18 AM




Links are already dead and this post is just 2 days old.