我想使用vue3和esri-loader制作一个地图网站。
使用 vue-composition-api 时,我将 esri-loader 生成的 Map 和 MapView 对象放入响应式并导出它们。但是在读取MapView的属性时发生了以下情况,让我不知所措。
代理上的“get”:属性 __accessor__ 是代理目标上的只读且不可配置的数据属性,但代理未返回其实际值
我正在使用 ArcGIS API for JavaScript 来显示地图,并且希望在有人单击地图时获取所选要素。这是我的MapComponent
export const MapComponent = () => {
const elementRef = useRef(null);
const [view, setView] = useState<MapView>();
const [selected, setSelected] = useState<Feature>();
const handleClick = useCallback((e: any) => {
if (!view) return;
view.hitTest(e)
.then(res => {
if (res.results.length > 0) {
const feature = res.results[0];
if (feature.type === 'graphic') {
setSelected(feature.graphic.attributes)
}
}
})
}, [view]);
useEffect(() => {
if (!view) return;
const handle = view.on('click', handleClick)
return handle && handle.remove();
}, [view]);
useEffect(() …Run Code Online (Sandbox Code Playgroud) 我正在使用Arcgis Javascript API.API基于dojo工具包构建.所以我需要在API中使用dojo功能.我正在准备dojo配置文件如下.
var pathRegex = new RegExp("/\/[^\/]+$/");
var locationPath = location.pathname.replace(pathRegex, '');
var dojoConfig = {
async: true,
parseOnLoad: false,
baseUrl:"js/",
packages: [
{
name: "application",
location: locationPath + '/js/application'
}]
};
Run Code Online (Sandbox Code Playgroud)
我创建了一个bootstrapper.js,如下所示.
require(["application/main", "dojo/domReady!"], function (application) {
console.log("bootstrapper is running");
application.Run();
})
Run Code Online (Sandbox Code Playgroud)
而index.html文件是这样的.
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Arcgis Javacsript API Samples</title>
<link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/js/dojo/dijit/themes/claro/claro.css">
<link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/js/esri/css/esri.css">
</head>
<body class="claro">
<div id="map"></div>
<script src="//js.arcgis.com/3.6/"></script>
<script src="js/application/djConfig.js"></script>
<script src="js/application/bootstrapper.js"></script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
我的应用程序托管在IIS上,并且有像这样的地址:htp://domain/Demo/Sample1/index.html
当我运行应用程序时,此代码给出如下错误.
"NetworkError:404 Not Found - http://js.arcgis.com/3.6/js/dojo/application/main.js …
尝试连接到示例休息服务时,我收到以下错误,前提是Arcgis Javascript API文档.
No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://bcgphp' is therefore not allowed access.
Run Code Online (Sandbox Code Playgroud)
在dojo文档之后,我按照以下方式设置了我的dojo/store.
var jsonStore = new JsonRest({
target: "//sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Census_USA/MapServer/"
});
jsonStore.get(5);
Run Code Online (Sandbox Code Playgroud)
我也尝试过每个dojo 文档传入一些标题,它返回与上面代码相同的错误.
var jsonStore = new JsonRest({
target: "//sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Census_USA/MapServer/",
headers: {'X-Requested-With': 'XMLHttpRequest'}
});
jsonStore.get(5);
Run Code Online (Sandbox Code Playgroud)
当我使用Arcgis Javascript查询时,我能够使用此演示中提供的以下代码发出此请求这不会导致任何跨域问题.
var queryTask = new QueryTask("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Census_USA/MapServer/5");
var query = new Query();
query.returnGeometry = false;
query.outFields = [
"SQMI", "STATE_NAME", "STATE_FIPS", "SUB_REGION", "STATE_ABBR",
"POP2000", "POP2007", "POP00_SQMI", "POP07_SQMI", "HOUSEHOLDS",
"MALES", "FEMALES", …Run Code Online (Sandbox Code Playgroud) 我正在使用 ARCGIS Javascript API 并尝试覆盖形状顶点的默认右键单击行为。
在 ESRI 的帮助中,它确实列出了 onVertexClick 事件,但是从这里看来,似乎无法确定这是右击还是左击事件,因此我无法仅覆盖右击。 https://developers.arcgis.com/javascript/jsapi/edit.html
我正在尝试将右键单击行为设置为仅删除当前节点/顶点,而不是显示带有删除选项的菜单。
编辑这是存在于 ARCGIS api 中的当前事件。
this.eventsList.push(dojo.connect(this._editToolbar, 'onVertexClick', $.proxy(this.addCustomVertexClickEvent, this)));
此事件已在 api 中,但是它不会返回任何方式让我确定左/右键单击。
您的评论“侦听单击事件然后测试 MouseEvent 对象的按钮属性”会起作用,但是我实际上无法将单击事件直接添加到顶点,因为这些在 ARCGIS api 代码中。
我正在Angular应用程序内使用Esri映射,并且将弹出式窗口渲染为Angular组件,并使用PopupTemplate的content方法发布了数据:
layer.popupTemplate = new PopupTemplate({
content: (feature: { graphic: __esri.Graphic }) => {
this.publishPopupData(layer, feature.graphic.attributes);
return popupComponent.viewContainerRef.element.nativeElement;
},
// other properties...
});
Run Code Online (Sandbox Code Playgroud)
这很好用,除非在给定点有多个要素。当用户循环浏览功能时,如果他/她返回到已经显示的功能,则不会执行content方法,因此不会发布弹出数据。
我可以在MapView的弹出窗口中访问当前选择的功能,但是我需要知道该功能来自哪一层才能正确发布数据(每一层对将ArcGIS数据处理到弹出窗口所使用的模型中都有独特的要求) 。
mapView.popup.watch('selectedFeature', (graphic: __esri.Graphic) => {
const layer = ???;
this.publishPopupData(layer, graphic.attributes);
});
Run Code Online (Sandbox Code Playgroud)
名义上,graphic.layer应该包含图层参考,但就我而言,它始终是null。
有没有一种方法可以强制弹出窗口始终调用content方法,即使该方法已经针对给定功能执行了呢?或者,是否有办法获取要素所属的图层MapView.popup(或我未考虑的其他内容)?
如果重要的话,弹出窗口用于MapImageLayer子层。
使用JS ArcGis API时,是否可以在lat中创建一个点,并且像这样长
var testPoint = new Point(-98, 38);
Run Code Online (Sandbox Code Playgroud)
或这个
var testPoint = new Point(-98, 38, new SpatialReference({ wkid: 4326 }));
Run Code Online (Sandbox Code Playgroud)
并将其转换为不同的SR,以便其x和y自动更改?例如,wkid 102000/3857?
背景:(也许你可以找到一个解决方法)
我正在使用heatmap.js在ArcGis地图上绘制heatmapLayers.我找到了一些示例,这个API提取数据的方式是使用data以下格式的变量:
var data = [
{
attributes: {},
geometry: {
spatialReference: { wkid: ****},
type: "point",
x: -40,
y: 50
}
},
{another point....}
];
Run Code Online (Sandbox Code Playgroud)
API本身对data变量进行一些解析,然后使用此方法
screenGeometry = esri.geometry.toScreenGeometry(this._map.extent, this._map.width, this._map.height, parsedData.data[xParsed][yParsed].dataPoint);
Run Code Online (Sandbox Code Playgroud)
parsedData.data[xParsed][yParsed].dataPoint在最终绘制热图之前转换解析的point().
主要的问题是无论我传递到什么wkid(之前的代码中的****),它都将它解释为wkid:102000,这就是我之前想要自己进行坐标转换的原因.
我想esri.geometry.toScreenGeometry实际进行转换应该是任务,但正如我所说,它忽略了wkid.
先谢谢,
我正在使用 RStudio 创建一个 choropleth 传单地图。我将 Country 和 Url 作为我导入到 R 的 shapefile 中的一个属性。
我希望在最终地图的弹出窗口中将国家名称和 URL 显示为超链接。
以下是我到目前为止使用的代码:
m <- world_shapefiles %>%
leaflet() %>%
addProviderTiles(providers$Esri.WorldStreetMap) %>%
addPolygons(
label=~country,
labelOptions = labelOptions(style = list("font-weight" = "normal", padding = "3px 8px", textsize = "15px",
direction = "auto")),
popup = ~ paste("Country:", country, "<br/>","<b/>","URL:", url)
)
Run Code Online (Sandbox Code Playgroud)
我想在弹出窗口中看到文本“单击此处”而不是整个 url,我尝试使用下面的代码但没有成功。
popup = ~ paste("Country:", counry, "<br/>","<b/>","URL:", "<b><a href=url>Click Here</a></b>")
Run Code Online (Sandbox Code Playgroud)
任何想法来实现它?
我正在使用arcgis javascript apis 3.5,我的代码是
function init() {
map = new esri.Map("mapDiv", {
basemap: "streets",
center: [-112.07102547942392, 46.75909704205151],
zoom: 12,
slider: false
});
var featureLayer = new esri.layers.FeatureLayer("http://abc/arcgis/rest/services/MTARNG/MapServer/0", {
mode: esri.layers.FeatureLayer.MODE_SNAPSHOT,
outFields: ["*"]
});
Run Code Online (Sandbox Code Playgroud)
而在这一层搜索我正在使用findtask.代码在这里
findTask = new esri.tasks.FindTask("http://abc/arcgis/rest/services/MTARNG/MapServer");
findParams = new esri.tasks.FindParameters();
findParams.returnGeometry = true;
findParams.layerIds = [0];
findParams.searchFields = ["LOCATION", "PROJECT_PARCEL_NAME"];
findParams.searchText = "north portion";
findTask.execute(findParams, showResults);
function showResults(results) {
var markerSymbol = new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_SQUARE, 10, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([255, 0, 0]), 1), new dojo.Color([0, 255, 0, 0.25]));
map.graphics.clear(); …Run Code Online (Sandbox Code Playgroud) 我正在尝试使用Leaflet JavaScript库创建一个自定义的固定地图,并继续遇到一个主要问题,即坐标的大部分地图图块都不会渲染.我正在定义和显示地图
function initmap() {
map = new L.Map('map');
var osmUrl = 'https://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer/tile/{z}/{y}/{x}.png';
var osm = new L.TileLayer(osmUrl);
map.addLayer(osm);
}
var lat = 40.120910;
var lng = -74.978602;
var startLatLng = new L.LatLng(lat, lng);
initmap();
map.setView(startLatLng, 16);
Run Code Online (Sandbox Code Playgroud)
它似乎应该工作,但地图div从不显示完整的地图/所有瓷砖.我知道有这个特定区域的报道,因为我一直在使用另一个人的服务,使用这个库和地图来查看这个位置.此代码基于其代码构建.
这个网站使用精确的坐标,地图服务器和传单js脚本,并能够渲染所有瓷砖.
这是一个JSFiddle来显示代码(和问题).知道为什么会发生这种情况或如何解决它?
arcgis-js-api ×10
javascript ×7
arcgis ×5
dojo ×3
esri ×2
leaflet ×2
typescript ×2
cross-domain ×1
esri-loader ×1
esri-maps ×1
gis ×1
heatmap ×1
html ×1
r ×1
reactjs ×1
vuejs3 ×1