google map 控件

前面我们创建了一个很简单的GoogleMap控件,它显然不满足我们的需求,通过分析,我们有如下这些进一步的需求:

一. 我们想要给用户提供在客户端调整Map大小的功能,也就是说我们的用户可以根据自己的喜好在网页上自己调整Map的大小.

要实现这个功能,我们需要三个属性:MaxHeight,MaxWidth,SizePercent,我决定用前面重写的Heght和Width属性充当MaxHeight和MaxWidth属性,而Map的实际显示大小则由它们和SizePercent属性一起决定.SizePercent属性如下:

        [
        Bindable(true),
        Category("Google"),
        DefaultValue(50),
        Description("The size percent.")
        ]
        public virtual int SizePercent
        {
            get
            {
                object sizePercent = ViewState["SizePercent"];
                return (sizePercent == null) ? 50 : (int)sizePercent;
            }
            set
            {
                ViewState["SizePercent"] = value;
            }
        }

SizePercent属性的默认值为50,即默认显示Map最大大小的四分之一,当SizePercent为负整数时当作正整数对待,当其大于100时,对100求余.

二. 当Map的Zoom改变的时候我想作出一些反应,如改变Map上的Maker和InfoWindow集合.

详细来讲,我们需要把Zoom的值域划分为几个区间,如: 当Zoom的值

为1到5时,为World区间;
为6到10时,为Contry区间;
为11到15时,为City区间;
为15到20时,为Street区间.

当Zoom的值从一个区间到另一个区间时,Map上的元素将相应地改变,如Zoom值

在World区间时,Map上的Maker和InfoWindow集合显示某个大陆的销售信息;
在Contry区间时,显示某个国家的销售信息;
在City区间时,显示某个城市的销售信息;
在Street区间时,显示某个商区的销售信息.

要实现这个功能,我们得有个整形数组来存储Zoom的值区间的临界值,我们设置这个属性为ZoomBound.为了简便起见,我没有使用强类型的集合,而是使用ArrayList作为这个属性的类型.

        private ArrayList _zoomBound;
        [
        Bindable(true),
        Category("Google"),
        Description("The zoom bounds."),
        DesignerSerializationVisibility(DesignerSerializationVisibility.Content),
        Editor("Int32", typeof(UITypeEditor)),
        PersistenceMode(PersistenceMode.InnerProperty)
        ]
        public virtual ArrayList ZoomBound
        {
            get
            {
                if (_zoomBound == null)
                {
                    _zoomBound = new ArrayList();
                }
                return _zoomBound;
            }
        }

我暂时没有实现ZoomBound属性的自定义状态管理(下篇文章将会实现)。
除了前面我给其他的属性 (Property)添加的属性 (Attribute)外,我还给ZoomBound属性添加了以下设计时属性 (Attribute)，为实现设计时系列化和持久性，必须将这些属性 (Attribute) 应用于集合属性 (Property)：

• DesignerSerializationVisibilityAttribute   通过设置Content参数，可以指定可视化设计器应对属性的内容进行序列化。在该示例中，此属性包含整数。

• PersistenceModeAttribute   通过传递InnerProperty参数，可以指定可视化设计器将属性 (Property) 保存在控件的标记中。

通过使用EditorAttribute将集合编辑器与ZoomBound集合属性关联.
另外,不用为集合属性指定DefaultValueAttribute.
关于可用于自定义服务器控件的元数据属性方面的内容,可以参考自定义服务器控件的元数据属性.
关于服务器控件的集合属性方面的内容,可以参考服务器控件的集合属性.

我们还需要一个布尔型的属性来决定是否启用此功能,这个属性如下:

        [
        Bindable(true),
        Category("Google"),
        DefaultValue(false),
        Description("Gets or sets a value indicating whether [enable zoom bounds].")
        ]
        public virtual bool EnableZoomBound
        {
            get
            {
                object enableZoomBound = ViewState["EnableZoomBound"];
                return (enableZoomBound == null) ? false : (bool)enableZoomBound;
            }
            set
            {
                ViewState["EnableZoomBound"] = value;
            }
        }

三. 我们有时还需要让Map上的InfoWindows自动的一个接一个地循环显示,这时Map也就需要动起来以显示位于不同纬度和经度上的InfoWindow.

要实现此功能,只需要添加一个属性:ScrollInterval,它决定是否自动循环显示InfoWindows(为0时不循环显示)以及循环显示的间隔.这个属性如下:

        [
        Bindable(true),
        Category("Google"),
        DefaultValue(0),
        Description("Gets or sets the scroll interval.")
        ]
        public virtual int ScrollInterval
        {
            get
            {
                object sizePercent = ViewState["ScrollInterval"];
                return (sizePercent == null) ? 0 : (int)sizePercent;
            }
            set
            {
                ViewState["ScrollInterval"] = value;
            }
        }

四. 我们还需要在Map上有一个可以拖动的Maker,可以显示或不显示这个Maker,可以通过拖动这个Maker设定两个文本框或Lable的值分别为这个Maker的当前纬度和精度值.

要实现这个功能,我们需要添加三个属性:ShowDraggableMarker,LongTextBox,LatTextBox,这三个属性如下:

        [
        Bindable(true),
        Category("Google"),
        DefaultValue(false),
        Description("Gets or sets a value indicating whether [show draggable marker].")
        ]
        public virtual bool ShowDraggableMarker
        {
            get
            {
                object showDraggableMarker = ViewState["ShowDraggableMarker"];
                return (showDraggableMarker == null) ? false : (bool)showDraggableMarker;
            }
            set
            {
                ViewState["ShowDraggableMarker"] = value;
            }
        }

        [
        Bindable(true),
        Category("Google"),
        DefaultValue(""),
        Description("The draggable marker related LongTextBox.")
        ]
        public virtual string LongTextBox
        {
            get
            {
                String s = (String)ViewState["LongTextBox"];
                return (s == null) ? String.Empty : s;
            }
            set
            {
                ViewState["LongTextBox"] = value;
            }
        }

        [
        Bindable(true),
        Category("Google"),
        DefaultValue(""),
        Description("The draggable marker related LatTextBox.")
        ]
        public virtual string LatTextBox
        {
            get
            {
                String s = (String)ViewState["LatTextBox"];
                return (s == null) ? String.Empty : s;
            }
            set
            {
                ViewState["LatTextBox"] = value;
            }
        }

好了,后面的文章我将编写GoogleInfoWindow,GoogleMarker类及相应的集合类,并给GoogleMap类添加相应的集合属性及其他属性.