Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

PNG changed to SVG #74

Open
wants to merge 19 commits into
base: 2.0/develop
Choose a base branch
from
Open

PNG changed to SVG #74

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
19 commits
Select commit Hold shift + click to select a range
470bff0
svg images
Mar 29, 2016
403f606
new marker icon
Mar 30, 2016
0e62aa1
positioning
Mar 30, 2016
100acc6
update
Mar 30, 2016
e72afc6
new colors and icons
Mar 30, 2016
04f3740
new colors
Mar 31, 2016
777ea7b
new colors
Mar 31, 2016
d901fd9
disable png for retina because of svg
Mar 31, 2016
a90d7a9
colors update
Mar 31, 2016
3cba147
Update leaflet.awesome-markers.css
wesleyvandevoorde Apr 4, 2016
47a1d87
delete unused images
Apr 5, 2016
3dca1df
Merge branch '2.0/develop' of https://github.com/wesleyvandevoorde/Le…
Apr 5, 2016
593c496
Update leaflet.awesome-markers.css
wesleyvandevoorde Apr 20, 2016
b96e986
Update leaflet.awesome-markers.js
wesleyvandevoorde May 4, 2016
266ead9
Update leaflet.awesome-markers.js
wesleyvandevoorde May 4, 2016
8524d88
Update leaflet.awesome-markers.js
wesleyvandevoorde May 4, 2016
37aaf36
Update leaflet.awesome-markers.css
wesleyvandevoorde May 4, 2016
b50a39c
New marker layout
wesleyvandevoorde May 4, 2016
768a8ff
Update leaflet.awesome-markers.css
wesleyvandevoorde May 4, 2016
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file removed dist/images/markers-matte.png
View file
Open in desktop
Binary file not shown.
Binary file removed dist/images/[email protected]
View file
Open in desktop
Binary file not shown.
Binary file removed dist/images/markers-plain.png
View file
Open in desktop
Binary file not shown.
Binary file removed dist/images/markers-soft.png
View file
Open in desktop
Binary file not shown.
Binary file removed dist/images/[email protected]
View file
Open in desktop
Binary file not shown.
122 changes: 25 additions & 97 deletions dist/leaflet.awesome-markers.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,119 +6,47 @@ Version: 1.0

/* Marker setup */
.awesome-marker {
background: url('images/markers-soft.png') no-repeat 0 0;
width: 35px;
height: 46px;
position:absolute;
left:0;
top:0;
display: block;
text-align: center;
margin-top:-42px;
margin-left: -17px;
position:absolute;
left:0;
top:0;
display: block;
text-align: center;
}

.awesome-marker .material-icons {
font-size: 17px;
}

.awesome-marker-shadow {
background: url('images/markers-shadow.png') no-repeat 0 0;
width: 36px;
height: 16px;
background: url('images/markers-shadow.png') no-repeat 0 0;
width: 36px;
height: 16px;
}

/* Retina displays */
@media (min--moz-device-pixel-ratio: 1.5),(-o-min-device-pixel-ratio: 3/2),
(-webkit-min-device-pixel-ratio: 1.5),(min-device-pixel-ratio: 1.5),(min-resolution: 1.5dppx) {
.awesome-marker {
background-image: url('images/[email protected]');
background-size: 720px 46px;
}
.awesome-marker-shadow {
background-image: url('images/[email protected]');
background-size: 35px 16px;
}
.awesome-marker-shadow {
background-image: url('images/[email protected]');
background-size: 35px 16px;
}
}

.awesome-marker i {
color: #333;
margin-top: 10px;
display: inline-block;
font-size: 14px;
color: #333;
margin-top: 10px;
display: inline-block;
font-size: 14px;
}

.awesome-marker .icon-white {
color: #fff;
color: #fff;
}

/* Colors */
.awesome-marker-icon-red {
background-position: 0 0;
}

.awesome-marker-icon-darkred {
background-position: -180px 0;
}

.awesome-marker-icon-lightred {
background-position: -360px 0;
}

.awesome-marker-icon-orange {
background-position: -36px 0;
}

.awesome-marker-icon-beige {
background-position: -396px 0;
}

.awesome-marker-icon-green {
background-position: -72px 0;
}

.awesome-marker-icon-darkgreen {
background-position: -252px 0;
}

.awesome-marker-icon-lightgreen {
background-position: -432px 0;
}

