世俱杯 2025

使用Flash地图控件AnyMap除了创建Self Drilldown Maps之外，还可以创建Self Drilldown Maps。下面看一下具体的示例——地图由两部分组成,第一部分将包含美国的地图,当用户单击特定的州——该州的地图就将在地图的第二部分进行显示。

》》》免费下载AnyMap最新版

创建仪表板布局

创建这样的地图需要使用AnyChart仪表板功能,仪表板将包含两个部分,以下面的代码进行创建:

<?xml version="1.0" encoding="UTF-8"?>
<anychart>
  <dashboard>
    <view type="Dashboard">
      <title>
        <text>USA Drilldown Map</text>
      </title>
      <hbox width="100%" height="100%">
        <view name="Country" type="Chart" width="50%" height="100%" source="USA" />
        <view name="State" type="Chart" width="50%" height="100%" />
      </hbox>
    </view>
  </dashboard>
</anychart>

为地图创建图表

以下面的代码进行创建:

<chart plot_type="Map" name="USA">
  <chart_settings>
    <title enabled="false" />
    <chart_background enabled="false" />
    <data_plot_background enabled="false" />
  </chart_settings>
  <data_plot_settings>
    <map_series source="usa/country/states.amap">
      <projection type="orthographic" />
      <undefined_map_region palette="Default">
        <actions>
          <action type="updateView" view="State" source_mode="internalData" source="State">
            <replace token="{$region_amap}">{%REGION_ID}</replace>
            <replace token="{$title}">{%REGION_NAME}</replace>
          </action>
        </actions>
      </undefined_map_region>
    </map_series>
  </data_plot_settings>
</chart>

这个操作定义意味着AnyChart应在"State"视图中加载"State"图表，并使用{%REGION_ID}和{%REGION_NAME}关键字参数来取代{$region_amap}和{$title}符号。

中间结果——具有一个定义地图的Dashboard

如果将描述的图表添加到仪表板，将会得到如下所示的地图：

州地图的XML

创建美国所有州的XML,需要使用一个参数化的XML,{$title}和{$region_amap}符号将会由主图表<action>进行处理：

<chart plot_type="Map" name="State">
  <chart_settings>
    <title>
      <text>{$title}</text>
    </title>
    <chart_background enabled="false" />
    <data_plot_background enabled="false" />
  </chart_settings>
  <data_plot_settings>
    <map_series source="usa/states/counties/{$region_amap}.amap">
      <projection type="orthographic" />
      <undefined_map_region palette="Default" />
    </map_series>
  </data_plot_settings>
</chart>

最终的Drilldown Dashboard

只需要将 "State" 图表添加到<charts>部分，仪表板就完成了