1313* `var obj=dataMappingGuide(canvas,src);`
1414* this function returns an object with some methods to control
1515*=== Parameters ===
16- * - canvas: a canvas element
17- * - src: an optional filename or pathname of an image for background
16+ * - ` canvas` : a canvas element
17+ * - ` src` : an optional filename or pathname of an image for background
1818*=== Methods ===
19- *
19+ *### 1) resizing and background ###
20+ * - `resize(w,h,src)`; it sets canvas size and background image
21+ * - `setDivisions(x,y)`; it sets horizontal and vertical divisions
22+ * - `w` and `h`: new values for canvas width and canvas height
23+ * - `src`: filename or pathname of an image; 'none' is default value
24+ * - `x` and `y`: numbers for horizontal and vertical divisions
25+ *### 2) colors ###
26+ * - `setColor(rgb,alpha)`; it sets rgb color and alpha value
27+ * - `rgb`: rgb color value
28+ * - `alpha`: an optional value between 0.0 (fully transparent) and 1.0 (fully opaque)
29+ *### 3) focus area ###
30+ * - `xy(x,y)`; it puts focus on a area that is specified using integer coordinates
31+ * - `x` and `y`: positive integer indices for horizontal and vertical divisions
32+ *### other methods ###
33+ * - `clear()`; it clears canvas
34+ * - `next()`; it returns coordinates for the next focus area as form of [x,y]
35+ * - `info()`; it returns the current state of sampling
2036*=== Focus area indices ===
2137* an example of 3x3 divided focus area
2238* _|1|2|3|
2642*/
2743//============================================================================
2844function dataMappingGuide ( canvas , src ) {
29- //- canvas: a canvas element
30- //- src: an optional filename or pathname of an image for background
45+ // - canvas: a canvas element
46+ // - src: an optional filename or pathname of an image for background
3147 //cvs is object to return
3248 var cvs = {
3349 /*background image*/
@@ -52,8 +68,8 @@ function dataMappingGuide(canvas,src){
5268 //### 1) resizing and background ###
5369 //it sets canvas size and background image
5470 cvs . resize = function ( w , h , src ) {
55- //- w and h: new value for canvas width and canvas height
56- //- src: filename or pathname of an image; 'none' is default value
71+ // - w and h: new values for canvas width and canvas height
72+ // - src: filename or pathname of an image; 'none' is default value
5773 cvs . img = ! src ?'none' :src ;
5874 //background image
5975 canvas . style . backgroundRepeat = 'no-repeat' ;
@@ -69,8 +85,7 @@ function dataMappingGuide(canvas,src){
6985 } ;
7086 //it sets horizontal and vertical divisions
7187 cvs . setDivisions = function ( x , y ) {
72- // - x: a number of horizontal division
73- // - y: a number of vertical division
88+ // - x and y: numbers for horizontal and vertical divisions
7489 x = ! x ?1 :x ;
7590 y = ! y ?1 :y ;
7691 cvs . Nx = + x < 1 ?+ 1 :Math . floor ( + x ) ;
@@ -91,8 +106,7 @@ function dataMappingGuide(canvas,src){
91106 //### 3) focus area ###
92107 //it puts focus on a area that is specified using integer coordinates
93108 cvs . xy = function ( x , y ) {
94- // - x: a positive integer index for horizontal division
95- // - y: a positive integer index for vertical division
109+ // - `x` and `y`: positive integer indices for horizontal and vertical divisions
96110 x = ! x ?1 :x ;
97111 y = ! y ?1 :y ;
98112 x = + x < 1 ?1 :Math . floor ( + x ) ;
@@ -124,6 +138,7 @@ function dataMappingGuide(canvas,src){
124138 ctx = null ;
125139 return [ cvs . X , cvs . Y ] ;
126140 } ;
141+ //### other methods ###
127142 //it clears canvas
128143 cvs . clear = function ( ) {
129144 var ctx = canvas . getContext ( '2d' ) ;
0 commit comments