2016-05-29 3 views
0

weiß jemand, ob es möglich ist, Text innerhalb einer Form mit ng-map zu haben.ng-Karte. Text in Form?

<ng-map default-style="true" zoom="18" center="53.25564575, -113.81401062" map-type-id="SATELLITE"> 
    <shape name="rectangle" 
    editable="true" 
    draggable="true" 
    bounds="[[53.2559199723254, -113.81282455825806],[53.25598021665402, -113.81252316761015 ]]" 
    on-bounds_changed="vm.boundsChanged()" 
    stroke-color="#333" 
    stroke-opacity="0.9" 
    stroke-weight="2" 
    fill-color="#FF0000" 
    fill-opacity="0.8" 
    > 
    </shape> 
</ng-map> 

irgendwelche ideen wie?

+0

Woher kommt 'ng-map'? Könnten Sie mehr Informationen und vielleicht einen JSFiddle zur Verfügung stellen, um Ihr Problem zu demonstrieren? Mit nur der obigen Vorlage kann Ihnen niemand helfen. – LordTribual

+0

Ich hätte erwähnen sollen, dass ng-map eine Winkel-Direktive ist. https://ngmap.github.io/. – user2062455

+0

Können Sie mir bitte sagen, wie haben Sie die Koordinaten erhalten, wenn die Form bearbeitet wird? –

Antwort

1

Dies ist, wie ich dieses Problem gelöst:

zuerst, ich meine Formen normalerweise hinzugefügt:

<shape ng-repeat="zone in mapViewCtrl.displayedZones" name="polygon" fill-color="{{zone.hexColor}}" stroke-color="{{zone.hexColor}}" stroke-opacity="{{zone.fillColor.a/100}}" stroke-weight="2" paths="{{zone.paths}}"></shape>' 

dann den Durchschnitt der Punkte, berechnet einen Punkt um das Zentrum zu erhalten:

getAveragePoint(points) { 
    var x = 0; 
    var y = 0; 
    let n = points.length; 
    for (let point of points) { 
     x += point[0]; 
     y += point[1]; 
    } 
    return [x/n, y/n]; 
} 

dann habe ich eine benutzerdefinierte Markierung am Mittelpunkt hinzugefügt, um meinen Text anzuzeigen:

<custom-marker ng-repeat="zone in mapViewCtrl.displayedZones" position="{{zone.center}}"><div class="zone-title"><b>{{zone.name}}</b></div></custom-marker> 

Ich hoffe diese Hilfe