मैंने इस लिंक से शुरुआत की:
मैं नीचे दिए गए लिंक के अनुसार शेक इंटेंसिटी दिखाना चाहूंगा:
मैंने इसे लागू करने की कोशिश की है। कृपया एक नज़र डालें:
<html>
<head>
<meta charset="utf-8" />
<meta
name="viewport"
content="initial-scale=1,maximum-scale=1,user-scalable=no"
/>
<!--
ArcGIS API for JavaScript, https://js.arcgis.com
For more information about the layers-geojson sample, read the original sample description at developers.arcgis.com.
https://developers.arcgis.com/javascript/latest/sample-code/layers-geojson/index.html
-->
<title>GeoJSONLayer - 4.15</title>
<style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
</style>
<link
rel="stylesheet"
href="https://js.arcgis.com/4.15/esri/themes/light/main.css"
/>
<script src="https://js.arcgis.com/4.15/"></script>
<script>
require([
"esri/Map",
"esri/layers/GeoJSONLayer",
"esri/views/MapView",
"esri/widgets/Legend"
], function(Map, GeoJSONLayer, MapView, Legend) {
// If GeoJSON files are not on the same domain as your website, a CORS enabled server
// or a proxy is required.
const url =
//"https://earthquake.usgs.gov/fdsnws/event/1/query?format=geojson&starttime&minlatitude=33.387&minlongitude=-127.134&maxlatitude=40.457&maxlongitude=-115.994&minlatitude=33.387&minlongitude=-127.134&maxlatitude=40.457&maxlongitude=-115.994&producttype=shakemap";
"https://services9.arcgis.com/RHVPKKiFTONKtxq3/arcgis/rest/services/USGS_Seismic_Data_v1/FeatureServer/1/query?where=1=1&geometry=-122.40,37.76&geometryType=esriGeometryPoint&inSR=4326&distance=100&units=esriSRUnit_StatuteMile&outFields=*&returnGeometry=true&geometryPrecision=4&outFields=*&f=pgeojson";
// Paste the url into a browser's address bar to download and view the attributes
// in the GeoJSON file. These attributes include:
// * mag - magnitude
// * type - earthquake or other event such as nuclear test
// * place - location of the event
// * time - the time of the event
// Use the Arcade Date() function to format time field into a human-readable format
const template = {
title: "Earthquake Info",
content: "Magnitude {mag} {type} hit {place} on {time}",
fieldInfos: [
{
fieldName: "time",
format: {
dateFormat: "short-date-short-time"
}
}
]
};
const renderer = {
type: "simple",
field: "mag",
symbol: {
type: "simple-marker",
color: "orange",
outline: {
color: "white"
}
},
visualVariables: [
{
type: "size",
field: "mag",
stops: [
{
value: 2.5,
size: "4px"
},
{
value: 8,
size: "40px"
}
]
}
]
};
const geojsonLayer = new GeoJSONLayer({
url: url,
title: "MMI",
copyright: "USGS Earthquakes",
popupTemplate: template,
renderer: renderer //optional
});
const map = new Map({
basemap: "gray",
layers: [geojsonLayer]
});
const view = new MapView({
container: "viewDiv",
center: [-122, 37],
zoom: 6,
map: map
});
view.ui.add(
new Legend({
view: view
}),
"bottom-left"
);
});
</script>
</head>
<body>
<div id="viewDiv"></div>
</body>
</html>Url एक बहु-बहुभुज सुविधा देता है:
नक्शा कोई बहुभुज नहीं दिखाता है। कृपया आप मेरी मदद कर सकते हैं?
0
Fraeli78
3 जून 2020, 21:45
1 उत्तर
सबसे बढ़िया उत्तर
क्वेरी वास्तव में बहुभुज लौटा रही है, आपके पास जो समस्या है वह गलत रेंडरर है। यही कारण है कि आप अंक के रूप में देख रहे हैं।
यहां आपका उदाहरण काम कर रहा है, मैं उस सेवा में परिभाषित रेंडरर का उपयोग करता हूं जिसे आप इसे कस्टम करना चाहते हैं,
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
<title>GeoJSONLayer - 4.15</title>
<style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
</style>
<link rel="stylesheet" href="https://js.arcgis.com/4.15/esri/themes/light/main.css" />
<script src="https://js.arcgis.com/4.15/"></script>
<script>
require([
"esri/Map",
"esri/layers/GeoJSONLayer",
"esri/views/MapView",
"esri/widgets/Legend",
"esri/renderers/support/jsonUtils"
], function (Map, GeoJSONLayer, MapView, Legend, rendererJsonUtils) {
const url =
"https://services9.arcgis.com/RHVPKKiFTONKtxq3/arcgis/rest/services/USGS_Seismic_Data_v1/FeatureServer/1/query?where=1=1&geometry=-122.40,37.76&geometryType=esriGeometryPoint&inSR=4326&distance=100&units=esriSRUnit_StatuteMile&outFields=*&returnGeometry=true&geometryPrecision=4&outFields=*&f=pgeojson";
const template = {
title: "Shake Intensity",
content: [
{
type: "fields",
fieldInfos: [
{
fieldName: "grid_value",
label: "Grid Value"
},
{
fieldName: "mag",
label: "Magnitude"
},
{
fieldName: "eventTime",
label: "Event Time",
format: {
dateFormat: "short-date-short-time"
}
},
{
fieldName: "updated",
label: "Updated",
format: {
dateFormat: "short-date-short-time"
}
},
{
fieldName: "url",
label: "Url"
}
]
}
]
};
const rendererJSON = {
"field": "grid_value",
"classificationMethod": "esriClassifyManual",
"classBreakInfos": [
{
"classMaxValue": 1.9999,
"symbol": {
"color": [
0,
0,
0,
0
],
"style": "esriSFSSolid",
"type": "esriSFS",
"outline": {
"color": [
0,
0,
0,
0
],
"width": 0.4,
"style": "esriSLSSolid",
"type": "esriSLS"
}
},
"description": "",
"label": "I (Not Felt)"
},
{
"classMaxValue": 3.9999,
"symbol": {
"color": [
0,
0,
0,
0
],
"style": "esriSFSSolid",
"type": "esriSFS",
"outline": {
"color": [
0,
0,
0,
0
],
"width": 0.4,
"style": "esriSLSSolid",
"type": "esriSLS"
}
},
"description": "",
"label": "II - III (Weak)"
},
{
"classMaxValue": 4.9999,
"symbol": {
"color": [
140,
250,
230,
255
],
"style": "esriSFSSolid",
"type": "esriSFS",
"outline": {
"color": [
0,
0,
0,
0
],
"width": 0.4,
"style": "esriSLSSolid",
"type": "esriSLS"
}
},
"description": "",
"label": "IV (Light)"
},
{
"classMaxValue": 5.9999,
"symbol": {
"color": [
140,
250,
140,
255
],
"style": "esriSFSSolid",
"type": "esriSFS",
"outline": {
"color": [
0,
0,
0,
0
],
"width": 0.4,
"style": "esriSLSSolid",
"type": "esriSLS"
}
},
"description": "",
"label": "V (Moderate)"
},
{
"classMaxValue": 6.9999,
"symbol": {
"color": [
255,
220,
20,
255
],
"style": "esriSFSSolid",
"type": "esriSFS",
"outline": {
"color": [
0,
0,
0,
0
],
"width": 0.4,
"style": "esriSLSSolid",
"type": "esriSLS"
}
},
"description": "",
"label": "VI (Strong)"
},
{
"classMaxValue": 7.9999,
"symbol": {
"color": [
255,
180,
0,
255
],
"style": "esriSFSSolid",
"type": "esriSFS",
"outline": {
"color": [
0,
0,
0,
0
],
"width": 0.4,
"style": "esriSLSSolid",
"type": "esriSLS"
}
},
"description": "",
"label": "VII (Very Strong)"
},
{
"classMaxValue": 8.9999,
"symbol": {
"color": [
255,
120,
20,
255
],
"style": "esriSFSSolid",
"type": "esriSFS",
"outline": {
"color": [
0,
0,
0,
0
],
"width": 0.4,
"style": "esriSLSSolid",
"type": "esriSLS"
}
},
"description": "",
"label": "VIII (Severe) "
},
{
"classMaxValue": 9.9999,
"symbol": {
"color": [
255,
0,
0,
255
],
"style": "esriSFSSolid",
"type": "esriSFS",
"outline": {
"color": [
0,
0,
0,
0
],
"width": 0.4,
"style": "esriSLSSolid",
"type": "esriSLS"
}
},
"description": "",
"label": "IX (Violent)"
},
{
"classMaxValue": 12,
"symbol": {
"color": [
143,
0,
0,
255
],
"style": "esriSFSSolid",
"type": "esriSFS",
"outline": {
"color": [
0,
0,
0,
0
],
"width": 0.4,
"style": "esriSLSSolid",
"type": "esriSLS"
}
},
"description": "",
"label": "X+ (Extreme)"
}
],
"type": "classBreaks",
"minValue": 0
};
const renderer = rendererJsonUtils.fromJSON(rendererJSON);
const geojsonLayer = new GeoJSONLayer({
url: url,
title: "MMI",
copyright: "USGS Earthquakes",
popupTemplate: template,
renderer
});
const map = new Map({
basemap: "gray",
layers: [geojsonLayer]
});
const view = new MapView({
container: "viewDiv",
center: [-122, 37],
zoom: 6,
map: map
});
view.ui.add(
new Legend({
view: view
}),
"bottom-left"
);
});
</script>
</head>
<body>
<div id="viewDiv"></div>
</body>
</html>एक आखिरी बात, मुझे पूरा यकीन नहीं है कि आप GeoJSONLayer से पूछताछ और उपयोग क्यों कर रहे हैं, याद रखें कि आप FeatureLayer का उपयोग कर सकते हैं जो वास्तव में कई क्वेरी संचालन का समर्थन करता है और आपको जेसन डेटा प्राप्त करने की आवश्यकता नहीं है यह करता है आपके लिए।
1
cabesuon
4 जून 2020, 11:02
संबंधित सवाल
नए सवाल
geojson
भौगोलिक डेटा को एन्कोडिंग के लिए, जोंसन पर आधारित जियोजन्स एक खुला प्रारूप है।