cartodb/torque
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Icon preloading now downloads a set of URLs so if there are duplicated URLs it won't request the same image multiple times

Browse Source 
Image loading can be provided and defaults to previous behaviour: client side `src = url`.
This commit is contained in:
Raul Ochoa 2015-03-04 11:03:46 +01:00
parent 656d082568
commit c0131cdebf
1 changed files with 58 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

85
lib/torque/renderer/point.js
View File

@ -51,6 +51,7 @@ var Filters = require('./torque_filters');
this._sprites = []; // sprites per layer
this._shader = null;
this._icons = {};
this._iconsToLoad = 0;
this._filters = new Filters(this._canvas, {canvasClass: options.canvasClass});
this.setCartoCSS(this.options.cartocss || DEFAULT_CARTOCSS);
this.TILE_SIZE = 256;
@ -194,6 +195,21 @@ var Filters = require('./torque_filters');
? new this.options.imageClass()
: new Image();
},
_setImageSrc: function(img, url, callback) {
if (this.options.setImageSrc) {
this.options.setImageSrc(img, url, callback);
} else {
img.onload = function(){
callback(null);
};
img.onerror = function(){
callback(new Error('Could not load image'));
};
img.src = url;
}
},
_qualifyURL: function(url) {
if (typeof this.options.qualifyURL !== "undefined"){
return this.options.qualifyURL(url);
@ -316,41 +332,54 @@ var Filters = require('./torque_filters');
}
return null;
},
_preloadIcons: function(img_names){
_preloadIcons: function(img_names) {
var self = this;
this._icons = {};
if (img_names.length > 0 && !this._forcePoints){
for (var i = 0; i<img_names.length; i++){
var new_img = this._createImage();
this._icons[this._qualifyURL(img_names[i])] = null;
if (typeof self._icons.itemsToLoad === 'undefined'){
this._icons.itemsToLoad = img_names.length;
if (img_names.length > 0 && !this._forcePoints) {
var qualifiedImageUrlSet = Object.keys(img_names.reduce(function(imgNamesMap, imgName) {
var qualifiedUrl = self._qualifyURL(imgName);
if (!self._icons[qualifiedUrl]) {
imgNamesMap[qualifiedUrl] = true;
}
var filtered = self._shader.getLayers().some(function(layer){return typeof layer.shader["image-filters"] !== "undefined"});
if (filtered){
new_img.crossOrigin = 'Anonymous';
return imgNamesMap;
}, {}));
var filtered = self._shader.getLayers().some(function(layer) {
return typeof layer.shader["image-filters"] !== "undefined";
});
this._iconsToLoad += qualifiedImageUrlSet.length;
qualifiedImageUrlSet.forEach(function(qualifiedImageUrl) {
self._icons[qualifiedImageUrl] = null;
var img = self._createImage();
if (filtered) {
img.crossOrigin = 'Anonymous';
}
new_img.onload = function(e){
self._icons[this.src] = this;
if (Object.keys(self._icons).length === img_names.length + 1){
self._icons.itemsToLoad--;
if (self._icons.itemsToLoad <= 0){
self._setImageSrc(img, qualifiedImageUrl, function(err) {
if (err) {
self._forcePoints = true;
self.clearSpriteCache();
if(filtered) {
console.info("Only CORS-enabled, or same domain image-files can be used in combination with image-filters");
}
console.error("Couldn't get marker-file " + qualifiedImageUrl);
} else {
self._icons[qualifiedImageUrl] = img;
self._iconsToLoad--;
if (self._iconsToLoad <= 0){
self.clearSpriteCache();
self.fire("allIconsLoaded");
}
}
};
new_img.onerror = function(){
self._forcePoints = true;
self.clearSpriteCache();
if(filtered){
console.info("Only CORS-enabled, or same domain image-files can be used in combination with image-filters");
}
console.error("Couldn't get marker-file " + this.src);
};
this.itemsToLoad++;
new_img.src = img_names[i];
}
});
});
} else {
this.fire("allIconsLoaded");
}