WME Google Traffic Layer

Adds Google Maps traffic layer as an overlay to the Waze Map Editor
目前為 2023-06-27 提交的版本，檢視最新版本。
安裝腳本 ?
Wrap lines
// ==UserScript==
// @name         WME Google Traffic Layer
// @namespace    https://fxzfun.com/waze
// @version      1.0
// @description  Adds Google Maps traffic layer as an overlay to the Waze Map Editor
// @author       FXZFun
// @match        https://*.waze.com/*/editor*
// @match        https://*.waze.com/editor*
// @exclude      https://*.waze.com/user/editor*
// @grant        none
// @require      https://gf.qytechs.cn/scripts/24851-wazewrap/code/WazeWrap.js
// @license      MIT
// ==/UserScript==

/* global W, OpenLayers, google, WazeWrap */

(function() {
    'use strict';

    // Callback function to initialize traffic layer
    function initTrafficLayer() {
        // Create a new TrafficLayer instance
        var trafficLayer = new google.maps.TrafficLayer();

        var trafficDiv = document.createElement('div');
        trafficDiv.style.position = 'absolute';
        trafficDiv.style.top = '0';
        trafficDiv.style.left = '0';
        trafficDiv.style.right = '0';
        trafficDiv.style.bottom = '0';
        W.map.olMap.getViewport().appendChild(trafficDiv);

        var lonlat = new OpenLayers.LonLat(W.map.getCenter().lon, W.map.getCenter().lat);
        lonlat.transform(new OpenLayers.Projection ('EPSG:900913'), new OpenLayers.Projection('EPSG:4326'));

        var gmap = new google.maps.Map(trafficDiv, {
            zoom: W.map.getZoom(),
            center: { lat: lonlat.lat, lng: lonlat.lon },
            disableDefaultUI: true,
            zoomControl: true,
            styles: [
                { elementType: 'labels', stylers: [{ visibility: 'off' }] },
                { featureType: 'administrative', stylers: [{ visibility: 'off' }] },
                { featureType: 'administrative', elementType: 'geometry', stylers: [{ visibility: 'off' }] },
                { featureType: 'administrative.land_parcel', stylers: [{ visibility: 'off' }] },
                { featureType: 'administrative.neighborhood', stylers: [{ visibility: 'off' }] },
                { featureType: 'landscape', stylers: [{ visibility: 'off' }] },
                { featureType: 'poi', stylers: [{ visibility: 'off' }] },
                { featureType: 'road', elementType: 'labels', stylers: [{ visibility: 'off' }] },
                { featureType: 'road', elementType: 'labels.icon', stylers: [{ visibility: 'off' }] },
                { featureType: 'transit', stylers: [{ visibility: 'off' }] },
                { featureType: 'water', stylers: [{ visibility: 'off' }] }
            ]
        });

        // Show the traffic layer
        trafficLayer.setMap(gmap);
        trafficDiv.firstElementChild.style.backgroundColor = 'rgb(229 227 223 / 0%)';
        trafficDiv.style.pointerEvents = 'none';

        WazeWrap.Events.register('moveend', null, function() {
            var lonlat = new OpenLayers.LonLat(W.map.getCenter().lon, W.map.getCenter().lat);
            lonlat.transform(new OpenLayers.Projection ('EPSG:900913'), new OpenLayers.Projection('EPSG:4326'));
            gmap.panTo({ lat: lonlat.lat, lng: lonlat.lon });
        });

        WazeWrap.Events.register('zoomend', null, function() {
            gmap.setZoom(W.map.getZoom());
        });
    }

    if (W && W.userscripts && W.userscripts.state && W.userscripts.state.isReady) {
        initTrafficLayer();
    } else {
        document.addEventListener('wme-ready', initTrafficLayer, { once: true });
    }
})();
欢迎访问Greasy Fork镜像
