Javascript: вычислить фактический размер видео, учитывая родительский размер и собственную ширину / высоту видео - PullRequest
0 голосов
/ 01 октября 2019

У меня есть элемент video, который необходимо визуализировать поверх некоторых других элементов (аналогично тому, как YouTube использовал «горячие точки» над областями видео). Сам элемент video имеет динамический размер (поэтому он сохраняет свое соотношение сторон), поэтому я не знаю размеров, в которых видео фактически отображается. У меня есть собственные размеры видео, а также размер элемента обтекания. Учитывая это, как я могу определить размер отрендеренного видео?

<!-- I know 'some-file' is 1920x1080 -->
<!-- I know `.parent` is some size (1340 x 440, for example) -->

<div className="parent">
  <video width="100%" height="100%">
    <!-- video renders at some other size -->
    <source src="some-file.mp4" type="video/mp4" />
  </video>
  <canvas className="my-overlay" />
</div>
...