Skip to content

Commit

Permalink
feat: click event supported in Polyline component
Browse files Browse the repository at this point in the history
  • Loading branch information
leftstick committed Jun 21, 2019
1 parent f73b8b0 commit 6aafd26
Show file tree
Hide file tree
Showing 5 changed files with 6,962 additions and 6 deletions.
34 changes: 31 additions & 3 deletions demo/components/apidoc/docPolyline.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ import { PolylineOptions, Point, MapOptions, BPolyline } from 'angular2-baidu-ma
<div class="snippet" highlight>
<pre><code class="html">
&lt;baidu-map [options]="expression"&gt;
&lt;polyline [points]="expression" [options]="expression" (loaded)="expression"&gt;&lt;/polyline&gt;
&lt;polyline [points]="expression" [options]="expression" (loaded)="expression" (clicked)="expression"&gt;&lt;/polyline&gt;
&lt;/baidu-map&gt;
</code></pre>
</div>
Expand Down Expand Up @@ -58,18 +58,37 @@ import { PolylineOptions, Point, MapOptions, BPolyline } from 'angular2-baidu-ma
>)
</td>
</tr>
<tr>
<td>clicked</td>
<td><span class="label">expression</span></td>
<td>
Expression to evaluate upon polyline click event. (Three objects passed to this callback,
<code>e</code> for event, <code>polyline</code> for instance of
<a href="http://lbsyun.baidu.com/cms/jsapi/reference/jsapi_reference.html#a3b11" target="_blank"
>BMap.Polyline</a
>, <code>map</code> for instance of
<a href="http://lbsyun.baidu.com/cms/jsapi/reference/jsapi_reference.html#a0b0" target="_blank"
>BMap.Map</a
>)
</td>
</tr>
</tbody>
</table>
<h2 class="title">Example</h2>
<baidu-map [options]="opts">
<polyline [points]="points" [options]="polylineOptions" (loaded)="polylineLoaded($event)"></polyline>
<polyline
[points]="points"
[options]="polylineOptions"
(loaded)="polylineLoaded($event)"
(clicked)="polylineClicked($event)"
></polyline>
</baidu-map>
<div class="snippet" highlight>
<pre><code class="html">
&lt;baidu-map [options]="opts"&gt;
&lt;polyline [points]="points" [options]="polylineOptions" (loaded)="polylineLoaded($event)"&gt;&lt;/polyline&gt;
&lt;polyline [points]="points" [options]="polylineOptions" (loaded)="polylineLoaded($event)" (clicked)="polylineClicked($event)"&gt;&lt;/polyline&gt;
&lt;/baidu-map&gt;
</code></pre>
</div>
Expand Down Expand Up @@ -132,6 +151,11 @@ import { PolylineOptions, Point, MapOptions, BPolyline } from 'angular2-baidu-ma
public polylineLoaded(polyline: BPolyline): void &#123;
console.log('polyline loaded', polyline)
&#125;
public polylineClicked(&#123; polyline &#125;): void &#123;
console.log('polyline clicked', click)
&#125;
&#125;
</code></pre>
</div>
Expand Down Expand Up @@ -192,4 +216,8 @@ export class DocPolylineComponent {
public polylineLoaded(polyline: BPolyline): void {
console.log('polyline loaded', polyline)
}

public polylineClicked({ polyline }): void {
console.log('polyline clicked', polyline)
}
}
16 changes: 15 additions & 1 deletion lib/components/polyline.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ import { isNull, isUndefined } from '../helpers/object'
import { toPoints } from '../helpers/transformer'
import { nullCheck } from '../helpers/validate'
import { MapService } from '../providers/mapService'
import { BMapInstance } from '../types/Map'
import { BPolyline, PolylineOptions } from '../types/Polyline'
import { Point } from '../types/Point'

Expand All @@ -24,6 +25,7 @@ export class PolylineComponent implements OnInit, OnChanges, OnDestroy {
@Input() private options: PolylineOptions

@Output() private loaded = new EventEmitter()
@Output() private clicked = new EventEmitter()

private polyline: BPolyline

Expand All @@ -36,8 +38,9 @@ export class PolylineComponent implements OnInit, OnChanges, OnDestroy {
.addOverlay(() => {
return (this.polyline = new window.BMap.Polyline(toPoints(this.points), this.options))
})
.then(() => {
.then(({ map }) => {
this.loaded.emit(this.polyline)
this.addListener(this.polyline, map)
})
}

Expand Down Expand Up @@ -85,4 +88,15 @@ export class PolylineComponent implements OnInit, OnChanges, OnDestroy {
this.polyline.setStrokeWeight(options.strokeWeight)
}
}

private addListener(polyline: BPolyline, map: BMapInstance) {
polyline.addEventListener('click', (e: any) => {
console.log('sfdsfdsfds')
this.clicked.emit({
e,
map,
polyline
})
})
}
}
2 changes: 1 addition & 1 deletion lib/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "angular2-baidu-map",
"version": "4.6.1",
"version": "4.7.0",
"license": "GPL-3.0",
"description": "Angular2 component for Baidu map",
"author": "Howard.Zuo",
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "angular2-baidu-map",
"version": "4.6.1",
"version": "4.7.0",
"license": "GPL-3.0",
"scripts": {
"start": "ng serve",
Expand Down

0 comments on commit 6aafd26

Please sign in to comment.