ng-cw-v12
Version:
Angular UI component library
502 lines (496 loc) • 34.2 kB
JavaScript
import * as i0 from '@angular/core';
import { Injectable, EventEmitter, Component, Output, Input, NgModule } from '@angular/core';
import * as i3 from '@angular/common';
import { CommonModule } from '@angular/common';
import * as i4 from '@angular/forms';
import { FormsModule } from '@angular/forms';
import { __awaiter } from 'tslib';
import { Subject } from 'rxjs';
import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
import * as i1 from '@angular/common/http';
class LocalService {
constructor() {
this.x_PI = 3.14159265358979324 * 3000.0 / 180.0;
this.PI = 3.1415926535897932384626;
this.a = 6378245.0;
this.ee = 0.00669342162296594323;
}
/**
* 百度坐标系 (BD-09) 与火星坐标系 (GCJ-02) 的转换
* 即百度 转 谷歌、高德
* @param lng 经度
* @param lat 纬度
* @returns [lng, lat]
*/
bd09togcj02(lng, lat) {
var x_pi = 3.14159265358979324 * 3000.0 / 180.0;
var x = lng - 0.0065;
var y = lat - 0.006;
var z = Math.sqrt(x * x + y * y) - 0.00002 * Math.sin(y * x_pi);
var theta = Math.atan2(y, x) - 0.000003 * Math.cos(x * x_pi);
var gg_lng = z * Math.cos(theta);
var gg_lat = z * Math.sin(theta);
return [gg_lng, gg_lat];
}
/**
* 火星坐标系 (GCJ-02) 与百度坐标系 (BD-09) 的转换
* 即谷歌、高德 转 百度
* @param lng 经度
* @param lat 纬度
* @returns [lng, lat]
*/
gcj02tobd09(lng, lat) {
var z = Math.sqrt(lng * lng + lat * lat) + 0.00002 * Math.sin(lat * this.x_PI);
var theta = Math.atan2(lat, lng) + 0.000003 * Math.cos(lng * this.x_PI);
var bd_lng = z * Math.cos(theta) + 0.0065;
var bd_lat = z * Math.sin(theta) + 0.006;
return [bd_lng, bd_lat];
}
/**
* WGS84转火星坐标系 (GCJ-02)
* 即WGS84 转 谷歌、高德
* @param lng 经度
* @param lat 纬度
* @returns [lng, lat]
*/
wgs84togcj02(lng, lat) {
if (this.out_of_china(lng, lat)) {
return [lng, lat];
}
else {
var dlat = this.transformlat(lng - 105.0, lat - 35.0);
var dlng = this.transformlng(lng - 105.0, lat - 35.0);
var radlat = lat / 180.0 * this.PI;
var magic = Math.sin(radlat);
magic = 1 - this.ee * magic * magic;
var sqrtmagic = Math.sqrt(magic);
dlat = (dlat * 180.0) / ((this.a * (1 - this.ee)) / (magic * sqrtmagic) * this.PI);
dlng = (dlng * 180.0) / (this.a / sqrtmagic * Math.cos(radlat) * this.PI);
var mglat = lat + dlat;
var mglng = lng + dlng;
return [mglng, mglat];
}
}
/**
* 火星坐标系 (GCJ-02)转WGS84
* 即谷歌、高德 转 WGS84
* @param lng 经度
* @param lat 纬度
* @returns [lng, lat]
*/
gcj02towgs84(lng, lat) {
if (this.out_of_china(lng, lat)) {
return [lng, lat];
}
else {
var dlat = this.transformlat(lng - 105.0, lat - 35.0);
var dlng = this.transformlng(lng - 105.0, lat - 35.0);
var radlat = lat / 180.0 * this.PI;
var magic = Math.sin(radlat);
magic = 1 - this.ee * magic * magic;
var sqrtmagic = Math.sqrt(magic);
dlat = (dlat * 180.0) / ((this.a * (1 - this.ee)) / (magic * sqrtmagic) * this.PI);
dlng = (dlng * 180.0) / (this.a / sqrtmagic * Math.cos(radlat) * this.PI);
let mglat = lat + dlat;
let mglng = lng + dlng;
return [lng * 2 - mglng, lat * 2 - mglat];
}
}
transformlat(lng, lat) {
var ret = -100.0 + 2.0 * lng + 3.0 * lat + 0.2 * lat * lat + 0.1 * lng * lat + 0.2 * Math.sqrt(Math.abs(lng));
ret += (20.0 * Math.sin(6.0 * lng * this.PI) + 20.0 * Math.sin(2.0 * lng * this.PI)) * 2.0 / 3.0;
ret += (20.0 * Math.sin(lat * this.PI) + 40.0 * Math.sin(lat / 3.0 * this.PI)) * 2.0 / 3.0;
ret += (160.0 * Math.sin(lat / 12.0 * this.PI) + 320 * Math.sin(lat * this.PI / 30.0)) * 2.0 / 3.0;
return ret;
}
transformlng(lng, lat) {
var ret = 300.0 + lng + 2.0 * lat + 0.1 * lng * lng + 0.1 * lng * lat + 0.1 * Math.sqrt(Math.abs(lng));
ret += (20.0 * Math.sin(6.0 * lng * this.PI) + 20.0 * Math.sin(2.0 * lng * this.PI)) * 2.0 / 3.0;
ret += (20.0 * Math.sin(lng * this.PI) + 40.0 * Math.sin(lng / 3.0 * this.PI)) * 2.0 / 3.0;
ret += (150.0 * Math.sin(lng / 12.0 * this.PI) + 300.0 * Math.sin(lng / 30.0 * this.PI)) * 2.0 / 3.0;
return ret;
}
/**
* 判断是否在国内，不在国内则不做偏移
*/
out_of_china(lng, lat) {
return (lng < 72.004 || lng > 137.8347) || ((lat < 0.8293 || lat > 55.8271) || false);
}
/**
* jsonp封装
* @param obj \{url: '', success: ()=> {}}
*/
jsonpFunction(obj) {
// 创建一个script标签;
var script = document.createElement("script");
// 给函数起名字，定义为全局函数；
var fnName = "jsonp" + new Date().getTime();
// window.aaa就是把aaa设置为全局变量！
window[fnName] = obj.success;
// 改变src,添加到head中
if (obj.url.includes('?')) {
script.src = obj.url + "&callback=" + fnName;
}
else {
script.src = obj.url + "?callback=" + fnName;
}
// 把script标签添加到head标签中，就会发送src的请求了
document.head.appendChild(script);
// 代码执行完毕，把script标签删除
script.onload = function () {
document.head.removeChild(script);
window[fnName] = undefined;
};
}
}
LocalService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: LocalService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
LocalService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: LocalService, providedIn: 'root' });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: LocalService, decorators: [{
type: Injectable,
args: [{
providedIn: 'root'
}]
}], ctorParameters: function () { return []; } });
class PoiComponent {
constructor(eleRef, http, ls) {
this.eleRef = eleRef;
this.http = http;
this.ls = ls;
this.ncClick = new EventEmitter();
this.ncClear = new EventEmitter();
this.ncToken = '';
this.ncCity = '';
//百度：https://mapopen-website-wiki.cdn.bcebos.com/static_zip/BaiduMap_cityCode_1102.zip
//高德：https://a.amap.com/lbs/static/code_resource/AMap_adcode_citycode.zip
//天地图：https://download.tianditu.gov.cn/download/xzqh/AdminCode.csv
//腾讯：https://lbs.qq.com/service/webService/webServiceGuide/search/webServiceDistrict#6
this.ncPlaceholder = '搜地点';
this.ncWidth = '300px';
this.ncShowType = 'simple';
this.ncDelay = 500;
this.parametersOk = true; //参数是否输入完整，不完整不显示组件dom
this.searchBarShow = false; //poi搜索条显示
this.poiKey = ''; //poi搜索关键字
this.poiInputing = false;
this.poiTipsList = []; //poi搜索提示结果
this.poiTipsListShow = false; //是否显示poi提示列表
this.$poiKeyChangeSubject = new Subject();
}
ngOnInit() {
if (!this.ncMapType) {
this.parametersOk = false;
console.error('ncMapType为空');
}
if (this.ncToken == '') {
this.parametersOk = false;
console.error('ncToken为空，请根据地图类型传入相应token');
}
//监听搜索输入框值变化，500ms没变才执行搜索
this.$poiKeyChangeSubject.pipe(debounceTime(this.ncDelay), distinctUntilChanged((n, o) => {
return n === o;
})).subscribe((_value) => {
if (_value) {
this.searchPoiTips();
}
else {
this.clearPoi();
}
});
}
//win11微软输入法输入中文时会触发mouseleave
//-----解决思路如下----：
//1、通过document.activeElement.id判断input有焦点时searchBarLeave不执行searchBarShow=false
//2、但是input焦点一直存在，searchBarLeave永远不执行searchBarShow=false
//3、接着增加searchInputLeave，在鼠标离开input时取消input焦点，解决上步
//4、但是现在输入中文时，输入第一个字母又会触发searchInputLeave，关闭了焦点，执行了搜索（输入zai时变成了z爱）
//5、接着增加poiInputing，keydown时poiInputing=true，第一个字母输入时不执行searchInputLeave里的取消焦点，解决上步，
//6、但是poiInputing就一直为true了，searchInputLeave永远不执行取消input焦点了
//7、接着增加on-keyup时poiInputing=false，解决上步
searchBarLeave() {
setTimeout(() => {
if (document.activeElement && document.activeElement.id != 'searchInput') {
this.searchBarShow = false;
}
});
}
searchInputLeave() {
if (this.poiInputing) {
return;
}
setTimeout(() => {
let searchInput = this.eleRef.nativeElement.querySelector('#searchInput');
if (searchInput) {
searchInput.blur();
}
});
}
showSearch() {
this.searchBarShow = true;
setTimeout(() => {
let searchInput = this.eleRef.nativeElement.querySelector('#searchInput');
if (searchInput) {
searchInput.focus();
}
});
}
//输入框值变化
poiKeyChange() {
this.$poiKeyChangeSubject.next(this.poiKey);
}
//poi搜索提示
searchPoiTips() {
return __awaiter(this, void 0, void 0, function* () {
if (this.ncMapType == 'gaode') {
let url = `https://restapi.amap.com/v3/assistant/inputtips?key=${this.ncToken}&keywords=${this.poiKey}&city=${this.ncCity}`;
this.http.get(url).subscribe((res) => {
this.poiTipsListShow = true;
if (res['status'] == 1) {
this.poiTipsList = res['tips'];
for (let l of this.poiTipsList) {
if (l.location.length > 0) {
let GCJ02 = l.location.split(',');
l['locationWGS84'] = this.ls.gcj02towgs84(Number(GCJ02[0]), Number(GCJ02[1]));
}
else {
l['locationWGS84'] = [];
}
}
}
else {
this.poiTipsList = [];
}
});
}
else if (this.ncMapType == 'baidu') {
let url = '';
if (this.ncCity == '') {
url = `https://api.map.baidu.com/place/v2/suggestion?query=${this.poiKey}®ion=全国&output=json&ak=${this.ncToken}`;
}
else {
url = `https://api.map.baidu.com/place/v2/suggestion?query=${this.poiKey}®ion=${this.ncCity}&output=json&ak=${this.ncToken}`;
}
this.ls.jsonpFunction({
url: url,
success: (res) => {
this.poiTipsListShow = true;
if (res['status'] == 0) {
this.poiTipsList = res['result'];
for (let l of this.poiTipsList) {
if (l.location.lat) {
let GCJ02 = this.ls.bd09togcj02(Number(l.location.lng), Number(l.location.lat));
l['locationWGS84'] = this.ls.gcj02towgs84(Number(GCJ02[0]), Number(GCJ02[1]));
}
else {
l['locationWGS84'] = [];
}
}
}
else {
this.poiTipsList = [];
}
}
});
}
else if (this.ncMapType == 'tianditu') {
let url = '';
if (this.ncCity == '') {
url = `http://api.tianditu.gov.cn/v2/search?postStr={"keyWord":"${this.poiKey}","level": 18,"mapBound": "-180,-90,180,90","queryType":7,"start":0,"count":10,"show":2}&type=query&tk=${this.ncToken}`;
}
else {
url = `http://api.tianditu.gov.cn/v2/search?postStr={"keyWord":"${this.poiKey}","specify": ${this.ncCity},"level": 18,"mapBound": "-180,-90,180,90","queryType":7,"start":0,"count":10,"show":2}&type=query&tk=${this.ncToken}`;
}
this.http.get(url).subscribe((res) => {
this.poiTipsListShow = true;
if (res['status'].infocode == 1000) {
this.poiTipsList = res['pois'] || [];
for (let l of this.poiTipsList) {
if (l.lonlat.length > 0) {
let temp = l.lonlat.split(',');
l['locationWGS84'] = [Number(temp[0]), Number(temp[1])];
}
else {
l['locationWGS84'] = [];
}
}
}
else {
this.poiTipsList = [];
}
});
}
else if (this.ncMapType == 'tencent') {
let url = `https://apis.map.qq.com/ws/place/v1/suggestion?region=${this.ncCity}&keyword=${this.poiKey}&key=${this.ncToken}&output=jsonp`;
this.ls.jsonpFunction({
url: url,
success: (res) => {
this.poiTipsListShow = true;
if (res['status'] == 0) {
this.poiTipsList = res['data'];
for (let l of this.poiTipsList) {
if (l.location.lat) {
l['locationWGS84'] = this.ls.gcj02towgs84(Number(l.location.lng), Number(l.location.lat));
}
else {
l['locationWGS84'] = [];
}
}
}
else {
this.poiTipsList = [];
}
}
});
}
});
}
//poi提示点击
//若提示列表经纬度则直接使用
//若没有则使用提示名字调用详细接口，取返回结果第一条的经纬度
poiTipsClick(item) {
this.searchBarShow = false;
if (item.locationWGS84.length > 0) {
this.ncClick.emit(item);
}
else {
if (this.ncMapType == 'gaode') {
let url = `https://restapi.amap.com/v3/place/text?key=${this.ncToken}&keywords=${item.name}&city=${this.ncCity}`;
this.http.get(url).subscribe((res) => {
if (res['status'] == 1) {
if (res['pois'][0].location.length > 0) {
let GCJ02 = res['pois'][0].location.split(',');
item['locationWGS84'] = this.ls.gcj02towgs84(Number(GCJ02[0]), Number(GCJ02[1]));
this.ncClick.emit(item);
}
else {
this.ncClick.emit(item);
}
}
else {
this.ncClick.emit(item);
}
});
}
else if (this.ncMapType == 'baidu') {
let url = '';
if (this.ncCity == '') {
url = `https://api.map.baidu.com/place/v2/search?query=${item.name}®ion=全国&output=json&ak=${this.ncToken}`;
}
else {
url = `https://api.map.baidu.com/place/v2/search?query=${item.name}®ion=${this.ncCity}&output=json&ak=${this.ncToken}`;
}
this.ls.jsonpFunction({
url: url,
success: (res) => {
if (res['status'] == 0) {
if (res['results'][0].location.lat) {
let GCJ02 = this.ls.bd09togcj02(Number(res['results'][0].location.lng), Number(res['results'][0].location.lat));
item['locationWGS84'] = this.ls.gcj02towgs84(Number(GCJ02[0]), Number(GCJ02[1]));
this.ncClick.emit(item);
}
else {
this.ncClick.emit(item);
}
}
else {
this.ncClick.emit(item);
}
}
});
}
else if (this.ncMapType == 'tianditu') {
this.ncClick.emit(item);
}
else if (this.ncMapType == 'tencent') {
let boundary = '';
if (this.ncCity == '') {
boundary = 'region(全国, 1)';
}
else {
boundary = `region(${this.ncCity}, 1)`;
}
let url = `https://apis.map.qq.com/ws/place/v1/search?boundary=${boundary}&keyword=${item.title}&key=${this.ncToken}&output=jsonp`;
this.ls.jsonpFunction({
url: url,
success: (res) => {
if (res['status'] == 0) {
if (res['data'][0].location.lat) {
item['locationWGS84'] = this.ls.gcj02towgs84(Number(res['data'][0].location.lng), Number(res['data'][0].location.lat));
this.ncClick.emit(item);
}
else {
this.ncClick.emit(item);
}
}
else {
this.ncClick.emit(item);
}
}
});
}
}
}
//清除poi
clearPoi() {
this.poiKey = '';
this.poiTipsList = [];
this.poiTipsListShow = false;
this.ncClear.emit();
}
}
PoiComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: PoiComponent, deps: [{ token: i0.ElementRef }, { token: i1.HttpClient }, { token: LocalService }], target: i0.ɵɵFactoryTarget.Component });
PoiComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: PoiComponent, selector: "nc-poi", inputs: { ncMapType: "ncMapType", ncToken: "ncToken", ncCity: "ncCity", ncPlaceholder: "ncPlaceholder", ncWidth: "ncWidth", ncShowType: "ncShowType", ncDelay: "ncDelay" }, outputs: { ncClick: "ncClick", ncClear: "ncClear" }, ngImport: i0, template: "<ng-container *ngIf=\"parametersOk\">\r\n <div class=\"searchIcon\" *ngIf=\"!searchBarShow\">\r\n <span on-mouseenter=\"showSearch()\">\r\n <svg t=\"1725550918948\" class=\"icon\" viewBox=\"0 0 1024 1024\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\"\r\n p-id=\"23934\" width=\"32\" height=\"32\">\r\n <path\r\n d=\"M405.2 746.9C217 746.9 63.9 593.8 63.9 405.6S217 64.2 405.2 64.2s341.3 153.1 341.3 341.3-153.1 341.4-341.3 341.4z m0-614.4c-150.6 0-273.1 122.5-273.1 273.1s122.5 273.1 273.1 273.1 273.1-122.5 273.1-273.1-122.5-273.1-273.1-273.1z\"\r\n p-id=\"23935\"></path>\r\n <path\r\n d=\"M911.3 959.2L576.2 624.1c-0.8-0.8-0.8-2.1 0-2.8l45.4-45.4c0.8-0.8 2.1-0.8 2.8 0L959.5 911c0.8 0.8 0.8 2.1 0 2.8l-45.4 45.4c-0.8 0.8-2 0.8-2.8 0z\"\r\n p-id=\"23936\"></path>\r\n </svg>\r\n </span>\r\n </div>\r\n <div class=\"searchBar\" *ngIf=\"searchBarShow\" on-mouseleave=\"searchBarLeave()\" [ngStyle]=\"{'width': ncWidth}\">\r\n <input class=\"nc-input\" id=\"searchInput\" autocomplete=\"off\" type=\"text\" placeholder=\"{{ncPlaceholder}}\"\r\n [(ngModel)]=\"poiKey\" (ngModelChange)=\"poiKeyChange()\" on-mouseleave=\"searchInputLeave()\"\r\n on-keydown=\"poiInputing = true\" on-keyup=\"poiInputing = false\" />\r\n <div class=\"search-list\" *ngIf=\"poiTipsListShow\">\r\n <div class=\"no-data\" *ngIf=\"poiTipsList.length == 0\">\r\n <svg t=\"1725549253174\" class=\"icon\" viewBox=\"0 0 1024 1024\" version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\" p-id=\"14899\" width=\"64\" height=\"64\">\r\n <path\r\n d=\"M843.776 577.536L737.28 403.456c-2.048-4.096-6.144-6.144-10.24-6.144H284.672c-4.096 0-8.192 2.048-10.24 6.144l-106.496 174.08v215.04c0 6.144 4.096 10.24 10.24 10.24h657.408c6.144 0 10.24-4.096 10.24-10.24V581.632c-2.048 0-2.048-2.048-2.048-4.096z m-552.96-157.696h430.08l96.256 151.552H579.584c-6.144 0-10.24 4.096-10.24 10.24 0 34.816-28.672 63.488-63.488 63.488-34.816 0-63.488-28.672-63.488-63.488 0-6.144-4.096-10.24-10.24-10.24H194.56l96.256-151.552z m532.48 364.544h-634.88V593.92h233.472c6.144 40.96 40.96 75.776 83.968 75.776 43.008 0 79.872-32.768 83.968-75.776h233.472v190.464zM116.736 684.032v-12.288c0-2.048-2.048-6.144-6.144-6.144-2.048 0-6.144 2.048-6.144 6.144v12.288h-10.24c-2.048 0-6.144 2.048-6.144 6.144s2.048 6.144 6.144 6.144h12.288v12.288c0 2.048 2.048 6.144 6.144 6.144 2.048 0 6.144-2.048 6.144-6.144V696.32h12.288c2.048 0 6.144-2.048 6.144-6.144s-2.048-6.144-6.144-6.144h-14.336zM884.736 450.56h18.432c4.096 0 8.192 4.096 8.192 8.192s-4.096 8.192-8.192 8.192h-18.432v18.432c0 4.096-4.096 8.192-8.192 8.192s-8.192-4.096-8.192-8.192v-18.432h-18.432c-4.096 0-8.192-4.096-8.192-8.192s4.096-8.192 8.192-8.192h18.432v-18.432c0-4.096 4.096-8.192 8.192-8.192s8.192 4.096 8.192 8.192v18.432z m63.488 75.776h10.24c2.048 0 6.144 2.048 6.144 6.144s-2.048 6.144-6.144 6.144h-10.24v10.24c0 2.048-2.048 6.144-6.144 6.144-2.048 0-6.144-2.048-6.144-4.096v-10.24h-10.24c-2.048 0-6.144-2.048-6.144-6.144s2.048-6.144 6.144-6.144h10.24v-12.288c0-2.048 2.048-6.144 6.144-6.144 2.048 0 6.144 2.048 6.144 6.144v10.24zM131.072 436.224v-18.432c0-4.096-4.096-8.192-8.192-8.192s-8.192 4.096-8.192 8.192v16.384h-18.432c-4.096 0-8.192 4.096-8.192 8.192s4.096 8.192 8.192 8.192h16.384v20.48c0 4.096 4.096 8.192 8.192 8.192s8.192-4.096 8.192-8.192v-16.384h16.384c4.096 0 8.192-4.096 8.192-8.192s-4.096-8.192-8.192-8.192c4.096-2.048-14.336-2.048-14.336-2.048z m-77.824 174.08c-18.432 0-34.816-16.384-34.816-34.816 0-18.432 16.384-34.816 34.816-34.816 18.432 0 34.816 16.384 34.816 34.816 0 20.48-16.384 34.816-34.816 34.816z m0-16.384c10.24 0 16.384-8.192 16.384-16.384 0-10.24-8.192-16.384-16.384-16.384-10.24 0-16.384 8.192-16.384 16.384-2.048 8.192 6.144 16.384 16.384 16.384z m933.888-98.304c-8.192 0-16.384-6.144-16.384-16.384 0-8.192 6.144-16.384 16.384-16.384 8.192 0 16.384 6.144 16.384 16.384s-6.144 16.384-16.384 16.384z m0-6.144c4.096 0 8.192-4.096 8.192-8.192s-4.096-8.192-8.192-8.192-8.192 4.096-8.192 8.192 4.096 8.192 8.192 8.192zM288.768 241.664c6.144-6.144 14.336-6.144 20.48 0l51.2 51.2c6.144 6.144 6.144 14.336 0 20.48-6.144 6.144-14.336 6.144-20.48 0l-51.2-51.2c-6.144-6.144-6.144-14.336 0-20.48z m217.088-34.816c8.192 0 14.336 6.144 14.336 14.336v71.68c0 8.192-6.144 14.336-14.336 14.336-8.192 0-14.336-6.144-14.336-14.336v-71.68c0-6.144 6.144-14.336 14.336-14.336z m215.04 32.768c6.144 6.144 6.144 14.336 0 20.48L671.744 307.2c-6.144 6.144-14.336 6.144-20.48 0-6.144-6.144-6.144-14.336 0-20.48l49.152-49.152c6.144-4.096 16.384-4.096 20.48 2.048z m0 0\"\r\n p-id=\"14900\" fill=\"#bfbfbf\"></path>\r\n </svg>\r\n <div>\u6682\u65E0\u6570\u636E</div>\r\n </div>\r\n <ng-container *ngIf=\"poiTipsList.length > 0\">\r\n <!--\u7B80\u6613\u6A21\u5F0F-->\r\n <ng-container *ngIf=\"ncShowType == 'simple'\">\r\n <div class=\"list-row-1\" *ngFor=\"let l of poiTipsList;let i = index;\" (click)=\"poiTipsClick(l)\">\r\n <span class=\"tipsIcon\">\r\n <svg t=\"1725550918948\" class=\"icon\" viewBox=\"0 0 1024 1024\" version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\" p-id=\"23934\" width=\"32\" height=\"32\">\r\n <path\r\n d=\"M405.2 746.9C217 746.9 63.9 593.8 63.9 405.6S217 64.2 405.2 64.2s341.3 153.1 341.3 341.3-153.1 341.4-341.3 341.4z m0-614.4c-150.6 0-273.1 122.5-273.1 273.1s122.5 273.1 273.1 273.1 273.1-122.5 273.1-273.1-122.5-273.1-273.1-273.1z\"\r\n p-id=\"23935\"></path>\r\n <path\r\n d=\"M911.3 959.2L576.2 624.1c-0.8-0.8-0.8-2.1 0-2.8l45.4-45.4c0.8-0.8 2.1-0.8 2.8 0L959.5 911c0.8 0.8 0.8 2.1 0 2.8l-45.4 45.4c-0.8 0.8-2 0.8-2.8 0z\"\r\n p-id=\"23936\"></path>\r\n </svg>\r\n </span>\r\n <span>\r\n <ng-container *ngIf=\"ncMapType == 'gaode'\">{{l.name}}</ng-container>\r\n <ng-container *ngIf=\"ncMapType == 'baidu'\">{{l.name}}</ng-container>\r\n <ng-container *ngIf=\"ncMapType == 'tianditu'\">{{l.name}}</ng-container>\r\n <ng-container *ngIf=\"ncMapType == 'tencent'\">{{l.title}}</ng-container>\r\n </span>\r\n <span class=\"tipsDistrict\">\r\n <ng-container *ngIf=\"ncMapType == 'gaode'\">{{l.district}}</ng-container>\r\n <ng-container *ngIf=\"ncMapType == 'baidu'\">{{l.district}}</ng-container>\r\n <ng-container *ngIf=\"ncMapType == 'tianditu'\">{{l.county}}</ng-container>\r\n <ng-container *ngIf=\"ncMapType == 'tencent'\">{{l.district}}</ng-container>\r\n </span>\r\n </div>\r\n </ng-container>\r\n <!--\u8BE6\u7EC6\u6A21\u5F0F-->\r\n <ng-container *ngIf=\"ncShowType == 'detailed'\">\r\n <div class=\"list-row-2\" *ngFor=\"let l of poiTipsList;let i = index;\" (click)=\"poiTipsClick(l)\">\r\n <div class=\"name\">\r\n <ng-container *ngIf=\"ncMapType == 'gaode'\">{{i + 1}}\u3001{{l.name}}</ng-container>\r\n <ng-container *ngIf=\"ncMapType == 'baidu'\">{{i + 1}}\u3001{{l.name}}</ng-container>\r\n <ng-container *ngIf=\"ncMapType == 'tianditu'\">{{i + 1}}\u3001{{l.name}}</ng-container>\r\n <ng-container *ngIf=\"ncMapType == 'tencent'\">{{i + 1}}\u3001{{l.title}}</ng-container>\r\n </div>\r\n <div class=\"region\">\r\n <ng-container *ngIf=\"ncMapType == 'gaode'\">{{l.district}}</ng-container>\r\n <ng-container\r\n *ngIf=\"ncMapType == 'baidu'\">{{l.province}}{{l.city}}{{l.district}}</ng-container>\r\n <ng-container\r\n *ngIf=\"ncMapType == 'tianditu'\">{{l.province}}{{l.city}}{{l.county}}</ng-container>\r\n <ng-container\r\n *ngIf=\"ncMapType == 'tencent'\">{{l.province}}{{l.city}}{{l.district}}</ng-container>\r\n </div>\r\n <div class=\"address\">{{l.address}}</div>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </div>\r\n</ng-container>", styles: [".searchIcon{z-index:1001;position:relative;background-color:#1890ff;color:#fff;width:30px;height:30px;display:flex;align-items:center;justify-content:center;font-size:18px;border-radius:3px}.searchIcon svg{width:18px;height:18px;fill:#fff;display:flex}.searchBar{z-index:1001;position:relative}.searchBar .search-list{position:absolute;background-color:#fff;width:100%;max-height:380px;overflow:auto;box-shadow:0 2px 8px #e7e7e7}.searchBar .search-list .no-data{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px 0;color:gray}.searchBar .search-list .list-row-1{padding:5px 10px;cursor:pointer}.searchBar .search-list .list-row-1:hover{background-color:#ececec}.searchBar .search-list .list-row-1 .tipsIcon{color:gray;margin-right:5px}.searchBar .search-list .list-row-1 .tipsIcon svg{width:14px;height:14px;fill:gray;position:relative;top:2px}.searchBar .search-list .list-row-1 .tipsDistrict{color:gray;margin-left:5px;font-size:13px}.searchBar .search-list .list-row-2{padding:5px 10px;cursor:pointer}.searchBar .search-list .list-row-2:hover{background-color:#ececec}.searchBar .search-list .list-row-2 .region,.searchBar .search-list .list-row-2 .address{color:gray;font-size:13px}.searchBar .search-list::-webkit-scrollbar{width:5px!important;height:5px!important}.searchBar .search-list::-webkit-scrollbar-thumb{border-radius:5px!important;background:#cccccc!important}.searchBar .search-list::-webkit-scrollbar-track{border-radius:0!important;background:#f1f1f1!important}\n"], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: PoiComponent, decorators: [{
type: Component,
args: [{
selector: 'nc-poi',
templateUrl: './poi.component.html',
styleUrls: ['./poi.component.less']
}]
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.HttpClient }, { type: LocalService }]; }, propDecorators: { ncClick: [{
type: Output
}], ncClear: [{
type: Output
}], ncMapType: [{
type: Input
}], ncToken: [{
type: Input
}], ncCity: [{
type: Input
}], ncPlaceholder: [{
type: Input
}], ncWidth: [{
type: Input
}], ncShowType: [{
type: Input
}], ncDelay: [{
type: Input
}] } });
class NcPoiModule {
}
NcPoiModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: NcPoiModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
NcPoiModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: NcPoiModule, declarations: [PoiComponent], imports: [CommonModule,
FormsModule], exports: [PoiComponent] });
NcPoiModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: NcPoiModule, imports: [[
CommonModule,
FormsModule
]] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: NcPoiModule, decorators: [{
type: NgModule,
args: [{
declarations: [
PoiComponent
],
imports: [
CommonModule,
FormsModule
],
exports: [
PoiComponent
]
}]
}] });
/**
* Generated bundle index. Do not edit.
*/
export { NcPoiModule, PoiComponent };
//# sourceMappingURL=ng-cw-v12-poi.js.map