...

MyObsidianVault/Knowledgebase/WebDev/Verleih/TomTom/Docs/TomTom Login.md

@@ -0,0 +1,4 @@
+developer.tomtom.com
+tschneider
+Supertomtom1!
+

MyObsidianVault/Knowledgebase/WebDev/Verleih/TomTom/Location.md

@@ -0,0 +1,44 @@
+```php
+<!-- test1.php -->
+
+<?php
+
+//The URL with parameters / query string.
+// Escape: $str = preg_replace('/[^a-z\d ]/i', '', $str);
+
+$url='https://api.tomtom.com/search/2/search/Am%20Kapellchen%2021%2C%2041470%20Neuss.json?lat=37.337&lon=-121.89&minFuzzyLevel=1&maxFuzzyLevel=2&view=Unified&relatedPois=off&key=xcA6NjLwDPmayP6y56AoVoloz1iohbUV';
+
+//we use file_get_contents to GET the URL in question.
+$contents = file_get_contents($url);
+
+$result = json_decode($contents);
+$lat = $result->results[0]->position->lat;
+$lon = $result->results[0]->position->lon;
+
+echo "Lat=" . $lat . ", Lon=" . $lon;
+
+```
+
+````php
+<?php
+
+//The URL with parameters / query string.
+
+$url='https://api.tomtom.com/search/2/search/Am%20Kapellchen%2021%2C%2041470%20Neuss.json?lat=37.337&lon=-121.89&minFuzzyLevel=1&maxFuzzyLevel=2&view=Unified&relatedPois=off&key=xcA6NjLwDPmayP6y56AoVoloz1iohbUV';
+
+//we use file_get_contents to GET the URL in question.
+$contents = file_get_contents($url);
+
+//If $contents is not a boolean FALSE value.
+if($contents !== false){
+	//Print out the contents.
+	echo $contents;
+}
+```
+
+````
+
+
+
+
+

MyObsidianVault/Knowledgebase/WebDev/Verleih/TomTom/Testkarte anzeigen.md

@@ -0,0 +1,146 @@
+````php
+<!DOCTYPE html>
+
+<html class='use-all-space'>
+<head>
+<meta http-equiv='X-UA-Compatible' content='IE=Edge' />
+<meta charset='UTF-8'>
+<title>Maps SDK for Web - Static route</title>
+
+<meta name='viewport'
+content='width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no'/>
+
+<link rel='stylesheet' type='text/css' href='https://api.tomtom.com/maps-sdk-for-web/cdn/6.x/6.20.0/maps/maps.css'>
+
+<link rel='stylesheet' type='text/css' href='../test/assets/ui-library/icons-css/routing.css'/>
+
+<link rel='stylesheet' type='text/css' href='../test/assets/ui-library/index.css'/>
+
+</head>
+
+<style>
+.icon {
+background-size: cover;
+height: 30px;
+width: 30px;
+}
+
+.route-marker {
+align-items: center;
+background-color: #4a90e2;
+border: solid 3px #2faaff;
+border-radius: 50%;
+display: flex;
+height: 32px;
+justify-content: center;
+transition: width .1s, height .1s;
+width: 32px;
+}
+
+</style>
+
+<body>
+<div><h1>TEST KARTE</<h1></div>
+<div style="height: 90%" id='map' class='map'></div>
+<script src='https://api.tomtom.com/maps-sdk-for-web/cdn/6.x/6.20.0/maps/maps-web.min.js'></script>
+
+<script src='https://api.tomtom.com/maps-sdk-for-web/cdn/6.x/6.20.0/services/services-web.min.js'></script>
+
+<script type='text/javascript' src='../test/assets/js/mobile-or-tablet.js'></script>
+
+<script>
+var map = tt.map({
+key: 'xcA6NjLwDPmayP6y56AoVoloz1iohbUV',
+container: 'map',
+//dragPan: !isMobileOrTablet()
+dragPan: false
+});
+
+map.scrollZoom.disable()
+//map.addControl(new tt.FullscreenControl());
+//map.addControl(new tt.NavigationControl());
+
+  
+
+function createMarkerElement(type) {
+var element = document.createElement('div');
+var innerElement = document.createElement('div');
+
+  
+
+element.className = 'route-marker';
+innerElement.className = 'icon tt-icon -white -' + type;
+element.appendChild(innerElement);
+return element;
+
+}
+
+  
+
+function addMarkers(feature) {
+
+var startPoint, endPoint;
+if (feature.geometry.type === 'MultiLineString') {
+startPoint = feature.geometry.coordinates[0][0]; //get first point from first line
+endPoint = feature.geometry.coordinates.slice(-1)[0].slice(-1)[0]; //get last point from last line
+} else {
+startPoint = feature.geometry.coordinates[0];
+endPoint = feature.geometry.coordinates.slice(-1)[0];
+}
+
+
+new tt.Marker({ element: createMarkerElement('start') }).setLngLat(startPoint).addTo(map);
+
+new tt.Marker({ element: createMarkerElement('finish') }).setLngLat(endPoint).addTo(map);
+
+}
+
+function findFirstBuildingLayerId() {
+var layers = map.getStyle().layers;
+for (var index in layers) {
+if (layers[index].type === 'fill-extrusion') {
+return layers[index].id;
+}
+}
+
+throw new Error('Map style does not contain any layer with fill-extrusion type.');
+}
+
+map.once('load', function() {
+tt.services.calculateRoute({
+key: 'xcA6NjLwDPmayP6y56AoVoloz1iohbUV',
+traffic: false,
+locations: '4.8786,52.3679:4.8798,52.3679'
+})
+.then(function(response) {
+var geojson = response.toGeoJson();
+map.addLayer({
+'id': 'route',
+'type': 'line',
+'source': {
+'type': 'geojson',
+'data': geojson
+},
+
+'paint': {
+'line-color': '#4a90e2',
+'line-width': 8
+}
+}, findFirstBuildingLayerId());
+  
+addMarkers(geojson.features[0]);
+  
+var bounds = new tt.LngLatBounds();
+geojson.features[0].geometry.coordinates.forEach(function(point) {
+bounds.extend(tt.LngLat.convert(point));
+
+});
+
+map.fitBounds(bounds, { duration: 0, padding: 50 });
+});
+});
+
+</script>
+</body>
+</html>
+```