• javascript google map circle radius_changed ,angularjs google map circle radius_changed


    javascript:

    var cityCircle = new google.maps.Circle({
    strokeColor: '#FF0000',
    strokeOpacity: 0.8,
    strokeWeight: 2,
    fillColor: '#FF0000',
    fillOpacity: 0.35,
    map: map,
    center: {lat: 41.878, lng: -87.629},
    radius: 100000,
    editable: true,
    });

    google.maps.event.addListener(cityCircle , 'radius_changed', function() {
    console.log(cityCircle .getRadius());
    });

    angularjs:

    html:

    <ui-gmap-circle ng-repeat="c in circles track by c.id" center="c.center" stroke="c.stroke" fill="c.fill" radius="c.radius"
    visible="c.visible" geodesic="c.geodesic" editable="c.editable" draggable="c.draggable" clickable="c.clickable" control="c.control" events="c.events">
    </ui-gmap-circle>

    js:
        {
    id: 1,
    center: {
    latitude: lat,
    longitude: lng
    },
    radius: radius,
    stroke: {
    color: '#08B21F',
    weight: 2,
    opacity: 1
    },
    fill: {
    color: '#08B21F',
    opacity: 0.5
    },
    geodesic: true, // optional: defaults to false
    draggable: false, // optional: defaults to false
    clickable: false, // optional: defaults to true
    editable: true, // optional: defaults to false
    visible: true, // optional: defaults to true
    control: {},
    events:{
    radius_changed: function(){
    $timeout(function(){
    $scope.$apply(function(){
    //console.log("circle radius radius_changed: " + $scope.circles[0].radius);
    $rootScope.$broadcast('LSN_BIND_RADIUS_DATA', $scope.circles[0].radius);
    });
    });

    }
    }
    }
    ];

    1. Scope提供$apply方法传播Model的变化。
    2. 如果我们需要在一个新的执行序列中运行代码时才真正需要用到它,而且当且仅当这个新的执行序列不是被angular JS的库的方法创建的,这个时候我们需要将代码用scope.scope.apply()包起来。
  • 相关阅读:
    js作用域
    正则表达式方法
    for-in
    关于this
    由indexOf引发的一系列探究和思考
    Html第一个程序
    转:1.ASP.Net MVC开发基础学习笔记;2.HtmlHelper与扩展方法
    转:单例模式
    转:ORM框架EF(Entity framework)实体框架
    C#lambda表达式
  • 原文地址:https://www.cnblogs.com/qyhol/p/5505343.html
Copyright © 2020-2023  润新知