TimelineHighlightRange.js 1.9 KB

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