Linking video control with mapbox in javascript language
$8-15 USD / hour
Cerrado
Publicado hace casi 4 años
$8-15 USD / hour
I am developing a video tracking platform on mapbox using video's gpx data.
I want the marker should change the lat long as per c1 and c2 changes.
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title>CodePen - HTML5 Video -interactive transcript-</title>
<link rel="stylesheet" href="./[login to view URL]">
</head>
<body>
<!-- partial:[login to view URL] -->
<div class="video-container">
<video id="myVideo" poster="[login to view URL]" width="640" height="368" controls>
<source src="[login to view URL]" type="video/mp4">
<source src="[login to view URL]" type="video/webm">
<source src="[login to view URL]" type="video/ogg">
<track src="[login to view URL]">
Your browser does not support the <code>video</code> element.
<!--Flash Fallback
<object width="640" height="368" type="application/x-shockwave-flash" data="[login to view URL]">
<param name="movie" value="[login to view URL]">
<param name="flashvars" value="controlbar=over&image=posterimage.jpg&file=[login to view URL]">
</object>-->
</video>
</div>
<!--eo-videocontainer-->
<div id="speaking" aria-live="rude">
</div>
**<div id="transcriptContainer">
<div id="transcriptText">
<p id="c1" class="cue" data-time="0.0" aria-live="rude" tabindex="1">
Mine & Tolga Wedding First Dance 13.12.2014
</p>
<p id="c2" class="cue" data-time="1.0" tabindex="1">
Fly me to the moon
<p id="c3" class="cue" data-time="2.0" tabindex="1">
And let me play among the stars
</p>
<p id="c4" class="cue" data-time="3.0" tabindex="1">
Let me see what spring is like
</p>
<p id="c5" class="cue" data-time="4.0" tabindex="1">
On Jupiter and Mars
</p>
<p id="c6" class="cue" data-time="5.0" aria-live="rude"tabindex="1">
In other words hold my hand
</p>
<p id="c7" class="cue" data-time="6.0" tabindex="1">
In other words baby kiss me
</p>
<p id="c8" class="cue" data-time="35.0" tabindex="1">
Fill my life with song
<p id="c9" class="cue" data-time="38.0" tabindex="1">
And let me sing forevermore
</p>
<p id="c10" class="cue" data-time="44.0" tabindex="1">
You are all I hope for
</p>
<p id="c11" class="cue" data-time="47.0" tabindex="1">
All I worship and adore
</p>
<p id="c12" class="cue" data-time="52.0" aria-live="rude"tabindex="1">
In other words please be true
</p>
<p id="c13" class="cue" data-time="60.0" tabindex="1">
In other words I love you
</p>
<p id="c14" class="cue" data-time="10.0" tabindex="1">
You are all I hope for
</p>
</div><!--eo-transcripttext-->
</div><!--eo-transcriptcontainer--> **
<div class="clear"></div>
<!-- partial -->
<meta charset="utf-8" />
<title>Add a default marker</title>
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
<script src="[login to view URL]"></script>
<link href="[login to view URL]" rel="stylesheet" />
<style>
body { margin: 0; padding: 0; }
#map { position: absolute; top: 0; bottom: 0; width: 30%;left:70%; }
</style>
</head>
<body>
<div id="map"></div>
<script>
[login to view URL] = 'pk.eyJ1IjoiZHVyZ2VzaDEyM3NkZWZncmJlbmciLCJhIjoiY2pnMWptY2JjMTQwcjJ3bnhwbTVkMHd6dSJ9.drdX9xK-516hfpv_UxZc_w';
var map = new [login to view URL]({
container: 'map',
style: 'mapbox://styles/mapbox/streets-v11',
center: [12.550343, 55.665957],
zoom: 8
});
** var marker = new [login to view URL]()
.setLngLat([12.550343, 55.665957])
.addTo(map); **
</script>
<script src="./[login to view URL]"></script>
</body>
</html>
Hello. How are you?
I have been working with php google map api for many years.
I read your description carefully and understand your requirements fully.
The nice and familiar interface will greatly make you happy and I hope a long-term relationship with you
Best Regards.
Respected client,
I was understand what do you want you can see my skills in my portfolio .I assure you that i will fulfil with your requirement
i am student of BS Software Enger.
i also build many website using Bootstrap, HTML,HTML5,CSS,CSS3,PHP& JavaScript.I also display demo of my portfolio.
Hi how are you? im javascript & jqeury master for many years, and familiar with the video control in node now.
I can resolve your project issue within 30 minutes, and ready to start work right now.
Please contact me to discuss in more details. Best regards.