Vorschaubilder Leider wartet diese Seite auf die Übersetzung ins Deutsche Preview thumbnails are displayed when you hover over the timeline. How to setup:
1. CollectionsUsually, the collection of thumbnails is a JPEG file with stitched together images 160x90 example from Youtube: Bonding thumbnails allows you to save resources on requests to the server, but this is not necessary - you can store all frames in separate files. You can also use single frame mp4 instead of jpg. 2. LayoutTime layout is in WebVTT format. Create a text file with any extension (for example, txt) WEBVTT 00:02.000 --> 00:05.873 //site.com/collection1.jpg#xywh=0,0,160,90 00:05.874 --> 00:07.362 //site.com/collection1.jpg#xywh=160,0,160,90 00:07.363 --> 00:10.399 //site.com/collection1.jpg#xywh=320,0,160,90 Time is specified in HH:MM:SS:MSEC (hours:minutes:seconds.milliseconds). You can remove hours at the beginning for short videos as in the example. Below is a collection URL with the coordinates and size (x, y, width, height) of the each thumbnail. The example above shows the first three frames of the first row of collection. 3. How to connect to the playerEnable thumbnails in the builder var player = new Playerjs({"thumbnails":"//site.com/thumbnails.txt" To load text files from the other domains, please consider cross-domain restrictions. How often do thumbnailsIt depends on the length of the video.
StylesYou can configure thumbnail styles in the builder. But if you need direct access via CSS, then from version 12.12 you can get it by id pjs_thumbnail_[id] [id] - this is the id of the player container. Let's say the player is located in the player container, then the thumbnail block id will be called pjs_thumbnail_player (the img tag with the image is located inside this block). Creating a collection of frames using FFmpegA typical FFmpeg request for creating a collection of pictures from MP4 ffmpeg -i "input.mp4" -vsync vfr -vf "select=isnan(prev_selected_t)+gte(t-prev_selected_t\,5),scale=160:90,tile=5x5" -qscale:v 3 "output%03d.jpg"
Try this PHP script for creating images and a markup file. PHPTested with FFmpeg 4.0 This is an example script that creates frame thumbnails from a video and generates a markup file. It requires the FFmpeg and FFprobe libraries (you need to setup the paths to binary files if they are not installed). Other configured parameters:
To start you need to specify two variables - file (video) and output (markup, which will be generated in the end) thumbnails.php?file=video.mp4&output=video.vtt The script will create collections of images at the desired interval and generate a markup file in WebVTT format. |