gitea-mirror/aladin-lite
1
0
Fork 0
mirror of https://github.com/cds-astro/aladin-lite.git synced 2025-12-12 15:49:18 -08:00
Code Issues Packages Projects Releases Wiki Activity

add doc for the different shapes

Browse Source
This commit is contained in:
Matthieu Baumann
2024-04-05 11:52:23 +02:00
committed by Matthieu Baumann
parent b68358f6b2
commit c797aec7f7
15 changed files with 261 additions and 163 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
examples/al-cat-proper-motion.html
View File

@@ -12,7 +12,7 @@
// Start up Aladin Lite
aladin = A.aladin('#aladin-lite-div', {
target: "LMC",
fov: 2,
fov: 10,
showContextMenu: true,
fullScreen: true,
showSimbadPointerControl: true,
@@ -27,47 +27,47 @@
//aladin.addCatalog(A.catalogFromVizieR('J/A+A/663/A107/table5', 'LMC', 5, {
const pmCat = A.catalogFromURL('./data/proper_motion.xml', {
onClick: 'showTable',
name: 'mean pm over HPX cells around LMC from GaiaDR2',
hoverColor: 'yellow',
// Footprint associated to sources
shape: (s) => {
// compute the mean of pm over the catalog sources
if (!pmraMean || !pmdecMean) {
pmraMean = 0, pmdecMean = 0;
for (var s of pmCat.getSources()) {
pmraMean += +s.data.pmra;
pmdecMean += +s.data.pmdec;
}
const numSources = pmCat.getSources().length;
pmraMean /= numSources
pmdecMean /= numSources
onClick: 'showTable',
name: 'mean pm over HPX cells around LMC from GaiaDR2',
hoverColor: 'yellow',
selectionColor: 'white',
// Footprint associated to sources
shape: (s) => {
// Compute the mean of pm over the catalog sources
if (!pmraMean || !pmdecMean) {
pmraMean = 0, pmdecMean = 0;
for (var s of pmCat.getSources()) {
pmraMean += +s.data.pmra;
pmdecMean += +s.data.pmdec;
}
let dra = +s.data.pmra - pmraMean;
let ddec = +s.data.pmdec - pmdecMean;
const numSources = pmCat.getSources().length;
let mag = Math.sqrt(dra * dra + ddec * ddec);
// discard drawing a vector for big pm
if (mag > 1) {
return;
}
let color = rainbowColorMap(mag * 2)
return A.line(
s.ra,
s.dec,
s.ra + dra,
s.dec + ddec,
null,
{lineWidth: 3, arrow: true, color}
)
pmraMean /= numSources
pmdecMean /= numSources
}
},
);
let dra = +s.data.pmra - pmraMean;
let ddec = +s.data.pmdec - pmdecMean;
let mag = Math.sqrt(dra * dra + ddec * ddec);
// discard drawing a vector for big pm
if (mag > 1) {
return;
}
let color = rainbowColorMap(mag * 2)
return A.vector(
s.ra,
s.dec,
s.ra + dra,
s.dec + ddec,
null,
{lineWidth: 3, color}
)
}
});
aladin.addCatalog(pmCat);
});

4
src/core/src/app.rs
View File

