12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970 |
- function createBillboardPointCallback(
- centerAlpha,
- cssColor,
- cssOutlineColor,
- cssOutlineWidth,
- pixelSize
- ) {
- return function () {
- var canvas = document.createElement("canvas");
- var length = pixelSize + 2 * cssOutlineWidth;
- canvas.height = canvas.width = length;
- var context2D = canvas.getContext("2d");
- context2D.clearRect(0, 0, length, length);
- if (cssOutlineWidth !== 0) {
- context2D.beginPath();
- context2D.arc(length / 2, length / 2, length / 2, 0, 2 * Math.PI, true);
- context2D.closePath();
- context2D.fillStyle = cssOutlineColor;
- context2D.fill();
-
- if (centerAlpha < 1.0) {
- context2D.save();
- context2D.globalCompositeOperation = "destination-out";
- context2D.beginPath();
- context2D.arc(
- length / 2,
- length / 2,
- pixelSize / 2,
- 0,
- 2 * Math.PI,
- true
- );
- context2D.closePath();
- context2D.fillStyle = "black";
- context2D.fill();
- context2D.restore();
- }
- }
- context2D.beginPath();
- context2D.arc(length / 2, length / 2, pixelSize / 2, 0, 2 * Math.PI, true);
- context2D.closePath();
- context2D.fillStyle = cssColor;
- context2D.fill();
- return canvas;
- };
- }
- export default createBillboardPointCallback;
|