Skip to content

Commit

Permalink
Merge pull request #16 from ywx649999311/multiC
Browse files Browse the repository at this point in the history 
Multi Catalog on one layer
  • Loading branch information
Weixiang Yu authored Sep 11, 2017
2 parents 92d4eac + df26b2d commit b61a9a9
Show file tree
Hide file tree
Showing 7 changed files with 431 additions and 90 deletions.
91 changes: 80 additions & 11 deletions js/src/jupyter-vizic.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -263,26 +263,34 @@ var LeafletGridLayerView = LeafletRasterLayerView.extend({
that.obj.options.cMinMax = that.model.get('c_min_max');
that.obj.options.cField = that.model.get('c_field');
that.obj.options.cMap = that.model.get('c_map');
that.obj.options.cByC = that.model.get('c_by_c');
that.obj.options.catCt = that.model.get('cat_ct');
callback(null);
}
this.listenTo(this.model, 'change:color', function() {
var key;
var q = d3.queue();
var c = this.model.get('color');
d3.selectAll('.leaflet-tile').selectAll('ellipse').attr('fill', c);
this.obj.options.color = c;
for (key in that.obj._cTiles) {
q.defer(single_cTile, key, c);
var lock = this.model.get('c_lock');
console.log(lock);
if (lock === false){
d3.selectAll('.leaflet-tile').selectAll('ellipse').attr('fill', c);
this.obj.options.color = c;
for (key in that.obj._cTiles) {
q.defer(single_cTile, key, c);
}
q.awaitAll(function(error) {
if (error) throw error;
console.log('single color change done');
});
}
q.awaitAll(function(error) {
if (error) throw error;
console.log('single color change done');
});
}, this);
this.listenTo(this.model, 'change:c_map', function(){
var custom_c = this.model.get('custom_c');
var c_min_max = this.model.get('c_min_max');
var c_map = this.model.get('c_map');
var c_by_c = this.model.get('c_by_c');
var cat_ct = this.model.get('cat_ct');
var interpolate = d3.scaleSequential(colorMaps[c_map]).domain(c_min_max);
function update_cTile(key, c_field, callback) {
d3.select(that.obj._cTiles[key].el).selectAll('ellipse').attr('fill', function(d) {
Expand All @@ -306,9 +314,66 @@ var LeafletGridLayerView = LeafletRasterLayerView.extend({
console.log('update cTiles for customC');
});
}
else if (c_by_c === true){
interpolate = d3.scaleSequential(colorMaps[c_map]).domain([1,cat_ct+1]);
d3.selectAll('.leaflet-tile').selectAll('ellipse').attr('fill', function(d) {
return interpolate(d.cat_rank);
});
q.defer(change_c_options);
for (key in that.obj._cTiles) {
q.defer(update_cTile, key, 'cat_rank');
}
q.awaitAll(function(error) {
if (error) throw error;
console.log('update cTiles for customC');
});
}
}, this);
this.listenTo(this.model, 'change:c_by_c', function(){
var c_by_c = this.model.get('c_by_c');
var c_map = this.model.get('c_map');
var cat_ct = this.model.get('cat_ct');
var custom_c = this.model.get('custom_c');
var interpolate = d3.scaleSequential(colorMaps[c_map]).domain([1,cat_ct+1]);

function update_cTile(key, callback) {
d3.select(that.obj._cTiles[key].el).selectAll('ellipse').attr('fill', function(d) {
return interpolate(d.cat_rank);
});
callback(null);
}
var key;
var q = d3.queue();
if (c_by_c === true) {
d3.selectAll('.leaflet-tile').selectAll('ellipse').attr('fill', function(d) {
return interpolate(d.cat_rank);
});
q.defer(change_c_options);
for (key in that.obj._cTiles) {
q.defer(update_cTile, key);
}
q.awaitAll(function(error) {
if (error) throw error;
console.log('update cTiles for customC');
});
}
else if (custom_c === false && c_by_c === false) {
d3.selectAll('.leaflet-tile').selectAll('ellipse').attr('fill', that.model.get('color'));
var c = this.model.get('color');
q.defer(change_c_options);
for (key in this.obj._cTiles) {
q.defer(single_cTile, key, c);
}
q.awaitAll(function(error) {
if (error) throw error;
console.log('back to single color');
});
this.obj.options.color = c;
}
}, this);
this.listenTo(this.model, 'change:c_min_max', function() {
var custom_c = this.model.get('custom_c');
var c_by_c = this.model.get('c_by_c');
var c_min_max = this.model.get('c_min_max');
var c_map = this.model.get('c_map');
var interpolate = d3.scaleSequential(colorMaps[c_map]).domain(c_min_max);
Expand All @@ -334,18 +399,19 @@ var LeafletGridLayerView = LeafletRasterLayerView.extend({
if (error) throw error;
console.log('update cTiles for customC');
});
} else {
}
else if (custom_c === false && c_by_c === false){
d3.selectAll('.leaflet-tile').selectAll('ellipse').attr('fill', that.model.get('color'));
var c = this.model.get('color');
q.defer(change_c_options);
for (key in that.obj._cTiles) {
for (key in this.obj._cTiles) {
q.defer(single_cTile, key, c);
}
q.awaitAll(function(error) {
if (error) throw error;
console.log('back to single color');
});
that.obj.options.color = c;
this.obj.options.color = c;
}
}, this);
this.listenTo(this.model, 'change:filter_range', function() {
Expand Down Expand Up @@ -1046,6 +1112,9 @@ var LeafletGridLayerModel = LeafletRasterLayerModel.extend({
y_range: 1.0,
center: [],
color: 'red',
c_lock: false,
c_by_c: false,
cat_ct: 1,
c_min_max: [],
custom_c: false,
c_field: '',
Expand Down
4 changes: 2 additions & 2 deletions js/src/leaflet/scripts/L.CusOverLay.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,8 +48,8 @@ L.CusOverLay = L.Layer.extend({
},

sortJson: function(data){
var chunk = 60,
numGroups = Math.ceil(data.length / chunk);
var numGroups = 8,
chunk = Math.ceil(data.length / numGroups);

for (var i = 0, z = 0; i < numGroups; z += chunk, i++){
this._dataR[i] = data.slice(z, z+chunk);
Expand Down
8 changes: 8 additions & 0 deletions js/src/leaflet/scripts/L.SvgTile.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,8 @@ L.SvgTile = L.GridLayer.extend({
color: undefined,
cMinMax: [],
customC: false,
cByC: false,
catCt: 1,
cField: undefined,
cMap: 1,
filterObj:false,
Expand Down Expand Up @@ -299,6 +301,12 @@ L.SvgTile = L.GridLayer.extend({
return interpolate.domain(cMinMax)(d[cField]);
};
}
if (this.options.cByC){
var catCt = that.options.catCt;
color = function(d) {
return interpolate.domain([1, catCt+1])(d.cat_rank);
};
}
var validate = function(value){
if (value >= range[0] && value < range[1]){
return 'visible';
Expand Down
Loading

0 comments on commit b61a9a9

Please sign in to comment.