(UWP)通过编写算法实现在地图中的渐变路径
目前的一个App中需要实现这个需求,但是在UWP自带的Bing Map中,绘制的MapPolyline的StrokeColor的类型是Windows.UI.Color,也就是说一条MapPolyline只支持一种颜色,想要实现渐变是根本不可能的……但是我又不想说去拒绝视觉的需求,因为我觉得就算是系统提供的渐变画刷底层肯定也是通过相关的算法实现颜色渐变的,所以只要我们认真研究一下,最终一样可以达到我们想要的需求。
说个题外话,在这次的思路之前我还产生了其他的思路。当时是想在后台代码中实例化一个新的Polyline类型的对象(不是地图元素MapElement中的MapPolyline),因为Polyline的Fill属性是Brush类型的,而LinearGradientBrush同样是派生自Brush属性的,因此可以通过这种方法更为简单的实现颜色渐变。但是这样做了之后发现了一个问题:首先这些Polyline是Xaml元素,他们会不断向上叠加,这样会遮挡住用来标记用户所在位置的“小圆点”。其次这些Polyline不能够随着地图的缩放而调整长度或位置,用户体验非常差,因为不可能一个地图不支持缩放吧……
绕了一个大坑之后,我最后采用并实现了以下的算法实现MapPolyline的StrokeColor属性的渐变:
1.首先我们先整理一下思路。按照视觉姐姐给的图,渐变的初始颜色值和最终颜色值是确定的。也就是说我们的渐变色只能在这两个值之间变化。但是我们无法判定用户最终会跑多长的距离,也就意味着我们不能通过得到一个确定的距离之后进行等段线性渐变。那么就要换一种思路,也就是说我们可以设定一个确定的范围长度,第一段这个长度中的MapPolyline的StrokeColor的色值从初始值线性渐变到最终值,第二段这个长度中的MapPolyline的StrokeColor的色值再从最终值线性渐变到初始值,以此类推。更简单的说,就是这个确定长度的偶数倍从初始值渐变到最终值,奇数倍从最终值渐变到初始值。
2.明确了以上的思想之后,我们就可以开始编写渐变算法了。此处我将简便算法写成一个Helper类的静态方法,目的是与实际的业务逻辑解耦和,该Helper类如下:
public class GradualChangedHelper
{
public static int _distance = ; //颜色渐变的范围距离,单位m
private static readonly Color _color1 = Color.FromArgb(, , , );
private static readonly Color _color2 = Color.FromArgb(, , , );
private static readonly Color _color3 = Color.FromArgb(, , , );
private static readonly Color _color4 = Color.FromArgb(, , , ); private static int delta_R = _color1.R - _color4.R;
private static int delta_G = _color1.G - _color4.G;
private static int delta_B = _color4.B - _color1.B; private static int[] delta_rgb = new int[] { delta_R, delta_G, delta_B }; public static Color GetGradientBrush(double total_distance)
{
double rate = ((double)((int)total_distance % _distance) / _distance); //目前的距离在_distance中的比例
int[] current_colors = new int[];
int max_value = , min_value = ;
for (int i = ; i < ; i++)
{
switch (i)
{
case :
{
min_value = _color4.R; max_value = _color1.R;
current_colors[i] = (((int)total_distance / _distance) % == ) ? (max_value - (int)(delta_rgb[i] * rate)) : ((min_value) + (int)(delta_rgb[i] * rate)); //对R值进行颜色值的增减,在色域中循环
}; break;
case :
{
min_value = _color4.G; max_value = _color1.G;
current_colors[i] = (((int)total_distance / _distance) % == ) ? (max_value - (int)(delta_rgb[i] * rate)) : ((min_value) + (int)(delta_rgb[i] * rate)); //对G值进行颜色值的增减,在色域中循环
}; break;
case :
{
min_value = _color1.B; max_value = _color4.B;
current_colors[i] = (((int)total_distance / _distance) % == ) ? ((min_value) + (int)(delta_rgb[i] * rate)) : (max_value - (int)(delta_rgb[i] * rate)); //对B值进行颜色值的增减,在色域中循环
}; break;
}
}
return Color.FromArgb(, (byte)current_colors[], (byte)current_colors[], (byte)current_colors[]);
}
}
3.最后我们编写在地图中添加MapPolyline的代码:
private async void AddNewPolyline(BasicGeoposition new_position) //在地图中绘制新的路径
{
await Dispatcher.RunAsync(CoreDispatcherPriority.Normal, () =>
{
lines.Add(new_position); //将新的位置添加到点集合中
MapPolyline temp_line = new MapPolyline() //创建新的MapPolyline以绘制路径
{
StrokeColor = Helper.GradualChangedHelper.GetGradientBrush(TotalDistance),
StrokeThickness = ,
StrokeDashed = false
};
temp_line.Path = new Geopath(new List<BasicGeoposition>() //添加起始点和终点以设置MapPolyline的路径
{
lines[lines.Count - ],
lines[lines.Count - ]
});
maps.MapElements.Add(temp_line); //将MapPolyline添加到地图控件中
});
}
(UWP)通过编写算法实现在地图中的渐变路径的更多相关文章
- 正整数构成的线性表存放在单链表中,编写算法将表中的所有的奇数删除。(C语言)
/* 正整数构成的线性表存放在单链表中,编写算法将表中的所有的奇数删除 */ #include <stdio.h> #include <stdlib.h> typedef st ...
- [python] A*算法基于栅格地图的全局路径规划
# 所有节点的g值并没有初始化为无穷大 # 当两个子节点的f值一样时,程序选择最先搜索到的一个作为父节点加入closed # 对相同数值的不同对待,导致不同版本的A*算法找到等长的不同路径 # 最后c ...
- ZeroMQ接口函数之 :zmq_z85_decode – 从一个用Z85算法生成的文本中解析出二进制密码
ZeroMQ 官方地址 :http://api.zeromq.org/4-0:zmq_z85_decode zmq_z85_decode(3) ØMQ Manual - ØMQ/4.1 ...
- 相机标定:关于用Levenberg-Marquardt算法在相机标定中应用
LM算法在相机标定的应用共有三处. (1)单目标定或双目标定中,在内参固定的情况下,计算最佳外参.OpenCV中对应的函数为findExtrinsicCameraParams2. (2)单目标定中,在 ...
- 算法效果AB测试中的PV-UV不对称性
(转载请注明原创于潘多拉盒子) 算法效果的AB测试,是指在相同的应用场景下,对比不同算法的效果.通常的做法是,按照PV或UV随机分配流量到算法上,计算算法的CTR或转化率进行对比.为了表述简单,我们假 ...
- 利用HTML5 Geolocation API在百度地图中显示你的位置
代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <met ...
- C++11新特性应用--介绍几个新增的便利算法(不更改容器中元素顺序的算法)
总所周知.C++ STL中有个头文件,名为algorithm.即算法的意思. The header<algorithm>defines a collection of functions ...
- 在地图中调用显示FeatureLayer并进行render、popupTemplate、添加图例等相关内容的设置
ArcGIS Server发布完FeatureLayer后,就可以在自己的代码中调用并在地图上显示出来了. 一.代码框架 调用FeatureLayer,要在require开头引入"esri/ ...
- 机器学习、深度学习、和AI算法可以在网络安全中做什么?
本文由 网易云发布. 本文作者:Alexander Polyakov,ERPScan的首席技术官和联合创始人.EAS-SEC总裁,SAP网络安全传播者. 现在已经出现了相当多的文章涉及机器学习及其保 ...
随机推荐
- phpstorm 使用技巧
专题1 专题2 专题3 专题4 快捷键
- linux文件及文件夹权限
以前上学的时候简单了解了下linux,现在对它的认识也只停留在一些小白命令上.以为我只要不是做服务器端开发的应该不会去碰吧,工作了才知道做开发的多少还是要熟悉一些linux的,至少你的项目会部署在li ...
- tips~function pointer
An simple example: #include<stdio.h> int plus(int a,int b) { return a+b; } int main() { int (* ...
- iOS 打开本地 其他应用程序(URL Types)
iOS 打开本地其他应用程序(URL Types) /*前言废话:Xcode是神奇的,是我所见到的编译器中最为神奇的,如:它可以同时运行两个甚至更多Project到我们模拟器上,可以同时使用一个模拟器 ...
- 执行mvn 报错 source-1.5 中不支持 diamond运算符
编译版本出现了问题 <plugins> <plugin> <groupId>org.apache.maven.plugins</groupId> < ...
- Form Builder的三种查询方法构建
1.使用DEFAULT_WHERE: DECLARE V_DEFAULT_WHERE VARCHAR2(32767); V_WHERE VARCHAR2(32767); BEGI ...
- Python 网络爬虫(新闻采集脚本)
=====================爬虫原理===================== 通过Python访问新闻首页,获取首页所有新闻链接,并存放至URL集合中. 逐一取出集合中的URL,并访问 ...
- MongoDB安装
安装 1>设置MongoDB目录 cd /home/apps 附:centOS下创建目录命令 mkdir /home/apps 2>下载mongodb curl -O http ...
- 使用Ruby来实现批量更新AD中字段
准备工作 安装需要用到的gem gem install net-ldap gem install roo 准备好要更新的数据,比如exel表: /root/account.xlsx,内容如下 姓名 性 ...
- 总结初用erlang 时的遇到一些问题
算起来接触erlang 三个多月快四个月来,期间从零开始看书写erlang代码.修改RabbitMQ.业务开发.系统调优,总算是有点入门了. 最难受的是边学边修改RabbitMQ,开始真心的看不懂,不 ...