Open FEJackFly opened 3 years ago
macos chrome 90.0.4430.212 分辨率 1920*1080
<script> var map = new maptalks.Map("map", { center: [117.76718795646154, 39.012899563559685], zoom: 18, // spatialReference: { // projection: "identity", // }, }); const layer = new maptalks.Geo3DTilesLayer("3dtiles", { maxCacheSize: 1000, //缓存的最大瓦片数 // loadingLimitOnInteracting : 1, //地图交互过程中瓦片请求最大数量 // loadingLimit : 0, //瓦片请求最大数量 services: [ { url: "./Production_1.json", maximumScreenSpaceError: 1.0, // urlParams : 'v=0.0', // ajaxOptions : { credentials : 'include' }, // 把模型降低1200米 heightOffset: 1000, ambientLight: [0.0, 0.0, 0.0], // maxExtent : maxExtent // ajaxInMainThread : true, //从主线程发起ajax请求,用于worker发起ajax报跨域错误 }, // 其他的3dtiles数据源 ], }); console.log(layer); layer.addTo(map); // 车道线图层 const mapLineLayer = new maptalks.VectorLayer("mapLine", { zIndex: 1, }); mapLineLayer.addTo(map); axios .get("./json/mapc.json") .then(function (response) { console.log(response); const geojson = response.data; //动态线 geojson.features.forEach((item) => { if (item.geometry.type === "LineString") { let line = new maptalks.LineString(item.geometry.coordinates, { symbol: { lineColor: "red", lineWidth: 1, }, }); line.addTo(mapLineLayer); } else if (item.geometry.type === "MultiLineString") { let MultiLineString = new maptalks.MultiLineString( item.geometry.coordinates, { symbol: { lineColor: "red", lineWidth: 1, }, } ); MultiLineString.addTo(mapLineLayer); } // else if (item.geometry.type == "Polygon") { // let color = "#d2dce6"; // let colorObj = { // white: { // Arrow: "blue", // yard: "#d2dce6", // }, // black: { // Arrow: "blue", // yard: "#3c3e46", // }, // }; // const theme = localStorage.theme || "black"; // if (item.properties.type == "Arrow") { // color = colorObj[theme].Arrow; // } else { // color = colorObj[theme].yard; // } // var polygon = new maptalks.Polygon(item.geometry.coordinates, { // visible: true, // editable: true, // cursor: "pointer", // shadowBlur: 0, // shadowColor: "black", // draggable: false, // dragShadow: false, // display a shadow during dragging // drawOnAxis: null, // force dragging stick on a axis, can be: x, y // symbol: { // lineWidth: 0, // polygonFill: color, // polygonOpacity: 1, // }, // }).addTo(mapLineLayer); // } else if (item.geometry.type == "Point") { // if (item.properties.text) { // var point = new maptalks.Marker(item.geometry.coordinates, { // visible: true, // editable: true, // cursor: "pointer", // shadowBlur: 0, // shadowColor: "black", // draggable: false, // dragShadow: false, // display a shadow during dragging // drawOnAxis: null, // force dragging stick on a axis, can be: x, y // symbol: { // textFaceName: "sans-serif", // textName: item.properties.text, // textFill: "#5678f3", // textHorizontalAlignment: "center", // textSize: 12, // }, // }).addTo(mapLineLayer); // } // } }); }) .catch(function (error) { console.log(error); }); </script>
开发环境
macos chrome 90.0.4430.212 分辨率 1920*1080
代码示例