import { AsynchronousGeoJSONOverlay } from './asynchronous-geojson-overlay' ; import * as L from 'leaflet' ; /**
 * Shakemap contours overlay for leaflet map
 */ const ShakemapContoursOverlay = AsynchronousGeoJSONOverlay . extend ( { _count : 0 , id : 'shakemap-contour' , legends : [ ] , title : 'Shakemap Contour' , param product initialize : function ( product ) { AsynchronousGeoJSONOverlay . prototype . initialize . call ( this ) ; const contourLegend = document . createElement ( 'img' ) ; contourLegend . src = './assets/legend-intensity-contour.png' ; contourLegend . setAttribute ( 'alt' , 'Intensity Contour Legend' ) ; const intensityLegend = document . createElement ( 'img' ) ; intensityLegend . src = './assets/shakemap-intensity-legend-small.png' ; intensityLegend . setAttribute ( 'alt' , 'Intensity Scale legend' ) ; this . legends . push ( intensityLegend , contourLegend ) ; } , param feature createLabel : function ( feature ) { return '' ; } , param point1 param point2 getAngle : function ( point1 , point2 ) { const slope = ( point2 [ 1 ] - point1 [ 1 ] ) / ( point2 [ 0 ] - point1 [ 0 ] ) ; let angle = Math . round ( ( Math . atan ( slope ) / Math . PI ) * 180 ) ; if ( angle > 50 || angle < - 50 ) { angle = 0 ; } return angle ; } , param feature generatePopupContent : function ( feature ) { return this . createLabel ( feature ) ; } , param feature param layer { optional } onEachFeature : function ( feature , layer ) { if ( feature . properties && this . _count % 2 === 0 ) { const coordinates = feature . geometry . coordinates [ 0 ] ; const coordinateIdx = Math . round ( Math . random ( ) * ( coordinates . length - 2 ) ) ; const markerCoords = coordinates [ coordinateIdx ] ; const nextCoords = coordinates [ coordinateIdx + 1 ] ; const angle = this . getAngle ( markerCoords , nextCoords ) * - 1 ; const marker = L . marker ( [ markerCoords [ 1 ] , markerCoords [ 0 ] ] , { icon : L . divIcon ( { className : 'contour-overlay-label' , html : `<div
              class="content">
                <div
                style="transform: rotate(${ angle }deg)">
                  ${ this . createLabel ( feature ) }
                </div>
              </div>` , iconAnchor : [ 7 , 8 ] , iconSize : [ 14 , 10 ] } ) } ) ; this . addLayer ( marker ) ; } this . _count += 1 ; const popupContent = this . generatePopupContent ( feature ) ; layer . bindPopup ( popupContent ) ; } , param feature style : function ( feature ) { const color = feature . properties . color ? feature . properties . color : '#fff' ; const weight = feature . properties . weight ? feature . properties . weight : 4 ; const lineStyle = { color : color , opacity : 1 , weight : weight } ; return lineStyle ; } } ) ; export { ShakemapContoursOverlay } ;