126 lines
4.3 KiB
HTML
126 lines
4.3 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<title>JSDoc: Source: modules/makePin.js</title>
|
||
|
||
<script src="scripts/prettify/prettify.js"></script>
|
||
<script src="scripts/prettify/lang-css.js"></script>
|
||
<!--[if lt IE 9]>
|
||
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
|
||
<![endif]-->
|
||
<link
|
||
type="text/css"
|
||
rel="stylesheet"
|
||
href="styles/prettify-tomorrow.css"
|
||
/>
|
||
<link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css" />
|
||
</head>
|
||
|
||
<body>
|
||
<div id="main">
|
||
<h1 class="page-title">Source: modules/makePin.js</h1>
|
||
|
||
<section>
|
||
<article>
|
||
<pre class="prettyprint source linenums"><code>// creates pins
|
||
import { Feature } from "ol";
|
||
import { Icon, Style } from "ol/style";
|
||
import Point from "ol/geom/Point.js";
|
||
|
||
/**
|
||
* @module makePin
|
||
*/
|
||
|
||
/** Makes pin feature from arguments
|
||
* @param {number} lon - Longitude
|
||
* @param {number} lat - Latitude
|
||
* @param {string} storeName - Name of store
|
||
* @param {string} cheapest - Cheapest item in store
|
||
* @param {number} flozPrice - Price per fluid ounce of cheapest item in store
|
||
* @returns {ol.Feature} - Created pin feature
|
||
*/
|
||
const makePin = (lon, lat, storeName, cheapest, flozPrice) => {
|
||
// define pin graphics (since this is all inline)
|
||
const pinSVG = `<svg width="32px" height="32px" viewBox="-0.12 -0.12 12.24 12.24" enable-background="new 0 0 12 12" id="Слой_1" version="1.1" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#000000" stroke="#000000" stroke-width="0.12000000000000002"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"><path d="M6,0C3.2385864,0,1,2.2385864,1,5s2.5,5,5,7c2.5-2,5-4.2385864,5-7S8.7614136,0,6,0z M6,7 C4.8954468,7,4,6.1045532,4,5s0.8954468-2,2-2s2,0.8954468,2,2S7.1045532,7,6,7z" fill="#ed333b"></path></g></svg>`;
|
||
const pinSVGBlob = new Blob([pinSVG], {
|
||
type: "image/svg+xml",
|
||
});
|
||
const pinImageURL = URL.createObjectURL(pinSVGBlob);
|
||
|
||
// define style for all pins
|
||
const pinStyle = new Style({
|
||
image: new Icon({
|
||
src: pinImageURL,
|
||
anchor: [0.5, 1],
|
||
}),
|
||
});
|
||
|
||
// create pin as feature
|
||
const pin = new Feature({
|
||
geometry: new Point([lon, lat]),
|
||
store: storeName,
|
||
cheapestItem: cheapest,
|
||
pricePerOz: flozPrice,
|
||
});
|
||
|
||
// set style for pin
|
||
pin.setStyle(pinStyle);
|
||
|
||
return pin;
|
||
};
|
||
|
||
export default makePin;
|
||
</code></pre>
|
||
</article>
|
||
</section>
|
||
</div>
|
||
|
||
<nav>
|
||
<h2><a href="index.html">Home</a></h2>
|
||
<h3>Modules</h3>
|
||
<ul>
|
||
<li>
|
||
<a href="module-changeResolutionHandler.html"
|
||
>changeResolutionHandler</a
|
||
>
|
||
</li>
|
||
<li><a href="module-fetchPins.html">fetchPins</a></li>
|
||
<li><a href="module-makePin.html">makePin</a></li>
|
||
<li><a href="module-newButton.html">newButton</a></li>
|
||
<li><a href="module-pointerMoveHandler.html">pointerMoveHandler</a></li>
|
||
<li><a href="module-searchBar.html">searchBar</a></li>
|
||
<li><a href="module-searchInputHander.html">searchInputHander</a></li>
|
||
<li><a href="module-toLatLon.html">toLatLon</a></li>
|
||
</ul>
|
||
<h3>Classes</h3>
|
||
<ul>
|
||
<li><a href="module-newButton-ButtonControl.html">ButtonControl</a></li>
|
||
</ul>
|
||
<h3>Global</h3>
|
||
<ul>
|
||
<li><a href="global.html#disposePopover">disposePopover</a></li>
|
||
<li><a href="global.html#map-onclick">map.onclick</a></li>
|
||
<li><a href="global.html#passlocation">window.passLocation</a></li>
|
||
<li><a href="global.html#placepin">window.placePin</a></li>
|
||
<li><a href="global.html#map">map</a></li>
|
||
<li><a href="global.html#pinLayer">pinLayer</a></li>
|
||
<li><a href="global.html#pinSource">pinSource</a></li>
|
||
<li><a href="global.html#popup">popup</a></li>
|
||
</ul>
|
||
</nav>
|
||
|
||
<br class="clear" />
|
||
|
||
<footer>
|
||
Documentation generated by
|
||
<a href="https://github.com/jsdoc/jsdoc">JSDoc 4.0.2</a> on Sun Dec 31
|
||
2023 15:19:11 GMT-0800 (Pacific Standard Time)
|
||
</footer>
|
||
|
||
<script>
|
||
prettyPrint();
|
||
</script>
|
||
<script src="scripts/linenumber.js"></script>
|
||
</body>
|
||
</html>
|