PolyLine组件使用showDir=true后不显示方向

[hippowc]

使用PolyLine组件的showDir后为啥展示不出路径的方向 版本："@uiw/react-amap": "^4.5.2"

[hippowc]

why?

[jaywcjlove]

@hippowc 不知道，使用 CodeSanbox 将你的示例错误重现出来，我帮你看看

[hippowc]

相关代码：

import {
  Map,
  APILoader,
  ScaleControl,
  ToolBarControl,
  ControlBarControl,
  Geolocation,
  Polyline,
  Marker
} from "@uiw/react-amap";
import "./styles.css";

const testStyle = {
  showDir: true,
  strokeColor: "#3bcbb2",
  strokeWeight: 7,
  lineJoin: 'round',
  strokeOpacity: 1
}

const path = [[
  121.4559478760,
  31.3117923737
],
[
  121.45593,
  31.31182
],
[
  121.455926,
  31.311824
],
[
  121.455406,
  31.311754
],
[
  121.45516,
  31.313103
],
[
  121.454357,
  31.313572
],
[
  121.452895,
  31.313456
],
[
  121.452895,
  31.313456
],
[
  121.4528961182,
  31.3134555817
],
[
  121.4528961182,
  31.3134555817
]];

function Demo() {
  return (
    <div style={{ width: "100%", height: "300px" }}>
      <Map zoom={4} center={[121.4559478760,31.3117923737]}>
        <ScaleControl offset={[16, 30]} position="LB" />
        <ToolBarControl offset={[16, 10]} position="RB" />
        <ControlBarControl offset={[16, 180]} position="RB" />
        <Geolocation
          maximumAge={100000}
          borderRadius="5px"
          position="RB"
          offset={[16, 80]}
          zoomToAccuracy={true}
          showCircle={true}
        />
        <Polyline
          path={path}
          {...testStyle}
        />
        <Marker
          title="北京市"
          // offset={new AMap.Pixel(-13, -30)}
          label={{
            // 设置文本标注偏移量
            // offset: new AMap.Pixel(20, 20),
            // 设置文本标注内容
            // content: ,
            // 设置文本标注方位
            direction: "right"
          }}
          position={[121.4559478760, 31.3117923737]}
        >
          <div style={{ backgroundColor: "#333", width: 200, color: "white" }}>
            我是 marker 的 label 标签
          </div>
        </Marker>
      </Map>
      <Map>
        {({ AMap, map, container }) => {
          return;
        }}
      </Map>
    </div>
  );
}

export default function App() {
  return (
    <APILoader akay="a7a90e05a37d3f6bf76d4a9032fc9129">
      <Demo />
    </APILoader>
  );
}

[jaywcjlove]

没有重现你的问题

@hippowc https://codesandbox.io/embed/react-amap-example-react-18-https-github-com-uiwjs-react-amap-issues-296-zkqcqq?fontsize=14&hidenavigation=1&theme=dark

[hippowc]

我打开你这个链接看到的和你不一样，难道是浏览器的问题？我是chrome：版本 109.0.5414.119（正式版本） (x86_64)

[jaywcjlove]

你看一下官方示例，是否存在兼容问题

@hippowc