deanmalmgren/franklin_trees_01.jpg

## franklin_trees_01.jpg

      
    Raw
  

              franklin_trees_01.jpg
            
          
## index.html
<html>
  <style>
    #tree { width: 300px}
  </style>
  <body>
    <img id="tree" src="franklin_trees_01.jpg" />
    <script src="http://cdnjs.cloudflare.com/ajax/libs/camanjs/4.1.2/caman.full.min.js"></script>
    <script src="viz.js"></script>
  </body>
</html>

## viz.js
// this is copy-pasted from the documentation
// http://camanjs.com/guides/#Extending
Caman.Filter.register("example", function (adjust) {
  this.process("example", function (rgba) {
    rgba.locationXY(); // e.g. {x: 0, y: 0}

    // Gets the RGBA object for the pixel that is 2 rows down
    // and 3 columns to the right.
    rgba.getPixelRelative(-2, 3);

    // Sets the color for the pixel that is 2 rows down and
    // 3 columns to the right.
    rgba.putPixelRelative(-2, 3, {
      r: 100,
      g: 120,
      b: 140,
      a: 255
    });

    // Gets the RGBA object for the pixel at the given absolute
    // coordinates. Rgba is relative to the top left corner.
    rgba.getPixel(20, 50);

    // Sets the color for the pixel at the given absolute coordinates.
    // Also relative to the top left corner.
    rgba.putPixel(20, 50, {
      r: 100,
      g: 120,
      b: 140,
      a: 255
    });
  });
  return this;
});


Caman("#tree", function () {

  // // this works
  // this.brightness(5).render();

  // this doesn't :(
  this.example().render();
});
	<html>
	<style>
	#tree { width: 300px}
	</style>
	<body>
	<img id="tree" src="franklin_trees_01.jpg" />
	<script src="http://cdnjs.cloudflare.com/ajax/libs/camanjs/4.1.2/caman.full.min.js"></script>
	<script src="viz.js"></script>
	</body>
	</html>
	// this is copy-pasted from the documentation
	// http://camanjs.com/guides/#Extending
	Caman.Filter.register("example", function (adjust) {
	this.process("example", function (rgba) {
	rgba.locationXY(); // e.g. {x: 0, y: 0}

	// Gets the RGBA object for the pixel that is 2 rows down
	// and 3 columns to the right.
	rgba.getPixelRelative(-2, 3);

	// Sets the color for the pixel that is 2 rows down and
	// 3 columns to the right.
	rgba.putPixelRelative(-2, 3, {
	r: 100,
	g: 120,
	b: 140,
	a: 255
	});

	// Gets the RGBA object for the pixel at the given absolute
	// coordinates. Rgba is relative to the top left corner.
	rgba.getPixel(20, 50);

	// Sets the color for the pixel at the given absolute coordinates.
	// Also relative to the top left corner.
	rgba.putPixel(20, 50, {
	r: 100,
	g: 120,
	b: 140,
	a: 255
	});
	});
	return this;
	});


	Caman("#tree", function () {

	// // this works
	// this.brightness(5).render();

	// this doesn't :(
	this.example().render();
	});