.awesome-marker-icon-blue {
background-position: -108px 0;
}

.awesome-marker-icon-darkblue {
background-position: -216px 0;
}

.awesome-marker-icon-lightblue {
background-position: -468px 0;
}

.awesome-marker-icon-purple {
background-position: -144px 0;
}

.awesome-marker-icon-darkpurple {
background-position: -288px 0;
}

.awesome-marker-icon-pink {
background-position: -504px 0;
}

.awesome-marker-icon-cadetblue {
background-position: -324px 0;
}

.awesome-marker-icon-white {
background-position: -574px 0;
}

.awesome-marker-icon-gray {
background-position: -648px 0;
}

.awesome-marker-icon-lightgray {
background-position: -612px 0;
}

.awesome-marker-icon-black {
background-position: -682px 0;
.awesome-marker-background {
fill: #fff;
}
66 changes: 37 additions & 29 deletions dist/leaflet.awesome-markers.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,17 +20,11 @@

L.AwesomeMarkers.Icon = L.Icon.extend({
options: {
iconSize: [35, 45],
iconAnchor: [17, 42],
popupAnchor: [1, -32],
shadowAnchor: [10, 12],
shadowSize: [36, 16],
className: 'awesome-marker',
prefix: 'glyphicon',
spinClass: 'fa-spin',
extraClasses: '',
icon: 'home',
markerColor: 'blue',
icon: 'block',
markerColor: 'white',
iconColor: 'white'
},

Expand All @@ -39,31 +33,45 @@
},

createIcon: function () {
var div = document.createElement('div'),
options = this.options;

if (options.icon) {
div.innerHTML = this._createInner();
}

if (options.bgPos) {
div.style.backgroundPosition =
(-options.bgPos.x) + 'px ' + (-options.bgPos.y) + 'px';
}

this._setIconStyles(div, 'icon-' + options.markerColor);
return div;
var options = L.Util.setOptions(this);
var svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
var path = document.createElementNS('http://www.w3.org/2000/svg', "path");
var backgroundCircle = document.createElementNS('http://www.w3.org/2000/svg', "circle");
var icongroup = document.createElementNS('http://www.w3.org/2000/svg', "g");
var icon = document.createElementNS('http://www.w3.org/2000/svg', "text");

svg.setAttribute('width', '31');
svg.setAttribute('height', '42');
svg.setAttribute('class', 'awesome-marker');
svg.setAttributeNS("http://www.w3.org/2000/xmlns/", "xmlns:xlink", "http://www.w3.org/1999/xlink");

backgroundCircle.setAttribute('cx', '15.5');
backgroundCircle.setAttribute('cy', '15');
backgroundCircle.setAttribute('r', '11');
backgroundCircle.setAttribute('fill', options.markerColor);

path.setAttributeNS(null, "d", "M15.6,1c-7.7,0-14,6.3-14,14c0,10.5,14,26,14,26s14-15.5,14-26C29.6,7.3,23.3,1,15.6,1z");
path.setAttribute('class', 'awesome-marker-background');
path.setAttribute('stroke', 'gray');

icon.textContent = options.icon;
icon.setAttribute('x', '7');
icon.setAttribute('y', '23');
icon.setAttribute('class', 'material-icons');
icon.setAttribute('fill', options.iconColor);
icon.setAttribute('font-family', 'Material Icons');

svg.appendChild(path);
svg.appendChild(backgroundCircle);
icongroup.appendChild(icon);
svg.appendChild(icongroup);

return svg;
},

_createInner: function() {
var iconClass, iconSpinClass = "", iconColorClass = "", iconColorStyle = "", options = this.options;

if(options.icon.slice(0,options.prefix.length+1) === options.prefix + "-") {
iconClass = options.icon;
} else {
iconClass = options.prefix + "-" + options.icon;
}

if(options.spin && typeof options.spinClass === "string") {
iconSpinClass = options.spinClass;
}
Expand All @@ -76,7 +84,7 @@
}
}

return "<i " + iconColorStyle + "class='" + options.extraClasses + " " + options.prefix + " " + iconClass + " " + iconSpinClass + " " + iconColorClass + "'></i>";
return options.extraClasses + " " + iconClass + " " + iconSpinClass + " " + iconColorClass;
},

_setIconStyles: function (img, name) {
Expand Down