Поисковые подсказки по своим данным
В данном примере создается два HTML-элемента <input type="text">, к которым привязана выпадающая панель с поисковыми подсказками SuggestView.
Собственный провайдер поисковых подсказок может быть задан объектом, реализующим интерфейс ISuggestProvider.
index.html
provider.js
suggest.js
<!DOCTYPE html>
<html>
<head>
<title>Поисковые подсказки по своим данным</title>
<meta
http-equiv="Content-Type"
content="text/html; charset=utf-8"
/>
<!--
Укажите свой API-ключ. Тестовый ключ НЕ БУДЕТ работать на других сайтах.
Получить ключ можно в Кабинете разработчика: https://developer.tech.yandex.ru/keys/
-->
<script
src="https://api-maps.yandex.ru/2.1/?lang=ru_RU&apikey=<ключ для JS API>&suggest_apikey=<ключ для API Геосаджеста>"
type="text/javascript"
></script>
<script src="suggest.js" type="text/javascript"></script>
<script src="provider.js" type="text/javascript"></script>
<style>
html,
body {
position: relative;
width: 100%;
height: 95%;
padding: 0;
margin: 0;
font-family: Arial;
}
#suggest1,
#suggest2 {
width: 300px;
margin: 5px;
}
.header {
padding: 5px;
}
</style>
</head>
<body>
<p class="header">
Начните вводить запрос для появления поисковой подсказки
</p>
<input type="text" id="suggest1" />
<p class="header">
Собственный провайдер саджеста: список персонажей DC Comics
</p>
<input type="text" id="suggest2" />
</body>
</html>
var arr = [
"Animal Man",
"Аквамен",
"Аквалэд",
"Аквагёрл/Тула",
"Альфред Пенниуорт",
"Алан Скотт",
"Абин Сур",
"Атом",
"Атом Герл",
"Атомика",
"Атом Смэшер",
"Атроцитус",
"Аметист",
"Азраил",
"Арес",
"Аркилло",
"Анархия",
"Абра Кадабра",
"Амэйзо",
"Аманда Уоллер",
"Анти-монитор",
"Адам Стрэйндж",
"Антиопа",
"Альберт Дезмонд",
"Александр Петров",
"Алхимик",
"Астра",
"Айрис Уэст Аллен",
"Антон Аркэйн",
"Аргент",
"Артемида/Тигрица",
"Айкон",
"Атомный череп",
"Адский пёс",
"Арнольд Фласс",
"Артемида",
"Аид",
"Арисия",
"Ацтек",
"Аполлон",
"Американский малыш",
"Анна Фортуна",
"Агент Свобода",
"Алый лыжник",
"Антеус",
"Амбуш Баг",
"Асмодел",
"Амон Сур",
"Бэтмен",
"Бэтмен будущего",
"Бэтмен (Zur-En-Arrh)",
"Бэтмен/Азраил/Жан Поль Валли",
"Бэтмен/Дик Грейсон",
"Бэтмен/Джейсон Тодд: (Вселенная «Битва за плащ»)",
"Бэтмен (Земля-2)",
"Бэтмен: Готэм в газовом свете (Земля-19)",
"Бэтмен: Вселенная «Второе Пришествие» (Земля-22)",
"Бэтмен: Вселенная «Красный сын» (Земля-30)",
"Бэтмен: Самый темный рыцарь (Земля-32)",
"Бэтмен/Томас Уэйн «Версия Flashpoint»",
"Бэт-Майт",
"Бэтгёрл",
"Бэтвумэн",
"Бэтвинг",
"Бустер Голд",
"Барри Аллен",
"Барт Аллен",
"Барбара Гордон/Оракул",
"Болотная тварь",
"Бист-бой",
"Безумный Шляпник",
"Бэйн",
"Большая Барда",
"Барон Блицкриг",
"Брейниак",
"Брейниак 5",
"Бизарро",
"Бамблби",
"Большая белая акула",
"Бронзовый Тигр",
"Блокбастер",
"Балка",
"Блэксмит",
"Братец Гримм",
"Близ",
"Бункер",
"Белый кролик",
"Блок",
"Бушидо",
"Блэкфайер",
"Браин",
"Бруно Манхэйм",
"Болт",
"Буудикка",
"Бабуля",
"Безумная Гарриет",
"Багровая лиса",
"Бэклэш (Марк Слэйтон)",
"Блудвинд",
"Биг Сир",
"Биббо Биббовски",
"Блэйз и Сатанус",
"Вайб",
"Вандал Сэвидж",
"Вопрос",
"Волчок",
"Виктор Зсасз",
"Виксен",
"Вики Вэйл",
"Веон",
"Вайс",
"Винтегрин",
"Варп",
"Возрождающийся человек",
"Вотан",
"Вечные люди",
"Временной охотник",
"Верховный отец",
"Вирман Вундабар",
"Варлорд",
"Вулкана",
"Винтер",
"Верд",
"Вольная красавица",
"Вера",
"Гай Гарднер",
"Гансет",
"Грифтер",
"Глиноликий",
"Горилла Гродд",
"Граф Вертиго",
"Генерал Зод",
"Гепарда",
"Гиганта",
"Гипси",
"Г’норт",
"Голубой Кобальт",
"Генерал Сэм Лэйн",
"Генерал Уэйд Эйлинг",
"Гектор Хаммонд",
"Гнаррк",
"Гизмо",
"Гарольд Алнут",
"Гордон Годфри",
"Гартч",
"Гилотина",
"Грандж",
"Гео-Сила",
"Годива",
"Генерал Слава",
"Дарксайд",
"Джон Константин",
"Доктор Манхэттен",
"Доктор Фэйт",
"Доктор Хьюго Стрэйндж",
"Доктор Лайт",
"Доктор Лайт (Кимио Хоши)",
"Доктор Сивана",
"Доктор Полу-Ночник",
"Доктор Туман",
"Доктор Полярис",
"Доктор Хёрт",
"Джеймс Гордон",
"Дик Грейсон",
"Дик Грейсон (Земля-43)",
"Дик Грейсон (Земля-50)",
"Дик Грейсон (Вселенная «Возвращение тёмного рыцаря»)",
"Джейсон Тодд",
"Дэмиен Уэйн",
"Джей Гаррик",
"Джон Стюарт",
"Джейд",
"Джона Хекс",
"Дикий Кот",
"Джесси Кастер",
"Джокер",
"Детстроук",
"Двуликий",
"Дэдшот",
"Дэсперо",
"Диабло",
"Думсдэй",
"Дзюдо мастер",
"Донна Трой",
"Детектив шимпанзе",
"Дочь Чернокнижника",
"Дух",
"Джонни Квик",
"Джонатан и Марта Кент",
"Дочь Джокера",
"Декс-Старр",
"Двойная ставка",
"Джованни Затара",
"Демон Этриган",
"Дьякон Блэкфайр",
"Джесси Квик",
"Джо Чилл",
"Джонни Сорроу",
"Девушка Паук",
"Девушка Фантом",
"Девушка Сатурн",
"Дикий огонь",
"Джинкс",
"Джерико",
"Дэмиан Дарк",
"Дэйтвинг",
"Десаад",
"Дуббайлекс",
"Джимми Олсен",
"Доктор Магнус",
"Детектив Сара Эссен",
"Даунстар",
"Джентльмен Дух",
"Дэймос",
"Джонни Гром",
"Доктор Мун",
"Драага",
"Доктор Дестини",
"Джор-Эл",
"Дикая кошка",
"Дженни Квантум",
"Дегатон",
"Дух Ворона",
"Джейн Доу",
"Дэн Турпин",
"Джакс-Ур",
"Дерек Пауэрс / Разрушитель",
"Демон Гейт",
"Женщина-кошка",
"Женщина завтрашнего дня",
"Женщина Ястреб",
"Жнец",
"Жан Лоринг",
"Желтый джекет",
"Желтая Пери",
"Затанна",
"Зелёный Фонарь",
"Зелёная стрела",
"Зелёная стрела (Коннор Хоук)",
"Зауриэль",
"Загадочник",
"Зум",
"Золотой Глайдер",
"Злая Звезда",
"Зевс",
"Звездный Сапфир",
"Звездный парень",
"Золотой Орел",
"Импульс",
"Инерция",
"Игрушечник",
"Ипполита",
"Индиго",
"Ион",
"Инферно",
"Изумрудная Императрица",
"Инженер",
"Исис",
"Инк",
"Йо-йо",
"Катана",
"Капитан Атом",
"Капитан Марвел/Шазам",
"Капитан Холод",
"Капитан Бумеранг",
"Красный колпак",
"Киллер Фрост",
"Киловог",
"Киборг",
"Король Часов",
"Король Акул",
"Королева пчел",
"Крысолов",
"Кармайн Фальконе",
"Кэтмен",
"Кларион",
"Купидон",
"KGBeast",
"Календарный человек",
"Кассандра Кейн",
"Креозот",
"Красный Торнадо",
"Красная ракета",
"Кэрол Феррис",
"Копперхэд (Медный Змей)",
"Король крыс",
"Коготь (Томас Уэйн-Младший)",
"Комедиант",
"Кид-Зум",
"Клиффорд ДеВо (Думатель)",
"Калибак",
"Кирпич",
"Крипто",
"Кайл Райнер",
"Карате Кид",
"Колоссальный парень",
"Космик Бой",
"Капитан Марвел мл.",
"Коли",
"Красная звезда",
"Кровавые братья",
"Красный танк",
"Крипеер",
"Кэрри Келли",
"Кинг Фарадэй",
"Кэт Грант",
"Красный Вулкан",
"Красная Торпеда",
"Красная Инферно",
"Кобра",
"Канджар Ро",
"Кукольник",
"Калькулятор",
"Катма Туи",
"Ключ",
"Королева сказок",
"Командир Сталь",
"Кэтлин Фэрчайлд",
"Комплект",
"Конгорилла",
"Кунг",
"Король дракон",
"Кинг Кулл",
"Красный жук",
"Король Химера",
"Ключмастер",
"Капитан Комета",
"Красный коготь",
"Константин Дракон",
"Комодо",
"Лекс Лютор",
"Лоис Лейн",
"Лицо со шрамом",
"Лобо",
"Либра",
"Лёд",
"Люцифер",
"Леди Блэкхоук",
"Леди Шива",
"Лэйра",
"Ларфлиз",
"ЛайвВайр",
"Линчеватель",
"Лесной волк",
"Лори Морнинг",
"Лилитч Клэй",
"Линкс",
"Лана Лэнг",
"Лагуно бой",
"Л-Рон",
"Лори Лемарис",
"Лашина",
"Люциус Фокс",
"Лорд Хавок",
"Линда Паркс",
"Лар Ганд",
"Луная дева",
"Ледяная дева",
"Лесли Томпкинс",
"Марсианский охотник",
"Мого",
"Мисс Марсианка",
"Мера",
"Миднайтер",
"Мертвец",
"Мадам Ксанаду",
"Мистер Фриз",
"Мрак",
"Мерлин (Артур Кинг)",
"Максвел Лорд",
"Монах",
"Монгул",
"Металло",
"Магистр Зеркал",
"Мистер Мксизптлк",
"Метаморфо",
"Магог",
"Митчелл Хандред",
"Мастер улик",
"Макси Зевс",
"Мэн-Бэт",
"Маджента",
"Манфред Мота",
"Мистер Потрясающий",
"Мистер Сталь",
"Магеддон",
"Манчестер Блэк",
"Меняющийся Человек",
"Мальчик Хамелеон",
"Месье Маллах",
"Мистер Твистер",
"Мамонт",
"Мэд Мод",
"Минион",
"Мэл Дункан",
"Мэрси Грэйвз",
"Мастер",
"Матч",
"Метрон",
"Металломэны",
"Ма’алефа’ак",
"Майор Сила",
"Марони",
"Мала",
"Мэгги Савьер",
"Морган Эйдж",
"Моргаин Ли Фэй",
"Мантис",
"Мистер Чудо",
"Мерлин",
"Майор Победа",
"Миротворец",
"Мисс Америка",
"Мистер Америка",
"Механика",
"Мордру",
"Молния",
"Максима",
"Майа",
"Майор Бедствие",
"Мульти-Мэн",
"Мистек",
"Мастер вопросов",
"Мазикеен",
"Мертвый король",
"Найтвинг",
"Некрон",
"Нерон",
"Нейтрон",
"Неудачник",
"Нон",
"Ночная Сова",
"Негативный Человек",
"Немезида",
"Найтхоук",
"Ночной бегун",
"Наблюдатель",
"Натиск",
"Нортвинд",
"Нам Ек",
"Охотница",
"Охотница (Хелена Уэйн)",
"Огненный шторм",
"Обратный Флэш",
"Оулмэн",
"Орион",
"Охотник на людей",
"Озимандия",
"Обсидиан",
"Оберон",
"Огненный Ястреб",
"Орфей",
"Оникс",
"Озарение",
"Онимар Синн",
"Олимпиец",
"ОМАК",
"Ономатопея",
"Пауэр Гёрл",
"Пауэр Ринг",
"Паразит",
"Параллакс",
"Пандора",
"Пуля",
"Пингвин",
"Пугало",
"Профессор Зум",
"Погодный Волшебник",
"Пластика",
"Пластичный человек",
"Прометей",
"Повелитель океанов",
"Паслен",
"Профессор Свин",
"Пик-а-бу",
"Песочный человек",
"Пранкстер",
"Профессор Майло",
"Псаймон",
"Пламя",
"Парень Элемент",
"Пантша",
"Призм",
"Плазмус",
"Прокси",
"Пола Брукс",
"Профессор Иво",
"Пэт Дуган",
"Профессор Гамильтон",
"Пити Росс",
"Прокурор Лоуб",
"Предвестник",
"Перри Уайт",
"Песок",
"Психо-пират",
"Посейдон",
"Подводная шестерка",
"Ра’с аль Гул",
"Роршах",
"Робин",
"Робин (Земля-2)",
"Робин РэдБлэйд (Земля-31)",
"Рой Харпер/Спиди/Арсенал/Красная стрела",
"Рэйвен",
"Рэгмен",
"Рип Хантер",
"Рик Флаг",
"Рене Монтойя",
"Реактрон",
"Рыцарь Аркхема",
"Роза и Шип",
"Радужный Рейдер/Радужные Рейдеры",
"Рейзер",
"Риск",
"Разрушительница",
"Рыцарь",
"Ракета",
"Руперт Торн",
"Рэмпэйдж",
"Рулетка",
"Рэй",
"Рокси Ракета",
"Рик Стоун",
"Супермен",
"Супергёрл",
"Супербой",
"Супербой-прайм",
"Супернова",
"Синий жук",
"Саймон Баз",
"Стефани Браун",
"Старфаер",
"Спектр",
"Сон",
"Статик",
"Соломон Гранди",
"Старбрейкер",
"Синестро",
"Смерть",
"Светлячок",
"Старро",
"Сержант Рок",
"Спайдер Иерусалим",
"Синий Дьявол",
"Стармэн: Рыцарь Джек",
"Стармэн",
"Старгерл",
"Суперженщина",
"Слипкнот",
"Стив Тревор",
"Синяя птица",
"Скрипач",
"Сворачивающийся человек",
"Смоляная яма",
"Са́витар",
"Серебряная Банши",
"Сосулька",
"Святой Уолкер",
"Себастьян Фауст",
"Спортмастер",
"Сущность",
"Смертельный шторм (Deathstorm)",
"Спящая девушка",
"Старбой",
"Солнечный парень",
"Сторож Зоопарка",
"Спиди",
"Солнцестояние",
"Саймон Дарк",
"Секрет",
"Страж",
"Стражи Вселенной",
"Сэнсей",
"Сорока",
"Световой луч",
"Салаак",
"Стив Ломбард",
"Стомпа",
"Слэм Брэдли",
"Степной волк",
"Саймон Стэгг",
"Сияющий Рыцарь",
"Сногсшибательный шпион",
"Сигнал Всадника",
"Сонный убийца",
"Соловар",
"Сонар",
"Содам Ят",
"Сара Раинмакер",
"Смертельный удар",
"Спартанец",
"Сьюи Дибни",
"Супер-Шеф",
"Серебряная Волшебница",
"Синяя Сойка",
"Сигнальщик",
"Саргон Колдун",
"Скар",
"Тим Дрейк/Красный робин",
"Томар-Ре",
"Тряпичная кукла",
"Трикстер",
"Тригон",
"Траляля и Труляля",
"Траектория",
"Талия аль Гул",
"Тепловая Волна",
"Темный мастер",
"Терра",
"Такион",
"Татуированный человек",
"Тайрок",
"Теневая девушка",
"Трезубец",
"Терра",
"Тартарус",
"Тэйлон (Земля-3)",
"Томас и Марта Уэйн",
"Т.О Морроу",
"Тхара Ак-Вар",
"Тобиас Вайли",
"Тала",
"Теневой вор",
"Тимоти Хантер",
"Триумф",
"Тасманский дьявол",
"Тюремщик",
"Тина МакГи",
"Тритон",
"Тренчи",
"Уолли Уэст",
"Убийца Крок",
"Убийца Мотылек",
"Удлиняющийся Человек",
"Ультрамен",
"Ультра-Гуманайт",
"Ультра Бой",
"Уничтожитель",
"Убеждающий",
"Урон",
"Удивительный человек",
"Угорь",
"Фаора",
"Флэш",
"Фантом Стрейнджер",
"Франкенштейн",
"Франкенштейн мл.",
"Феликс Фауст",
"Фламинго",
"Фьюри-6",
"Фобия",
"Фантазм",
"Фурия",
"Фуражер",
"Фуджи",
"Харли Квинн",
"Хаш",
"Хэл Джордан",
"Хэнк Хеншоу/Киборг Супермен",
"Хоукгерл",
"Харви Булок",
"Химо",
"Хэлспонт",
"Хот Спот",
"Холли Робинсон",
"Хронос",
"Харм",
"Хатч-сет",
"Хэллстрайк",
"Харибда",
"Хаген",
"Цирцея",
"Циклон",
"Цикада",
"Чудо-женщина",
"Чудо-девушка",
"Чудо близнецы",
"Чёрный Адам",
"Чёрная канарейка",
"Чёрная молния",
"Чёрная Орхидея",
"Чёрный Жук",
"Чёрная Маска",
"Чёрная рука",
"Чёрный гонщик",
"Чёрная Алиса",
"Чёрная манта",
"Чёрный паук",
"Человек-ястреб",
"Человек-Зебра",
"Чешир",
"Чаровница",
"Часовщик",
"Часовщик (Андроид)",
"Черепаха/Человек-черепаха",
"Чёрный Флэш",
"Ч’п",
"Чёрный вулкан",
"Чёрный Кондор",
"Чародей",
"Чревовещатель",
"Чайна Уайт",
"Шёлковый Призрак",
"Шёпот",
"Шиммер",
"Эклипсо",
"Этта Кэнди",
"Электрошокер",
"Энергичный человек",
"Эйс/Бэт-пес",
"Эретик (Левиафан)",
"Элемент Герл",
"Эндрю Беннет",
"Эквинокс",
"Юга Хан",
"Юошио Натсуми",
"Ядовитый Плющ",
"Ястреб и Голубь",
"B’wana Beast",
"Bat Lash",
"Bernadeth",
"Blackbriar Thorn",
"Pow Wow Smith",
"Machiste",
],
find = function (arr, find) {
return arr.filter(function (value) {
return (
(value + "").toLowerCase().indexOf(find.toLowerCase()) != -1
);
});
};
var provider = {
suggest: function (request, options) {
var res = find(arr, request),
arrayResult = [],
results = Math.min(options.results, res.length);
for (var i = 0; i < results; i++) {
arrayResult.push({ displayName: res[i], value: res[i] });
}
return ymaps.vow.resolve(arrayResult);
},
};
ymaps.ready(init);
function init() {
// Создаем выпадающую панель с поисковыми подсказками и прикрепляем ее к HTML-элементу по его id.
var suggestView1 = new ymaps.SuggestView("suggest1");
// Задаем собственный провайдер поисковых подсказок и максимальное количество результатов.
var suggestView2 = new ymaps.SuggestView("suggest2", {
provider: provider,
results: 3,
});
}