-
Notifications
You must be signed in to change notification settings - Fork 97
Open
Description

在react使用bmap渲染轨迹的时候,本地调用只显示收尾两个点和轨迹线,而且不管多少个点位都能进行正常的轨迹渲染(如图一),但是部署到服务器端上后,轨迹渲染收尾两个点样式不一样了,而且中间会多出来许多经停点(如图二),且轨迹点多于20个左右的时候,就无法绘制出轨迹了(如图三),其中图一与图三的数据一致,图二是图一数据的前一部分。请问这是什么原因呢?
`
drawWay = (latlng: any[]) => {
const { BMap, map } = this.props;
var driving = new BMap.DrivingRoute(map, {
renderOptions: { map: map, autoViewport: true },
});
map.clearOverlays();
if (latlng.length >= 2) {
var p1 = new BMap.Point(latlng[0]["lng"], latlng[0]["lat"]);
var p2 = new BMap.Point(
latlng[latlng.length - 1]["lng"],
latlng[latlng.length - 1]["lat"]
);
var way = [];
for (var i = 1; i < latlng.length - 1; i++) {
way.push(new BMap.Point(latlng[i]["lng"], latlng[i]["lat"]));
}
var opts = {
position: p2, // 指定文本标注所在的地理位置
offset: new BMap.Size(0, 10) //设置文本偏移量
}
var opts1 = {
position: p1, // 指定文本标注所在的地理位置
offset: new BMap.Size(10, 0) //设置文本偏移量
}
var label1 = new BMap.Label(`运输开始时间:${latlng[0]["ctime"]}`, opts1); // 创建文本标注对象
var label = new BMap.Label(`运输完成时间:${latlng[latlng.length - 1]["ctime"]}`, opts); // 创建文本标注对象
label.setStyle({
color: "#333",
fontSize: "12px",
lineHeight: "20px",
fontFamily: "微软雅黑",
backgroundColor: '#f6f6f6',
borderColor: '#222'
});
label1.setStyle({
color: "#333",
fontSize: "12px",
lineHeight: "20px",
fontFamily: "微软雅黑",
backgroundColor: '#f6f6f6',
borderColor: '#222'
});
map.addOverlay(label1)
map.addOverlay(label)
var myIcon = new BMap.Icon("http://api.map.baidu.com/img/markers.png", new BMap.Size(23, 25), {
offset: new BMap.Size(10, 25), // 指定定位位置
imageOffset: new BMap.Size(0, 0 - 10 * 25) // 设置图片偏移
});
var marker = new BMap.Marker([p2, p1], { icon: myIcon });
map.removeOverlay();
map.addOverlay(marker)
driving.search(p1, p2, { waypoints: way });
this.setState({ externalData: false });
}
this.props.onRef(this);
};
`
Metadata
Metadata
Assignees
Labels
No labels