您的位置:首页> 日志> 动易系统 正文

子栏目实现区域分布地图显示信息

 

第一:根据效果图分析客户实际需求:

(1)客户根据实际地图形式展示出该市所有地区!

(2)然后与它有关联的则添加需要的内容,这导致并不是所有地区都有信息内容!

(3)从中可以看出,地图中地区名字前面有显著的标志,当红五角心时有内容,蓝色圆心时无内容!

(4)有内容则有鼠标点击效果,点击后弹出该地区所添加的信息!点击其它有信息的地区时上一个则隐藏!

 

第二:现在根据需求然后结合我们的系统,如何要实现这个目标就是功能实现并又方便客户使用!

第三:结合动易系统,个人认为只有用子栏目形式来实现更为妥当,所有地区名字则为栏目名称,

            学校信息则新增内容模型,特意增加学校logo上传、微信图片上传、学校名、学校链接、电话、地址、特色专业 字段,从而方便客户能像添加文章一样方便而易懂得添加内容!

 

综上所述,就下定决定实现它吧,

实现过程分几步:

第一步:判断子栏目是否有内容,这个默认没有标签可以通过修改“子栏目列表”标签实现:

代码如下:

SELECT TOP @outputQty (SELECT count(GeneralID)  as countNum FROM PE_CommonModel 
where NodeID =PE_Nodes.NodeID and Status=99) as num, NodeID, NodeName,NodeIdentifier,OpenType,arrChildID,NodePicUrl FROM PE_Nodes WHERE 
NodeID NOT IN(
SELECT TOP @startrow NodeID FROM PE_Nodes WHERE ParentID = @parentid 
<xsl:if test="$showOnMenu='true'">
AND ShowOnMenu = 1 
</xsl:if>
AND PurviewType != 3  ORDER BY RootID, OrderID 
AND ParentID = @parentid 
<xsl:if test="$showOnMenu='true'">
AND ShowOnMenu = 1 
</xsl:if>
AND PurviewType != 3  ORDER BY RootID, OrderID 
 
其中加入了
(SELECT count(GeneralID)  as countNum FROM PE_CommonModel 
where NodeID =PE_Nodes.NodeID and Status=99) as num,
这个sql 来判断这个栏目是否有数据!
 
 
 

这样就做好了一个栏目标签。

 

第二步:制作“PE地图循环数据”循环出所有子栏目的数据,供显示;

制作很简单,将上面的循环体修改一下,如下图:

 

第三步,根据结果写js效果吧!

完工!

 

实际效果链接