个人中心
文章发布
退出
作者热门文章
- xml - AJAX/Jquery XML 解析
- 具有多重继承的 XML 模式
- .net - 枚举序列化 Json 与 XML
- XML 简单类型、简单内容、复杂类型、复杂内容
24
4
传单 map 上的默认放大/缩小按钮有一些问题。当我直接加载页面时一切正常，但是当我将一个状态更改为声明传单指令是按钮的状态时，它就不起作用了。举个例子
http://codepen.io/anon/pen/JkyEg?editors=101
代码:
HTML
<html ng-app="app">
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"/>
<link href="http://code.ionicframework.com/1.0.0-beta.11/css/ionic.min.css" rel="stylesheet"/>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css" />
<title>Leaflet example</title>
</head>
<body>
<ion-nav-view></ion-nav-view>
<script type="text/ng-template" id="locations.html">
<ion-view title="Locations">
<ion-content>
<ion-list can-swipe="true">
<ion-item ng-click="locationOnClick(location)" class="item item-icon-left" ng-repeat="location in locations">
<i class="icon ion-location"></i>
<h2>{{location.name}}</h2>
</ion-item>
</ion-list>
</ion-content>
</ion-view>
</script>
<script type="text/ng-template" id="location.html">
<ion-view title="{{location.name}}">
<ion-nav-bar class="bar-positive" animation="nav-title-slide-ios7">
<a ui-sref="locations" class="button icon-left ion-chevron-left button-clear ">Locations</a>
</ion-nav-bar>
<ion-content>
<leaflet height="480px"></leaflet>
</ion-content>
</ion-view>
</script>
<script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script>
<script src="http://code.ionicframework.com/1.0.0-beta.11/js/ionic.bundle.min.js"></script>
<script src="http://tombatossals.github.io/angular-leaflet-directive/dist/angular-leaflet-directive.min.js"></script>
</body>
</html>
JS
angular.module('app', [
'ionic',
'leaflet-directive'
])
.config(function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('locations', {
url: "/locations",
templateUrl:"locations.html",
controller: 'LocationsCtrl'
})
.state('location', {
url: "/location/:locationId",
templateUrl: "location.html",
controller: 'LocationCtrl'
});
// if none of the above states are matched, use this as the fallback
$urlRouterProvider.otherwise('/locations');
})
.factory('locationService', function(){
var _locations = [{
id: 1,
name: 'Sample location',
lat: 50,
lng: 50
}];
return {
getAll: function(){
return _locations;
},
getById: function(id){
return _locations.filter(function(loc){ return loc.id === id; })[0];
}
}
})
.controller('LocationsCtrl', function($scope, $location, locationService){
$scope.locations = locationService.getAll();
$scope.locationOnClick = function(location){
$location.path('/location/'+location.id);
};
})
.controller('LocationCtrl', function($scope, $stateParams, locationService){
$scope.location = locationService.getById($stateParams.locationId);
})
最佳答案
解决方案很简单。 Ionic 正在“吃掉”所有不是由框架创建的点击事件。对于传单 map 的容器，需要添加属性 data-tap-disabled="true"
<ion-content data-tap-disabled="true">
<leaflet height="480px"></leaflet>
</ion-content>
关于javascript - ionic /Angular 传单指令 - 放大/缩小按钮不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/25675208/
24
4
0
我有一个带有 LeafletJS 的项目。 例如，我在 map 中有 2 个点 (A, B)。我将其显示为 2 个标记 我必须画一条从 A 到 B 的折线。 我移动了标记 A，我想将标记 A 的折线的
是否可以向自定义图标标记添加文本？我想避免在图像编辑器中编辑图标只是为了添加文本。 我已经像这样创建了我的自定义图标标记: var airfieldIcon = L.icon({ ic
我想要一个 Leaflet 图层控件，选中/取消选中时必须显示/隐藏主图层内的所有子图层。我还想独立检查/取消选中子层。我浏览了 Leaflet 文档和论坛，但找不到任何引用资料。我应该为此编写一个自
如何处理 Leaflet map 库中的重叠线？ 我从服务器 sid 下载 geoJSON 并将其绘制到 map 上。如果有两个相同的条目，Leaflet 会绘制它们两次。这可以通过在服务器端查找完全
我在项目中使用 leafletjs。在 map 上我有几个多边形和标记。当其中一个被点击时，所有这些都有一个点击事件来显示一些信息。如果用户单击 map 的“空白”部分(而不是任何多边形或标记)，我想
我正在尝试对下一个边界的外观做出预测。这是一个plunkr: https://plnkr.co/edit/sk6NRh51WZA2vpWP 这就是我让它工作的方式，但它不是很有效: const ori
我是 Leaflet 的新手，目前我正在努力学习教程。到目前为止，我设法创建了一个交互式 clorophet map ，就像示例中的 http://leafletjs.com/examples/cho
我很难弄清楚为什么我无法在 map 上绘制正确的国家/地区。我已经完成了所有代码，但我仍然不明白为什么不能正常工作。 如果您看到任何问题，请告诉我。我很欣赏。 这是数据集 Country
是否可以在使用 Stamen Toner-lite tiles 的 Leaflet map 上设置中间(2.5、3.5、4.5 等)缩放级别？ ?这是我到目前为止计算缩放级别的代码: leafletm
早上、下午或晚上。 我有以下位置数据(从'Count of sampling points within a grid cell'调整) # Demo data set.seed(123) # lat
大家好，我正在开发一个具有 map 功能的网站。我的目标是，如果您单击标记，则使其拖动。 这是我的代码 else if (select1.value === "Arson"){ var note =
我正在开发一个应用程序，用户可以在其中上传KML文件，并使用Leaflet，toGeoJSON和Angular-Leaflet-Directive在屏幕上呈现路径。 我使用toGeoJSON.kml(
我需要在多边形要素中实现多色填充。填充将根据要素属性进行有条件的格式化。 假设我需要一个具有 3 色图案的多边形，如下所示: let fillPalette = ['orange', 'green',
我从 javascript 开始，并试图解决这个问题。 我希望当用户单击 map 时出现一个表单。当他们填写表单时，我想在该位置创建一个标记，并将该标记的弹出内容设置为表单中的值。添加表单完成后，我还
我已经在地理服务器中发布了一个功能，我可以通过传单及其 basemap 成功访问该功能。现在我需要在弹出窗口中获取feature onclick的属性信息。 我按原样使用了示例( https://gi
我正在使用带有一些标记的传单 map 。我还有一个侧边栏，可以在其中看到标记的名称，如果单击标记的名称， map 将缩放到标记的 lnglat。它已经可以工作，但我的问题是，当我刷新页面并在侧边栏中选
我正在使用 Leaflet 和 Mapbox，我想设置 map 的 View : 所有标记均可见 中心设置为特定点 使用 setView 和 fitbounds 单独完成每个点很容易，但我不知道如何同
是否有所有潜在 map 源的列表？在示例页面上，可以浏览四种类型的 map 。外面还有什么？ http://tombatossals.github.io/angular-leaflet-directi
我正在使用 Leaflet 制作交互式 map 。我在 map 上有标记(基于其经度和纬度坐标)，并且我希望某些标记具有与其他标记不同的颜色。例如，某些坐标我给它的分数是“10”，我希望它是粉红色的，
我可能忽略了如何在 map 上更改 LeftletJS 的光标。 http://leafletjs.com/reference.htm 我尝试设置map_div.style.cursor = 'cro
我是一名优秀的程序员,十分优秀！