Cannot add 'drawn' icons from a canvas
ggiordan opened this issue · 2 comments
I'm submitting a ... (check one with "x")
- question
- any problem or bug report
OS: (check one with "x")
- Android
- iOS
- Browser
cordova information: (run $> cordova plugin list)
Not relevant
Current behavior:
Marker icons created using a canvas results in an exception in Map.js
This code will generate an exception in the plugin. The net result being that the icon isn't shown:
this.markOptions.icon = canvas.toDataURL();
var marker = map.addMarker(this.markOptions);
The problem is in Map.js near line 1380:
if (marker) {
markerOptions.icon.size = markerOptions.icon.size || {};
markerOptions.icon.size.width = markerOptions.icon.size.width || result.width;
markerOptions.icon.size.height = markerOptions.icon.size.height || result.height;
markerOptions.icon.anchor = markerOptions.icon.anchor || [markerOptions.icon.size.width / 2, markerOptions.icon.size.height];
if (!markerOptions.infoWindowAnchor) {
markerOptions.infoWindowAnchor = [markerOptions.icon.size.width / 2, 0];
}
The problem is that markerOption.icon is a STRING, so you cannot set these properties.
Expected behavior:
One would expect to be able to use a 'painted' icon from a canvas without problems.
The fix is to check the type of the markerOptions.icon and verify that it's not a string (this is done in the code for other purposes a few lines above)
I change the code to look like this and it seems to work
if (marker) {
if (typeof markerOptions.icon !== 'string') {
markerOptions.icon.size = markerOptions.icon.size || {};
markerOptions.icon.size.width = markerOptions.icon.size.width || result.width;
markerOptions.icon.size.height = markerOptions.icon.size.height || result.height;
markerOptions.icon.anchor = markerOptions.icon.anchor || [markerOptions.icon.size.width / 2, markerOptions.icon.size.height];
if (!markerOptions.infoWindowAnchor) {
markerOptions.infoWindowAnchor = [markerOptions.icon.size.width / 2, 0];
}
}
Screen capture or video record:
No need
Related code, data or error log (please format your code or data):
N/A
The affected code is above
Support this plugin activity
That is the plan. You have a great plugin!
How about this?
this.markOptions.icon = {
url: canvas.toDataURL()
};
var marker = map.addMarker(this.markOptions);