bluehalo / bluehalo/ngx-leaflet-tutorial-plugins
Custom TimeDimension layer, Angular and ngx-leaflet
- Dominant language
- TypeScript
- Stars
- 21
- Forks
- 9
- PR merge metrics
- No merged PRs in 30d
Description
Hi Guys,
First, I want to thank you for your amazing job. I found the tutorial quite useful.
I am having some problem trying to create a Custom TimeDimension layer with angular. I am new to typescript and I will really appreciate any help.
This is my vanilla javascript code which works in my javascript leaflet project.
```javascript
var myLayer = L.TimeDimension.Layer.myLayer = L.TimeDimension.Layer.extend({
initialize: function(options) {
this._currentLoadedTime = 0;
var layer = new L.imageOverlay("img/transparent.gif", imageBounds, {opacity: 0.2} );
L.TimeDimension.Layer.prototype.initialize.call(this, layer, options);
this._baseURL = options.baseURL || null;
this._dataMode = options.dataMode || null;
},
onAdd: function(map) {
L.TimeDimension.Layer.prototype.onAdd.call(this, map);
map.addLayer(this._baseLayer);
if (this._timeDimension) {
this._getUrlForDataModelImage(this._timeDimension.getCurrentTime());
currentTimeSelected = this._timeDimension.getCurrentTime();
}
},
_onNewTimeLoading: function(ev) {
this._getUrlForDataModelImage(ev.time);
currentTimeSelected = ev.time;
return;
},
isReady: function(time) {
currentTimeSelected = time;
return (this._currentLoadedTime == time);
},
_update: function() {
this._baseLayer.setUrl(this._getUrlForDataModelImage(this._timeDimension.getCurrentTime()));
return true;
},
_getUrlForDataModelImage: function(time) {
//CREATES THE URL WHERE DATA CAN BE OBTAINED
return "url" //private url
}
});
//usage
L.timeDimension.layer.myLayer = function(options) {
return new L.TimeDimension.Layer.myLayer(options);
};
```
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.