如何在 ArcGIS esri 搜索中进行查询?
How to put queries in ArcGIS esri search?
我在搜索中有自己的查询,如何禁用 ArcGIS 搜索微件中的默认搜索功能并应用我的查询?
我当前的代码
const location = () => {
const map = new Map({
basemap: 'arcgis-light-gray',
});
const view = new MapView({
center: [123.5504, 12.3574], // Longitude, latitude
container: mapDiv.current,
map: map,
zoom: 2, // Zoom level
ui: {
components: ["attribution"] // removes default widgets except for attribution
}
});
var zoom = new Zoom({
view: view,
layout: "vertical"
});
view.ui.add(zoom, "bottom-right");
view
.when((r) => {})
.then(() => {
mapDiv.current = view;
search();
});
}
const search = () => {
const searchWidget = new Search();
mapDiv.current.ui.add(searchWidget, { position: "top-left", index: 2 });
}
这是 arcGIS 中的示例搜索小部件,我想覆盖搜索功能,唯一可以搜索的是我查询中的数据,它会像图片中那样显示
资源
https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Search.html
您必须使用 ArcGIS JS API 创建自定义源并将其添加为源并将标志 includeDefaultSources 设置为 false 以便它仅使用您的。
https://developers.arcgis.com/javascript/latest/sample-code/widgets-search-customsource/
此处有代码笔示例:https://codepen.io/pen?editors=1000
注意这里他们如何添加自定义源,并在实例化时将其作为源添加到搜索小部件。
// Create Search widget using custom SearchSource
const searchWidget = new Search({
view: view,
sources: [ customSearchSource ],
includeDefaultSources: false
});
您可以在此处找到有关如何制作 customSource 的文档 https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Search-SearchSource.html
您需要创建一个自定义 SearchSource
来从您的数据中提取建议和结果,并将其设置为您的 searchWidget
.
的来源
您需要实施的事情:
SearchSource
- 使用您的数据的搜索源。
getSuggestions
[returns promise
] - 提供来自您的来源的建议列表
getResults
[returns promise
] - 提供来自您的来源的搜索结果列表。
实施:
我根据官方文档修改了这个sample code for search widget with custom source
如您所见,getSuggestions
和 getResults
都是 returns 和 promise
,因为它旨在通过 api 访问远程数据。但是由于您的数据存储在本地,因此您需要创建一个解析为您的数据的 promise
对象。
您提供给我的测试数据:
const test_data = {
allIBLocations: {
data: [
{
id: 'e53be02e-4cdb-11ec-81d3-0242ac130003',
status: 'Incomplete',
name: 'Revere - 2',
externalId: '547e2f43-b950-4b5e-ada4-7fcc110a3785',
ownerId: '494bd1c4-6d28-4a42-9d98-515129fde2b9',
owner: {
id: '494bd1c4-6d28-4a42-9d98-515129fde2b9',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T03:43:00.787Z',
ibLocationType: {
name: 'Shared Office',
},
ibLocationTypeId: 'e53bca08-4cdb-11ec-81d3-0242ac130003',
capacity: null,
phoneNumber: null,
address: {
street1: 'Nitzsche Burg',
street2: 'Emiliano Camp',
city: 'Rowlandtown',
state: 'Kentucky',
zipCode: '41738',
country: 'Kuwait',
},
geoCode:{
latitude:-23.0633,
longitude:15.0875
}
// geoCode: null,
},
{
id: 'e53be45c-4cdb-11ec-81d3-0242ac130003',
status: 'Incomplete',
name: 'Jersey City - 4',
externalId: '1fb7c170-f794-4c85-9a3b-57b8013a2821',
ownerId: '494bd1c4-6d28-4a42-9d98-515129fde2b9',
owner: {
id: '494bd1c4-6d28-4a42-9d98-515129fde2b9',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T03:43:00.788Z',
ibLocationType: {
name: 'Warm Site',
},
ibLocationTypeId: 'e53bcf80-4cdb-11ec-81d3-0242ac130003',
capacity: null,
phoneNumber: null,
address: {
street1: 'Madisen Club',
street2: 'Cyrus Courts',
city: 'East Breanamouth',
state: 'Kentucky',
zipCode: '05565-8531',
country: 'Solomon Islands',
},
geoCode:{
latitude:51.6617,
longitude:-4.5789
}
// geoCode: null,
},
{
id: 'e53be510-4cdb-11ec-81d3-0242ac130003',
status: 'Incomplete',
name: 'Wellington - 5',
externalId: '479e2dc0-b55d-42fd-978b-9d9086216a5f',
ownerId: '494bd1c4-6d28-4a42-9d98-515129fde2b9',
owner: {
id: '494bd1c4-6d28-4a42-9d98-515129fde2b9',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T03:43:00.788Z',
ibLocationType: {
name: 'Hospital',
},
ibLocationTypeId: 'e53bbf40-4cdb-11ec-81d3-0242ac130003',
capacity: null,
phoneNumber: null,
address: {
street1: 'Carter Pass',
street2: 'Gutmann Brooks',
city: 'Paterson',
state: 'New Jersey',
zipCode: '79928-2470',
country: 'Cyprus',
},
geoCode: {
latitude: 51.0899,
longitude: 67.9272,
},
},
{
id: 'e53be7e0-4cdb-11ec-81d3-0242ac130003',
status: 'Incomplete',
name: 'Doral - 9',
externalId: 'b096ed12-fed2-4a9b-8e61-5c2639b7b7d8',
ownerId: '494bd1c4-6d28-4a42-9d98-515129fde2b9',
owner: {
id: '494bd1c4-6d28-4a42-9d98-515129fde2b9',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T03:43:00.789Z',
ibLocationType: {
name: 'Warehouse',
},
ibLocationTypeId: 'e53bcc24-4cdb-11ec-81d3-0242ac130003',
capacity: null,
phoneNumber: null,
address: {
street1: 'Koelpin Lodge',
street2: 'Ana Tunnel',
city: 'Carsonside',
state: 'Maine',
zipCode: '44431',
country: 'Guatemala',
},
geoCode: {
latitude: 0.181,
longitude: 47.7937,
},
// "geoCode": null
},
{
id: 'e53bec7c-4cdb-11ec-81d3-0242ac130003',
status: 'Incomplete',
name: 'Bossier City - 13',
externalId: '486d4838-bb19-4b29-b4d0-1b492762ebe8',
ownerId: '494bd1c4-6d28-4a42-9d98-515129fde2b9',
owner: {
id: '494bd1c4-6d28-4a42-9d98-515129fde2b9',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T03:43:00.790Z',
ibLocationType: {
name: 'Hospital',
},
ibLocationTypeId: 'e53bbf40-4cdb-11ec-81d3-0242ac130003',
capacity: null,
phoneNumber: null,
address: {
street1: 'Lakin Throughway',
street2: 'Zulauf Island',
city: 'Casa Grande',
state: 'Illinois',
zipCode: '68798',
country: 'Mayotte',
},
geoCode:{
latitude:84.2091,
longitude:147.886
}
// geoCode: null,
},
{
id: 'f14e81b4-e932-4d8e-900e-bfbff065aa0e',
status: 'Incomplete',
name: 'loc3',
externalId: 'locId3',
ownerId: 'db1a73a2-498b-43c8-9185-424cda7ea272',
owner: {
id: 'db1a73a2-498b-43c8-9185-424cda7ea272',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T03:48:14.815Z',
ibLocationType: null,
ibLocationTypeId: null,
capacity: 0,
phoneNumber: 0,
address: {
street1: 'add1',
street2: '',
city: '',
state: '',
zipCode: '',
country: 'Anguilla',
},
geoCode: null,
},
{
id: '9ceb84ec-aaeb-43af-9b26-11d8ae360625',
status: 'Incomplete',
name: 'loc2',
externalId: 'locId2',
ownerId: 'db1a73a2-498b-43c8-9185-424cda7ea272',
owner: {
id: 'db1a73a2-498b-43c8-9185-424cda7ea272',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T03:45:12.722Z',
ibLocationType: null,
ibLocationTypeId: null,
capacity: 0,
phoneNumber: 0,
address: {
street1: 'add1',
street2: '',
city: '',
state: '',
zipCode: '',
country: 'Albania',
},
geoCode: null,
},
{
id: '74b322b3-525f-4e76-b002-2997e9a9a8e1',
status: 'Incomplete',
name: 'loc5',
externalId: 'locId5',
ownerId: 'db1a73a2-498b-43c8-9185-424cda7ea272',
owner: {
id: 'db1a73a2-498b-43c8-9185-424cda7ea272',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T03:57:41.612Z',
ibLocationType: null,
ibLocationTypeId: null,
capacity: 0,
phoneNumber: 0,
address: {
street1: 'add',
street2: '',
city: '',
state: '',
zipCode: '',
country: 'Anguilla',
},
geoCode: null,
},
{
id: '125b0fc8-b91a-42b2-90b3-c37b9afdfa36',
status: 'Incomplete',
name: 'loc1',
externalId: 'locId1',
ownerId: 'db1a73a2-498b-43c8-9185-424cda7ea272',
owner: {
id: 'db1a73a2-498b-43c8-9185-424cda7ea272',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T03:43:34.697Z',
ibLocationType: null,
ibLocationTypeId: null,
capacity: 0,
phoneNumber: 0,
address: {
street1: 'add1',
street2: '',
city: '',
state: '',
zipCode: '',
country: 'Albania',
},
geoCode: null,
},
{
id: '3375b2d3-13cd-401c-b79b-21cbdb956b15',
status: 'Incomplete',
name: 'loc7',
externalId: 'locId7',
ownerId: 'db1a73a2-498b-43c8-9185-424cda7ea272',
owner: {
id: 'db1a73a2-498b-43c8-9185-424cda7ea272',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T04:02:11.694Z',
ibLocationType: null,
ibLocationTypeId: null,
capacity: 0,
phoneNumber: 0,
address: {
street1: 'add',
street2: '',
city: '',
state: '',
zipCode: '',
country: 'Albania',
},
geoCode: null,
},
{
id: '76af916a-d42c-43a8-a945-3832bb9a4047',
status: 'Incomplete',
name: 'loc6',
externalId: 'locId6',
ownerId: 'b9e7b94f-d3a7-460d-afb7-34e277df3aec',
owner: {
id: 'b9e7b94f-d3a7-460d-afb7-34e277df3aec',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T04:00:02.946Z',
ibLocationType: null,
ibLocationTypeId: null,
capacity: 0,
phoneNumber: 0,
address: {
street1: 'add',
street2: '',
city: '',
state: '',
zipCode: '',
country: 'Albania',
},
geoCode: null,
},
{
id: 'cf688233-f48d-4566-a4e9-5f208d6afb71',
status: 'Incomplete',
name: 'loc4',
externalId: 'locId4',
ownerId: 'db1a73a2-498b-43c8-9185-424cda7ea272',
owner: {
id: 'db1a73a2-498b-43c8-9185-424cda7ea272',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T03:53:28.203Z',
ibLocationType: null,
ibLocationTypeId: null,
capacity: 0,
phoneNumber: 0,
address: {
street1: 'add1',
street2: '',
city: '',
state: '',
zipCode: '',
country: 'Albania',
},
geoCode: null,
},
],
},
};
const testData = new Promise((resolve, reject) => {
setTimeout(() => {
resolve(test_data); //test_data = Your data.
}, 1000);
});
现在您有一个 promise
可以解析您的数据,您可以使用它来获取建议和结果。
const customSearchSource = new SearchSource({
placeholder: 'Search',
getSuggestions: (params) => {
return testData.then((data) => {
var results = [];
var toSearch = params.suggestTerm;
data = data["allIBLocations"]["data"];
for(var i=0; i<data.length; i++) {
if(data[i]["name"].indexOf(toSearch)!=-1) {
results.push(data[i]);
}
}
return results.map((feature) => {
return {
key: "name",
text: feature.name,
sourceIndex: params.sourceIndex
};
})
});
},
getResults: (params) => {
return testData.then((data) => {
var results = [];
var toSearch = params.suggestResult.text;
data = data["allIBLocations"]["data"];
for(var i=0; i<data.length; i++) {
if(data[i]["name"].indexOf(toSearch)!=-1) {
results.push(data[i]);
}}
const searchResults = results.map((feature) => {
console.log(feature)
const graphic = new Graphic({
geometry: new Point({
latitude: feature.geoCode.latitude,
longitude: feature.geoCode.longitude
}),
attributes: feature.address
});
const buffer = geometryEngine.geodesicBuffer(
graphic.geometry,
100,
"meters"
);
const searchResult = {
extent: buffer.extent,
feature: graphic,
name: feature["name"]
};
return searchResult;
});
return searchResults;
});
}
});
最后将 customSearchSource
设置为 searchWidget
中的来源,同时禁用默认来源以强制 searchWidget
使用您提供的来源。
const searchWidget = new Search({
view: view,
sources: [customSearchSource],
includeDefaultSources: false
});
Live Demo
我在搜索中有自己的查询,如何禁用 ArcGIS 搜索微件中的默认搜索功能并应用我的查询?
我当前的代码
const location = () => {
const map = new Map({
basemap: 'arcgis-light-gray',
});
const view = new MapView({
center: [123.5504, 12.3574], // Longitude, latitude
container: mapDiv.current,
map: map,
zoom: 2, // Zoom level
ui: {
components: ["attribution"] // removes default widgets except for attribution
}
});
var zoom = new Zoom({
view: view,
layout: "vertical"
});
view.ui.add(zoom, "bottom-right");
view
.when((r) => {})
.then(() => {
mapDiv.current = view;
search();
});
}
const search = () => {
const searchWidget = new Search();
mapDiv.current.ui.add(searchWidget, { position: "top-left", index: 2 });
}
这是 arcGIS 中的示例搜索小部件,我想覆盖搜索功能,唯一可以搜索的是我查询中的数据,它会像图片中那样显示
资源
https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Search.html
您必须使用 ArcGIS JS API 创建自定义源并将其添加为源并将标志 includeDefaultSources 设置为 false 以便它仅使用您的。
https://developers.arcgis.com/javascript/latest/sample-code/widgets-search-customsource/
此处有代码笔示例:https://codepen.io/pen?editors=1000
注意这里他们如何添加自定义源,并在实例化时将其作为源添加到搜索小部件。
// Create Search widget using custom SearchSource
const searchWidget = new Search({
view: view,
sources: [ customSearchSource ],
includeDefaultSources: false
});
您可以在此处找到有关如何制作 customSource 的文档 https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Search-SearchSource.html
您需要创建一个自定义 SearchSource
来从您的数据中提取建议和结果,并将其设置为您的 searchWidget
.
您需要实施的事情:
SearchSource
- 使用您的数据的搜索源。getSuggestions
[returnspromise
] - 提供来自您的来源的建议列表getResults
[returnspromise
] - 提供来自您的来源的搜索结果列表。
实施:
我根据官方文档修改了这个sample code for search widget with custom source
如您所见,getSuggestions
和 getResults
都是 returns 和 promise
,因为它旨在通过 api 访问远程数据。但是由于您的数据存储在本地,因此您需要创建一个解析为您的数据的 promise
对象。
您提供给我的测试数据:
const test_data = {
allIBLocations: {
data: [
{
id: 'e53be02e-4cdb-11ec-81d3-0242ac130003',
status: 'Incomplete',
name: 'Revere - 2',
externalId: '547e2f43-b950-4b5e-ada4-7fcc110a3785',
ownerId: '494bd1c4-6d28-4a42-9d98-515129fde2b9',
owner: {
id: '494bd1c4-6d28-4a42-9d98-515129fde2b9',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T03:43:00.787Z',
ibLocationType: {
name: 'Shared Office',
},
ibLocationTypeId: 'e53bca08-4cdb-11ec-81d3-0242ac130003',
capacity: null,
phoneNumber: null,
address: {
street1: 'Nitzsche Burg',
street2: 'Emiliano Camp',
city: 'Rowlandtown',
state: 'Kentucky',
zipCode: '41738',
country: 'Kuwait',
},
geoCode:{
latitude:-23.0633,
longitude:15.0875
}
// geoCode: null,
},
{
id: 'e53be45c-4cdb-11ec-81d3-0242ac130003',
status: 'Incomplete',
name: 'Jersey City - 4',
externalId: '1fb7c170-f794-4c85-9a3b-57b8013a2821',
ownerId: '494bd1c4-6d28-4a42-9d98-515129fde2b9',
owner: {
id: '494bd1c4-6d28-4a42-9d98-515129fde2b9',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T03:43:00.788Z',
ibLocationType: {
name: 'Warm Site',
},
ibLocationTypeId: 'e53bcf80-4cdb-11ec-81d3-0242ac130003',
capacity: null,
phoneNumber: null,
address: {
street1: 'Madisen Club',
street2: 'Cyrus Courts',
city: 'East Breanamouth',
state: 'Kentucky',
zipCode: '05565-8531',
country: 'Solomon Islands',
},
geoCode:{
latitude:51.6617,
longitude:-4.5789
}
// geoCode: null,
},
{
id: 'e53be510-4cdb-11ec-81d3-0242ac130003',
status: 'Incomplete',
name: 'Wellington - 5',
externalId: '479e2dc0-b55d-42fd-978b-9d9086216a5f',
ownerId: '494bd1c4-6d28-4a42-9d98-515129fde2b9',
owner: {
id: '494bd1c4-6d28-4a42-9d98-515129fde2b9',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T03:43:00.788Z',
ibLocationType: {
name: 'Hospital',
},
ibLocationTypeId: 'e53bbf40-4cdb-11ec-81d3-0242ac130003',
capacity: null,
phoneNumber: null,
address: {
street1: 'Carter Pass',
street2: 'Gutmann Brooks',
city: 'Paterson',
state: 'New Jersey',
zipCode: '79928-2470',
country: 'Cyprus',
},
geoCode: {
latitude: 51.0899,
longitude: 67.9272,
},
},
{
id: 'e53be7e0-4cdb-11ec-81d3-0242ac130003',
status: 'Incomplete',
name: 'Doral - 9',
externalId: 'b096ed12-fed2-4a9b-8e61-5c2639b7b7d8',
ownerId: '494bd1c4-6d28-4a42-9d98-515129fde2b9',
owner: {
id: '494bd1c4-6d28-4a42-9d98-515129fde2b9',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T03:43:00.789Z',
ibLocationType: {
name: 'Warehouse',
},
ibLocationTypeId: 'e53bcc24-4cdb-11ec-81d3-0242ac130003',
capacity: null,
phoneNumber: null,
address: {
street1: 'Koelpin Lodge',
street2: 'Ana Tunnel',
city: 'Carsonside',
state: 'Maine',
zipCode: '44431',
country: 'Guatemala',
},
geoCode: {
latitude: 0.181,
longitude: 47.7937,
},
// "geoCode": null
},
{
id: 'e53bec7c-4cdb-11ec-81d3-0242ac130003',
status: 'Incomplete',
name: 'Bossier City - 13',
externalId: '486d4838-bb19-4b29-b4d0-1b492762ebe8',
ownerId: '494bd1c4-6d28-4a42-9d98-515129fde2b9',
owner: {
id: '494bd1c4-6d28-4a42-9d98-515129fde2b9',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T03:43:00.790Z',
ibLocationType: {
name: 'Hospital',
},
ibLocationTypeId: 'e53bbf40-4cdb-11ec-81d3-0242ac130003',
capacity: null,
phoneNumber: null,
address: {
street1: 'Lakin Throughway',
street2: 'Zulauf Island',
city: 'Casa Grande',
state: 'Illinois',
zipCode: '68798',
country: 'Mayotte',
},
geoCode:{
latitude:84.2091,
longitude:147.886
}
// geoCode: null,
},
{
id: 'f14e81b4-e932-4d8e-900e-bfbff065aa0e',
status: 'Incomplete',
name: 'loc3',
externalId: 'locId3',
ownerId: 'db1a73a2-498b-43c8-9185-424cda7ea272',
owner: {
id: 'db1a73a2-498b-43c8-9185-424cda7ea272',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T03:48:14.815Z',
ibLocationType: null,
ibLocationTypeId: null,
capacity: 0,
phoneNumber: 0,
address: {
street1: 'add1',
street2: '',
city: '',
state: '',
zipCode: '',
country: 'Anguilla',
},
geoCode: null,
},
{
id: '9ceb84ec-aaeb-43af-9b26-11d8ae360625',
status: 'Incomplete',
name: 'loc2',
externalId: 'locId2',
ownerId: 'db1a73a2-498b-43c8-9185-424cda7ea272',
owner: {
id: 'db1a73a2-498b-43c8-9185-424cda7ea272',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T03:45:12.722Z',
ibLocationType: null,
ibLocationTypeId: null,
capacity: 0,
phoneNumber: 0,
address: {
street1: 'add1',
street2: '',
city: '',
state: '',
zipCode: '',
country: 'Albania',
},
geoCode: null,
},
{
id: '74b322b3-525f-4e76-b002-2997e9a9a8e1',
status: 'Incomplete',
name: 'loc5',
externalId: 'locId5',
ownerId: 'db1a73a2-498b-43c8-9185-424cda7ea272',
owner: {
id: 'db1a73a2-498b-43c8-9185-424cda7ea272',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T03:57:41.612Z',
ibLocationType: null,
ibLocationTypeId: null,
capacity: 0,
phoneNumber: 0,
address: {
street1: 'add',
street2: '',
city: '',
state: '',
zipCode: '',
country: 'Anguilla',
},
geoCode: null,
},
{
id: '125b0fc8-b91a-42b2-90b3-c37b9afdfa36',
status: 'Incomplete',
name: 'loc1',
externalId: 'locId1',
ownerId: 'db1a73a2-498b-43c8-9185-424cda7ea272',
owner: {
id: 'db1a73a2-498b-43c8-9185-424cda7ea272',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T03:43:34.697Z',
ibLocationType: null,
ibLocationTypeId: null,
capacity: 0,
phoneNumber: 0,
address: {
street1: 'add1',
street2: '',
city: '',
state: '',
zipCode: '',
country: 'Albania',
},
geoCode: null,
},
{
id: '3375b2d3-13cd-401c-b79b-21cbdb956b15',
status: 'Incomplete',
name: 'loc7',
externalId: 'locId7',
ownerId: 'db1a73a2-498b-43c8-9185-424cda7ea272',
owner: {
id: 'db1a73a2-498b-43c8-9185-424cda7ea272',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T04:02:11.694Z',
ibLocationType: null,
ibLocationTypeId: null,
capacity: 0,
phoneNumber: 0,
address: {
street1: 'add',
street2: '',
city: '',
state: '',
zipCode: '',
country: 'Albania',
},
geoCode: null,
},
{
id: '76af916a-d42c-43a8-a945-3832bb9a4047',
status: 'Incomplete',
name: 'loc6',
externalId: 'locId6',
ownerId: 'b9e7b94f-d3a7-460d-afb7-34e277df3aec',
owner: {
id: 'b9e7b94f-d3a7-460d-afb7-34e277df3aec',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T04:00:02.946Z',
ibLocationType: null,
ibLocationTypeId: null,
capacity: 0,
phoneNumber: 0,
address: {
street1: 'add',
street2: '',
city: '',
state: '',
zipCode: '',
country: 'Albania',
},
geoCode: null,
},
{
id: 'cf688233-f48d-4566-a4e9-5f208d6afb71',
status: 'Incomplete',
name: 'loc4',
externalId: 'locId4',
ownerId: 'db1a73a2-498b-43c8-9185-424cda7ea272',
owner: {
id: 'db1a73a2-498b-43c8-9185-424cda7ea272',
},
orgId: 'd7d931d4-289d-49b1-bd88-29d0317b6987',
deletedBy: null,
deletedAt: null,
updatedBy: null,
updatedAt: '2021-12-15T03:53:28.203Z',
ibLocationType: null,
ibLocationTypeId: null,
capacity: 0,
phoneNumber: 0,
address: {
street1: 'add1',
street2: '',
city: '',
state: '',
zipCode: '',
country: 'Albania',
},
geoCode: null,
},
],
},
};
const testData = new Promise((resolve, reject) => {
setTimeout(() => {
resolve(test_data); //test_data = Your data.
}, 1000);
});
现在您有一个 promise
可以解析您的数据,您可以使用它来获取建议和结果。
const customSearchSource = new SearchSource({
placeholder: 'Search',
getSuggestions: (params) => {
return testData.then((data) => {
var results = [];
var toSearch = params.suggestTerm;
data = data["allIBLocations"]["data"];
for(var i=0; i<data.length; i++) {
if(data[i]["name"].indexOf(toSearch)!=-1) {
results.push(data[i]);
}
}
return results.map((feature) => {
return {
key: "name",
text: feature.name,
sourceIndex: params.sourceIndex
};
})
});
},
getResults: (params) => {
return testData.then((data) => {
var results = [];
var toSearch = params.suggestResult.text;
data = data["allIBLocations"]["data"];
for(var i=0; i<data.length; i++) {
if(data[i]["name"].indexOf(toSearch)!=-1) {
results.push(data[i]);
}}
const searchResults = results.map((feature) => {
console.log(feature)
const graphic = new Graphic({
geometry: new Point({
latitude: feature.geoCode.latitude,
longitude: feature.geoCode.longitude
}),
attributes: feature.address
});
const buffer = geometryEngine.geodesicBuffer(
graphic.geometry,
100,
"meters"
);
const searchResult = {
extent: buffer.extent,
feature: graphic,
name: feature["name"]
};
return searchResult;
});
return searchResults;
});
}
});
最后将 customSearchSource
设置为 searchWidget
中的来源,同时禁用默认来源以强制 searchWidget
使用您提供的来源。
const searchWidget = new Search({
view: view,
sources: [customSearchSource],
includeDefaultSources: false
});