jquery - Multiple canvas, reusable gradients -


i trying write dry code multiple canvas. applying gradients chartjs charts , don't want rewrite same gradient each chart instance.

var ctx1 = $("#softwarechart").get(0).getcontext("2d"); var ctx2 = $("#webchart").get(0).getcontext("2d");  var gradient1 = ctx1.createlineargradient(0, 0, 0, 400); gradient1.addcolorstop(0, '#ff9170');    gradient1.addcolorstop(1, '#ff3f05');  var gradient2 = ctx1.createlineargradient(0, 0, 0, 400); gradient3.addcolorstop(0, '#f5d147');    gradient3.addcolorstop(1, '#dfb30c');  var gradient1 = ctx2.createlineargradient(0, 0, 0, 400); gradient1.addcolorstop(0, '#ff9170');    gradient1.addcolorstop(1, '#ff3f05');  var gradient2 = ctx2.createlineargradient(0, 0, 0, 400); gradient3.addcolorstop(0, '#f5d147');    gradient3.addcolorstop(1, '#dfb30c'); 

as can see, not dry, , hate it. there way .getcontext on canvas want use , apply gradients of them @ once?

last time used chart.js, had 17 different charts create.

as long can grab of canvas tags, can add them object array this:

//get array of canvases on dom var chartcount = $('canvas').length;  (var = 1; < chartcount; i++) {     //get dom element of canvas     var el = $('chart').get(i);      //add new entry canvas array dom element , canvas context     canvas[i] = {         'dom_element': el,         'context': el.getcontext('2d')     }; } 

then each canvas context can referenced canvas[x]['context'].

you write function loop through entires in canvas array adding gradients desired.


Comments

Popular posts from this blog

Java 3D LWJGL collision -

spring - SubProtocolWebSocketHandler - No handlers -

methods - python can't use function in submodule -