@@ -821,6 +821,10 @@ impl App {
}
}
pub(crate) fn draw_grid_labels(&mut self) -> Result<(), JsValue> {
self.grid.draw_labels(&self.camera)
}
pub(crate) fn draw(&mut self, force_render: bool) -> Result<(), JsValue> {
/*let scene_redraw = self.rendering | force_render;
let mut ui = self.ui.lock();

31
src/core/src/grid/mod.rs
View File

@@ -2,6 +2,7 @@ pub mod label;
pub mod meridian;
pub mod parallel;
use crate::grid::parallel::Parallel;
use crate::math::projection::coo_space::XYScreen;
use crate::Abort;
@@ -31,6 +32,9 @@ pub struct ProjetedGrid {
fmt: angle::SerializeFmt,
line_style: line::Style,
meridians: Vec<Meridian>,
parallels: Vec<Parallel>,
}
use crate::shader::ShaderManager;
@@ -40,6 +44,8 @@ use crate::renderable::line::RasterizedLineRenderer;
use crate::renderable::text::TextRenderManager;
use web_sys::HtmlElement;
use self::meridian::Meridian;
impl ProjetedGrid {
pub fn new(aladin_div: &HtmlElement) -> Result<ProjetedGrid, JsValue> {
let text_renderer = TextRenderManager::new(aladin_div)?;
@@ -56,6 +62,8 @@ impl ProjetedGrid {
let line_style = line::Style::None;
let fmt = angle::SerializeFmt::DMS;
let thickness = 2.0;
let meridians = Vec::new();
let parallels = Vec::new();
let grid = ProjetedGrid {
color,
@@ -66,6 +74,8 @@ impl ProjetedGrid {
thickness,
text_renderer,
meridians,
parallels,
fmt,
};
// Initialize the vertices & labels
@@ -147,7 +157,7 @@ impl ProjetedGrid {
let step_line_px = max_dim_px * 0.2;
// update meridians
let meridians = {
self.meridians = {
// Select the good step with a binary search
let step_lon_precised =
(bbox.get_lon_size() as f64) * step_line_px / (camera.get_width() as f64);
@@ -173,7 +183,7 @@ impl ProjetedGrid {
meridians
};
let parallels = {
self.parallels = {
let step_lat_precised =
(bbox.get_lat_size() as f64) * step_line_px / (camera.get_height() as f64);
let step_lat = select_fixed_step(step_lat_precised);
@@ -196,11 +206,12 @@ impl ProjetedGrid {
};
// update the line buffers
let paths = meridians
let paths = self
.meridians
.iter()
.map(|meridian| meridian.get_lines_vertices())
.chain(
parallels
self.parallels
.iter()
.map(|parallel| parallel.get_lines_vertices()),
)
@@ -213,12 +224,16 @@ impl ProjetedGrid {
let m = camera.get_screen_size().magnitude();
rasterizer.add_stroke_paths(paths, self.thickness, &self.color, &self.line_style);
// update labels
if self.show_labels {
let labels = meridians
Ok(())
}
pub fn draw_labels(&mut self, camera: &CameraViewPort) -> Result<(), JsValue> {
if self.enabled && self.show_labels {
let labels = self
.meridians
.iter()
.filter_map(|m| m.get_label())
.chain(parallels.iter().filter_map(|p| p.get_label()));
.chain(self.parallels.iter().filter_map(|p| p.get_label()));
let dpi = camera.get_dpi();
self.text_renderer.begin();

5
src/core/src/lib.rs
View File

@@ -927,6 +927,11 @@ impl WebClient {
self.app.is_rendering()
}
#[wasm_bindgen(js_name = drawGridLabels)]
pub fn draw_grid_labels(&mut self) -> Result<(), JsValue> {
self.app.draw_grid_labels()
}
#[wasm_bindgen(js_name = parseVOTable)]
pub fn parse_votable(&mut self, s: &str) -> Result<JsValue, JsValue> {
/*let votable: VOTableWrapper<votable::impls::mem::InMemTableDataRows> =

17
src/core/src/renderable/text.rs
View File

@@ -82,27 +82,10 @@ impl TextRenderManager {
Ok(())
}
pub fn draw(
&mut self,
_camera: &CameraViewPort,
_color: &ColorRGBA,
_scale: f32,
) -> Result<(), JsValue> {
Ok(())
}
}
impl Renderer for TextRenderManager {
fn begin(&mut self) {
self.ctx = self
.canvas
.get_context("2d")
.unwrap_abort()
.unwrap_abort()
.dyn_into::<web_sys::CanvasRenderingContext2d>()
.unwrap_abort();
//self.clear_text_canvas();
// Clear the Aladin Lite 2d canvas
// This canvas is where catalogs, grid labels, Hpx grid are drawn

12
src/css/aladin.css
View File

@@ -54,18 +54,6 @@
padding-top: 58.45%; /* aspect ratio of the background image */
}
.aladin-col {
float: left;
width: 45.00%;
margin-right: 5.0%;
}
/* Clear floats after the columns */
.aladin-row:after {
content: "";
display: table;
clear: both;
}
.aladin-clipboard::before {
content: ' 📋';
cursor:pointer;

76
src/js/A.js
View File

@@ -147,7 +147,7 @@ A.imageFITS = function (url, options) {
* @memberof A
* @param {number} ra - Right Ascension (RA) coordinate in degrees.
* @param {number} dec - Declination (Dec) coordinate in degrees.
* @param {*} [data] - Additional data associated with the source.
* @param {Object} [data] - Additional data associated with the source.
* @param {SourceOptions} [options] - Options for configuring the source object.
* @returns {Source} A celestial source object.
* @example
@@ -166,7 +166,7 @@ A.source = function (ra, dec, data, options) {
* @param {number} ra - Right Ascension (RA) coordinate in degrees.
* @param {number} dec - Declination (Dec) coordinate in degrees.
* @param {MarkerOptions} [options] - Options for configuring the marker.
* @param {*} [data] - Additional data associated with the marker.
* @param {Object} [data] - Additional data associated with the marker.
* @returns {Source} A marker source object.
* @example
* const markerObj = A.marker(180.0, 30.0, data, options);
@@ -184,10 +184,11 @@ A.marker = function (ra, dec, options, data) {
* @memberof A
* @name polygon
*
* @param {Array} raDecArray - Array of celestial coordinates representing the vertices of the polygon.
* Each element should be an object with properties `ra` (Right Ascension) in degrees and `dec` (Declination) in degrees.
* @param {Object} options - Options for configuring the polygon.
* @param {Array.<number[]>} radecArray - right-ascension/declination 2-tuple array describing the polyline's vertices in degrees
* @param {ShapeOptions} options - Options for configuring the polygon
* @throws {string} Throws an error if the number of vertices is less than 3.
*
* @returns {Polyline}
*/
A.polygon = function (raDecArray, options) {
const numVertices = raDecArray.length;
@@ -212,15 +213,16 @@ A.polygon = function (raDecArray, options) {
};
/**
* Creates a polyline object using an array of celestial coordinates (RA, Dec).
* Creates a polyline shape
*
* @function
* @memberof A
* @name polyline
*
* @param {Array} raDecArray - Array of celestial coordinates representing the vertices of the polyline.
* Each element should be an object with properties `ra` (Right Ascension) in degrees and `dec` (Declination) in degrees.
* @param {Object} options - Options for configuring the polyline.
* @param {Array.<number[]>} radecArray - right-ascension/declination 2-tuple array describing the polyline's vertices in degrees
* @param {ShapeOptions} options - Options for configuring the polyline.
*
* @returns {Polyline}
*/
A.polyline = function (raDecArray, options) {
return new Polyline(raDecArray, options);
@@ -228,7 +230,7 @@ A.polyline = function (raDecArray, options) {
/**
* Creates a circle object
* Creates a circle shape
*
* @function
* @memberof A
@@ -238,14 +240,15 @@ A.polyline = function (raDecArray, options) {
* @param {number} dec - Declination (Dec) coordinate of the center in degrees.
* @param {number} radiusDeg - Radius in degrees.
* @param {Object} options - Options for configuring the circle.
* @param {ShapeOptions} options - Options for configuring the circle.
* @returns {Circle}
*/
A.circle = function (ra, dec, radiusDeg, options) {
return new Circle([ra, dec], radiusDeg, options);
};
/**
* Creates a ellipse object
* Creates an ellipse shape
*
* @function
* @memberof A
@@ -257,14 +260,15 @@ A.circle = function (ra, dec, radiusDeg, options) {
* @param {number} radiusDecDeg - the radius along the dec axis in degrees
* @param {number} rotationDeg - the rotation angle in degrees
* @param {Object} options - Options for configuring the ellipse.
* @param {ShapeOptions} options - Options for configuring the ellipse.
* @returns {Ellipse}
*/
A.ellipse = function (ra, dec, radiusRaDeg, radiusDecDeg, rotationDeg, options) {
return new Ellipse([ra, dec], radiusRaDeg, radiusDecDeg, rotationDeg, options);
};
/**
* Creates a ellipse object
* Creates a line shape
*
* @function
* @memberof A
@@ -274,8 +278,8 @@ A.ellipse = function (ra, dec, radiusRaDeg, radiusDecDeg, rotationDeg, options)
* @param {number} dec1 - Declination (Dec) coordinate of the center in degrees.
* @param {number} ra2 - Right Ascension (RA) coordinate of the center in degrees.
* @param {number} dec2 - Declination (Dec) coordinate of the center in degrees.
* @param {CooFrame} [frame] - Right Ascension (RA) coordinate of the center in degrees.
* @param {Object} options - Options for configuring the ellipse.
* @param {CooFrame} [frame] - Frame in which the coordinates are given. If none, the frame used is icrs/j2000.
* @param {ShapeOptions} options - Options for configuring the line.
*
* @returns {Line}
*/
@@ -283,6 +287,28 @@ A.ellipse = function (ra, dec, radiusRaDeg, radiusDecDeg, rotationDeg, options)
return new Line(ra1, dec1, ra2, dec2, frame, options);
};
/**
* Creates a vector shape
*
* @function
* @memberof A
* @name vector
*
* @param {number} ra1 - Right Ascension (RA) coordinate of the center in degrees.
* @param {number} dec1 - Declination (Dec) coordinate of the center in degrees.
* @param {number} ra2 - Right Ascension (RA) coordinate of the center in degrees.
* @param {number} dec2 - Declination (Dec) coordinate of the center in degrees.
* @param {CooFrame} [frame] - Frame in which the coordinates are given. If none, the frame used is icrs/j2000.
* @param {ShapeOptions} options - Options for configuring the vector.
*
* @returns {Line}
*/
A.vector = function (ra1, dec1, ra2, dec2, frame, options) {
options['arrow'] = true;
return A.line(ra1, dec1, ra2, dec2, frame, options);
}
/**
* Creates a graphic overlay on the Aladin Lite view.
*
@@ -338,15 +364,19 @@ A.coo = function (longitude, latitude, prec) {
return new Coo(longitude, latitude, prec);
};
// API
A.footprint = function(shapes) {
return new Footprint(shapes);
};
// API
/**
* Parse shapes from a STC-S string
*
* @function
* @memberof A
* @name footprintsFromSTCS
*
* @param {string} stcs - The STC-S string describing the shapes
* @param {ShapeOptions} [options] - Options for the shape
* @returns {Array.<Polyline|Circle>} Returns a list of shapes from the STC-S string
*/
A.footprintsFromSTCS = function (stcs, options) {
var footprints = Overlay.parseSTCS(stcs, options);
return footprints;
}

32
src/js/Aladin.js
View File

@@ -216,9 +216,16 @@ export let Aladin = (function () {
}
// merge with default options
var options = {
gridOptions: {}
};
var options = {};
for (var key in Aladin.DEFAULT_OPTIONS) {
if (requestedOptions[key] !== undefined) {
options[key] = requestedOptions[key];
}
else {
options[key] = Aladin.DEFAULT_OPTIONS[key];
}
}
// 'gridOptions' is an object, so it need it own loop
if ('gridOptions' in requestedOptions) {
@@ -228,14 +235,7 @@ export let Aladin = (function () {
}
}
}
for (var key in Aladin.DEFAULT_OPTIONS) {
if (requestedOptions[key] !== undefined) {
options[key] = requestedOptions[key];
}
else {
options[key] = Aladin.DEFAULT_OPTIONS[key];
}
}
for (var key in requestedOptions) {
if (Aladin.DEFAULT_OPTIONS[key] === undefined) {
options[key] = requestedOptions[key];
@@ -271,6 +271,7 @@ export let Aladin = (function () {
// Grid
let gridOptions = options.gridOptions;
console.log(options.gridOptions)
// color and opacity can be defined by two variables. The item in gridOptions
// should take precedence.
gridOptions["color"] = options.gridOptions.color || options.gridColor;
@@ -278,6 +279,7 @@ export let Aladin = (function () {
if (options && options.showCooGrid) {
gridOptions.enabled = true;
}
console.log(gridOptions)
this.setCooGrid(gridOptions);
this.gotoObject(options.target, undefined);
@@ -697,18 +699,18 @@ export let Aladin = (function () {
* Sets the coordinate frame of the Aladin instance to the specified frame.
*
* @memberof Aladin
* @param {string} frameName - The name of the coordinate frame. Possible values: 'J2000', 'J2000d', 'GALACTIC'.
* @param {string} frame - The name of the coordinate frame. Possible values: 'j2000d', 'j2000', 'gal', 'icrs'. The given string is case insensitive.
*
* @example
* // Set the coordinate frame to 'J2000'
* const aladin = A.aladin('#aladin-lite-div');
* aladin.setFrame('J2000');
*/
Aladin.prototype.setFrame = function (frameName) {
if (!frameName) {
Aladin.prototype.setFrame = function (frame) {
if (!frame) {
return;
}
var newFrame = CooFrameEnum.fromString(frameName, CooFrameEnum.J2000);
var newFrame = CooFrameEnum.fromString(frame, CooFrameEnum.J2000);
if (newFrame == this.view.cooFrame) {
return;
}

26
src/js/Circle.js
View File

@@ -29,13 +29,27 @@
*****************************************************************************/
import { Utils } from "./Utils";
import { AladinUtils } from "./AladinUtils.js";
import { Overlay } from "./Overlay.js";
// TODO : Circle and Footprint should inherit from the same root object
/**
* Represents an circle shape
*
* @namespace
* @typedef {Object} Circle
*/
export let Circle = (function() {
// constructor
let Circle = function(centerRaDec, radiusDegrees, options) {
/**
* Constructor function for creating a new circle.
*
* @constructor
* @memberof Circle
* @param {number[]} center - right-ascension/declination 2-tuple of the circle's center in degrees
* @param {number} radius - radius in degrees
* @param {ShapeOptions} options - Configuration options for the circle
*
* @returns {Circle} - The circle shape object
*/
let Circle = function(center, radius, options) {
options = options || {};
this.color = options['color'] || undefined;
@@ -47,8 +61,8 @@ export let Circle = (function() {
// TODO : all graphic overlays should have an id
this.id = 'circle-' + Utils.uuidv4();
this.setCenter(centerRaDec);
this.setRadius(radiusDegrees);
this.setCenter(center);
this.setRadius(radius);
this.overlay = null;
this.isShowing = true;

53
src/js/Ellipse.js
View File

@@ -31,10 +31,41 @@
import { Utils } from "./Utils";
import { Overlay } from "./Overlay.js";
// TODO : Ellipse, Circle and Footprint should inherit from the same root object
/**
* @typedef {Object} ShapeOptions
* @description Options for describing a shape
*
* @property {Object} options - Configuration options for the shape.
* @property {string} [options.color] - The color of the shape
* @property {string} [options.fill=false] - Fill the shape with fillColor
* @property {string} [options.fillColor] - A filling color for the shape
* @property {number} [options.lineWidth=2] - The line width in pixels
* @property {number} [options.opacity=1] - The opacity, between 0 (totally transparent) and 1 (totally opaque)
* @property {string} [options.selectionColor='#00ff00'] - A selection color
* @property {string} [options.hoverColor] - A hovered color
*/
/**
* Represents an ellipse shape
*
* @namespace
* @typedef {Object} Ellipse
*/
export let Ellipse = (function() {
// constructor
let Ellipse = function(centerRaDec, rayonXDegrees, rayonYDegrees, rotationDegrees, options) {
/**
* Constructor function for creating a new ellipse.
*
* @constructor
* @memberof Ellipse
* @param {number[]} center - right-ascension/declination 2-tuple of the ellipse's center in degrees
* @param {number} a - semi-major axis length in degrees
* @param {number} b - semi-minor axis length in degrees
* @param {number} theta - angle of the ellipse in degrees
* @param {ShapeOptions} options - Configuration options for the ellipse
*
* @returns {Ellipse} - The ellipse shape object
*/
let Ellipse = function(center, a, b, theta, options) {
options = options || {};
this.color = options['color'] || undefined;
@@ -42,13 +73,14 @@ export let Ellipse = (function() {
this.lineWidth = options["lineWidth"] || 2;
this.selectionColor = options["selectionColor"] || '#00ff00';
this.hoverColor = options["hoverColor"] || undefined;
this.opacity = options['opacity'] || 1;
// TODO : all graphic overlays should have an id
this.id = 'ellipse-' + Utils.uuidv4();
this.setCenter(centerRaDec);
this.setRadiuses(rayonXDegrees, rayonYDegrees);
this.setRotation(rotationDegrees);
this.setCenter(center);
this.setAxisLength(a, b);
this.setRotation(theta);
this.overlay = null;
this.isShowing = true;
@@ -185,9 +217,9 @@ export let Ellipse = (function() {
}
};
Ellipse.prototype.setRadiuses = function(radiusXDegrees, radiusYDegrees) {
this.a = radiusXDegrees;
this.b = radiusYDegrees;
Ellipse.prototype.setAxisLength = function(a, b) {
this.a = a;
this.b = b;
if (this.overlay) {
this.overlay.reportChange();
@@ -200,8 +232,6 @@ export let Ellipse = (function() {
// TODO
Ellipse.prototype.draw = function(ctx, view, noStroke) {
if (! this.isShowing) {
return;
}
@@ -297,6 +327,7 @@ export let Ellipse = (function() {
}
ctx.lineWidth = this.lineWidth;
ctx.globalAlpha = this.opacity;
ctx.beginPath();
ctx.ellipse(originScreen[0], originScreen[1], px_per_deg * this.a, px_per_deg * this.b, theta, 0, 2*Math.PI, false);

10
src/js/Footprint.js
View File

@@ -62,12 +62,10 @@ export let Footprint= (function() {
if (!s.color) {
s.setColor(catalog.color);
}
if (!s.selectionColor) {
s.setSelectionColor(catalog.selectionColor);
}
if (!s.hoverColor) {
s.setHoverColor(catalog.hoverColor);
}
// Selection and hover color are catalog options
s.setSelectionColor(catalog.selectionColor);
s.setHoverColor(catalog.hoverColor);
}
}
};

44
src/js/Line.js
View File

@@ -33,8 +33,28 @@ import { Polyline } from "./Polyline.js";
import { Utils } from './Utils';
import { Overlay } from "./Overlay.js";
/**
* Represents an line shape
*
* @namespace
* @typedef {Object} Line
*/
export let Line = (function() {
// constructor
/**
* Constructor function for creating a new line.
*
* @constructor
* @memberof Line
* @param {number} ra1 - Right Ascension (RA) coordinate of the center in degrees.
* @param {number} dec1 - Declination (Dec) coordinate of the center in degrees.
* @param {number} ra2 - Right Ascension (RA) coordinate of the center in degrees.
* @param {number} dec2 - Declination (Dec) coordinate of the center in degrees.
* @param {CooFrame} [frame] - Frame in which the coordinates are given. If none, the frame used is icrs/j2000.
* @param {ShapeOptions} options - Options for configuring the line. Additional properties:
* @param {boolean} [options.arrow=false] - Add an arrow pointing from (ra1, dec1) to (ra2, dec2)
*
* @returns {Line} - The line shape object
*/
let Line = function(ra1, dec1, ra2, dec2, frame, options) {
options = options || {};
this.color = options['color'] || undefined;
@@ -61,11 +81,6 @@ export let Line = (function() {
};
Line.prototype = {
setToPosition: function(ra2, dec2) {
this.ra2 = ra2;
this.dec2 = dec2;
},
setOverlay: Polyline.prototype.setOverlay,
isFootprint: Polyline.prototype.isFootprint,
show: Polyline.prototype.show,
@@ -105,20 +120,11 @@ export let Line = (function() {
return;
}
var baseColor = this.color;
if (!baseColor && this.overlay) {
baseColor = this.overlay.color;
}
if (!baseColor) {
baseColor = '#ff0000';
}
if (!this.lineWidth) {
this.lineWidth = this.overlay.lineWidth || 2;
}
let baseColor = this.color || (this.overlay && this.overlay.color) || '#ff0000';
let lineWidth = this.lineWidth || this.overlay.lineWidth || 3;
// too small
if ((xmax - xmin) < this.lineWidth || (ymax - ymin) < this.lineWidth) {
if ((xmax - xmin) < lineWidth || (ymax - ymin) < lineWidth) {
return;
}
@@ -130,7 +136,7 @@ export let Line = (function() {
ctx.strokeStyle = baseColor;
}
ctx.lineWidth = this.lineWidth;
ctx.lineWidth = lineWidth;
ctx.globalAlpha = this.opacity;
ctx.beginPath();

4
src/js/MOC.js
View File

@@ -37,12 +37,12 @@ import { ALEvent } from "./events/ALEvent.js";
* @typedef {Object} MOC
*/
export let MOC = (function() {
/**
/**
* Constructor function for creating a new catalog instance.
*
* @constructor
* @memberof MOC
* @param {MOCOptions} options - Configuration options for the MOC.
* @param {MOCOptions} options - Configuration options for the MOC.
*/
let MOC = function(options) {
//this.order = undefined;

24
src/js/Polyline.js
View File

@@ -38,6 +38,12 @@ import { Overlay } from "./Overlay.js";
import { ProjectionEnum } from "./ProjectionEnum.js";
/**
* Represents a polyline shape
*
* @namespace
* @typedef {Object} Polyline
*/
export let Polyline = (function() {
function _calculateMag2ForNoSinProjections(l, view) {
@@ -86,7 +92,17 @@ export let Polyline = (function() {
return false;
}*/
// constructor
/**
* Constructor function for creating a new polyline.
*
* @constructor
* @memberof Polyline
* @param {Array.<number[]>} radecArray - right-ascension/declination 2-tuple array describing the polyline's vertices in degrees
* @param {ShapeOptions} options - Configuration options for the polyline. Additional properties:
* @param {boolean} [options.closed=false] - Close the polyline, default to false.
*
* @returns {Polyline} - The polyline shape object
*/
let Polyline = function(radecArray, options) {
options = options || {};
this.color = options['color'] || undefined;
@@ -97,11 +113,7 @@ export let Polyline = (function() {
this.selectionColor = options["selectionColor"] || '#00ff00';
this.hoverColor = options["hoverColor"] || undefined;
if (options["closed"]) {
this.closed = options["closed"];
} else {
this.closed = false;
}
this.closed = (options["closed"] !== undefined) ? options["closed"] : false;
// All graphics overlay have an id
this.id = 'polyline-' + Utils.uuidv4();

10
src/js/View.js
View File

@@ -1302,6 +1302,16 @@ export let View = (function () {
}
}
// display grid labels
if (this.gridCfg.enabled && this.gridCfg.showLabels) {
if (!this.catalogCanvasCleared) {
ctx.clearRect(0, 0, this.width, this.height);
this.catalogCanvasCleared = true;
}
this.wasm.drawGridLabels();
}
if (this.mode === View.SELECT) {
this.selector.dispatch('draw')
}