TimelineHighlightRange.js 1.9 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667
  1. import defaultValue from "../../Core/defaultValue.js";
  2. import JulianDate from "../../Core/JulianDate.js";
  3. /**
  4. * @private
  5. */
  6. function TimelineHighlightRange(color, heightInPx, base) {
  7. this._color = color;
  8. this._height = heightInPx;
  9. this._base = defaultValue(base, 0);
  10. }
  11. TimelineHighlightRange.prototype.getHeight = function () {
  12. return this._height;
  13. };
  14. TimelineHighlightRange.prototype.getBase = function () {
  15. return this._base;
  16. };
  17. TimelineHighlightRange.prototype.getStartTime = function () {
  18. return this._start;
  19. };
  20. TimelineHighlightRange.prototype.getStopTime = function () {
  21. return this._stop;
  22. };
  23. TimelineHighlightRange.prototype.setRange = function (start, stop) {
  24. this._start = start;
  25. this._stop = stop;
  26. };
  27. TimelineHighlightRange.prototype.render = function (renderState) {
  28. let range = "";
  29. if (this._start && this._stop && this._color) {
  30. const highlightStart = JulianDate.secondsDifference(
  31. this._start,
  32. renderState.epochJulian
  33. );
  34. let highlightLeft = Math.round(
  35. renderState.timeBarWidth * renderState.getAlpha(highlightStart)
  36. );
  37. const highlightStop = JulianDate.secondsDifference(
  38. this._stop,
  39. renderState.epochJulian
  40. );
  41. let highlightWidth =
  42. Math.round(
  43. renderState.timeBarWidth * renderState.getAlpha(highlightStop)
  44. ) - highlightLeft;
  45. if (highlightLeft < 0) {
  46. highlightWidth += highlightLeft;
  47. highlightLeft = 0;
  48. }
  49. if (highlightLeft + highlightWidth > renderState.timeBarWidth) {
  50. highlightWidth = renderState.timeBarWidth - highlightLeft;
  51. }
  52. if (highlightWidth > 0) {
  53. range = `<span class="cesium-timeline-highlight" style="left: ${highlightLeft.toString()}px; width: ${highlightWidth.toString()}px; bottom: ${this._base.toString()}px; height: ${
  54. this._height
  55. }px; background-color: ${this._color};"></span>`;
  56. }
  57. }
  58. return range;
  59. };
  60. export default TimelineHighlightRange;