d3 typescript 地理路径这

Question

I have a geometric transformation function in my React typescript app that looks like below.

        // Use Leaflet to implement a D3 geometric transformation.
        const projectPoint = ( x: any, y: any) => {
          const point = map.latLngToLayerPoint(new L.LatLng(y, x));
          this.stream.point(point.x, point.y);
        }

However I get an error "Object is possibly 'undefined'.ts(2532)" for this . So I looked at doing an If statement to check if it is undefined (see below) but that doesn't work

        const projectPoint = ( x: any, y: any) => {
          const point = map.latLngToLayerPoint(new L.LatLng(y, x));
          if (this != undefined) {
           this.stream.point(point.x, point.y);
          } else {
            return null
          }
        }   

And even tried below..

        const projectPoint = ( x: any, y: any) => {
          const point = map.latLngToLayerPoint(new L.LatLng(y, x));
           this!.stream.point(point.x, point.y);
        }

But i get the error that Property 'stream' does not exist on type 'never'. Thanks for the help!

Answer 1

I found the problem was unrelated to "this" (pardon the pun). Though I have incorrectly written this projectPoint function. The correct function should declare this with this: any as follows.

        // Use Leaflet to implement a D3 geometric transformation.
        const projectPoint = ( this:any, x: any, y: any) => {
          const point = map.latLngToLayerPoint(new L.LatLng(y, x));
          this.stream.point(point.x, point.y);
        }

What would be a better type than "any" for "this" that I could use out of interest?