首页 / 浏览问题 / 云GIS / 问题详情
柱状专题图加载不出来
13EXP 2017年05月17日
代码如下:

<!DOCTYPE>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>统计专题图</title>
<style type="text/css">
body{
margin: 0;
overflow: hidden;
background: #fff;
}
#map{
position: relative;
height: 510px;
border:1px solid #3473b7;
}
#toolbar {
position: relative;
padding-top: 5px;
padding-bottom: 10px;
}
</style>
<link href='./css/bootstrap.min.css' rel='stylesheet' />
<link href='./css/bootstrap-responsive.min.css' rel='stylesheet' />
<script src='libs/SuperMap.Include.js'></script>
<script type="text/javascript">
    var map, local, baseLayer, layersID, themeLayer,
 url = "http://localhost:8090/iserver/services/map---0--China400/rest/maps/HBMap@China400";
    function init() {
        map = new SuperMap.Map("map", { controls: [
                      new SuperMap.Control.ScaleLine(),
                      new SuperMap.Control.PanZoomBar(),
                      new SuperMap.Control.LayerSwitcher(),
                      new SuperMap.Control.Navigation({
                          dragPanOptions: {
                              enableKinetic: true
                          }
                      }),
                      ]
        });
        baseLayer = new SuperMap.Layer.TiledDynamicRESTLayer("河北省专题图", url, { transparent: true, cacheEnabled: true }, { maxResolution: "auto" });
        baseLayer.events.on({ "layerInitialized": addLayer });
    }

    function addLayer() {
        map.addLayer(baseLayer);
       
        map.setCenter(new SuperMap.LonLat(13133579.91, 5012957.79), 0);
        map.allOverlays = true;
    }
    //对 Jingjin 数据源的 BaseMap_R 数据集两个字段 Pop_Rate95 和 Pop_Rate99 制作统计专题图
    function addThemeGraph() {
        removeTheme();
        //创建统计专题图对象,ThemeGraph 必设 items。
        //专题图参数 ThemeParameters 必设 theme(即以设置好的分段专题图对象)、dataSourceName 和 datasetName
        var style1 = new SuperMap.REST.ServerStyle({
            fillForeColor: new SuperMap.REST.ServerColor(92, 73, 234),
            lineWidth: 0.1
        }),
            style2 = new SuperMap.REST.ServerStyle({
                fillForeColor: new SuperMap.REST.ServerColor(211, 111, 240),
                lineWidth: 0.1
            }),
            item1 = new SuperMap.REST.ThemeGraphItem({
                caption: "1992-1995人口增长率",
                graphExpression: "FLOWER_1995",
                uniformStyle: style1
            }),
            item2 = new SuperMap.REST.ThemeGraphItem({
                caption: "1995-1999人口增长率",
                graphExpression: "FLOWER_2000",
                uniformStyle: style2
            }),
            themeGraph = new SuperMap.REST.ThemeGraph({
                items: new Array(item1, item2),
                barWidth: 0.03,
                graduatedMode: SuperMap.REST.GraduatedMode.SQUAREROOT,
                overlapAvoided: true,
                graphAxes: new SuperMap.REST.ThemeGraphAxes({
                    axesDisplayed: true
                }),
                graphSize: new SuperMap.REST.ThemeGraphSize({
                    maxGraphSize: 1,
                    minGraphSize: 0.35
                }),
                graphText: new SuperMap.REST.ThemeGraphText({
                    graphTextDisplayed: true,
                    graphTextFormat: SuperMap.REST.ThemeGraphTextFormat.VALUE,
                    graphTextStyle: new SuperMap.REST.ServerTextStyle({
                        sizeFixed: true,
                        fontHeight: 9,
                        fontWidth: 5
                    })
                }),
                graphType: SuperMap.REST.ThemeGraphType.BAR3D
            }),

                    //专题图参数对象
            themeParameters = new SuperMap.REST.ThemeParameters({
                themes: [themeGraph],
                dataSourceNames: ["China400.1"],
                datasetNames: ["County_R_1"]
            }),

                    //与服务端交互
            themeService = new SuperMap.REST.ThemeService(url, {
                eventListeners: {
                    "processCompleted": ThemeCompleted,
                    "processFailed": themeFailed
                }
            });
                    themeService.processAsync(themeParameters);
                }

    //显示专题图。专题图在服务端为一个资源,每个资源都有一个 ID 号和一个 url
    //要显示专题图即将资源结果的 ID 号赋值给图层的 layersID 属性即可
    function ThemeCompleted(themeEventArgs) {
        if (themeEventArgs.result.resourceInfo.id) {

            themeLayer = new SuperMap.Layer.TiledDynamicRESTLayer("京津地区人口分布图_专题图",
url, { cacheEnabled: false, transparent: true,
    layersID: themeEventArgs.result.resourceInfo.id
}, { maxResolution: "auto" });
            themeLayer.events.on({ "layerInitialized": addThemelayer });

        }
    }
    function addThemelayer() {
        map.addLayer(themeLayer);
    }

    function themeFailed(serviceFailedEventArgs) {
        //doMapAlert("",serviceFailedEventArgs.error.errorMsg,true);
        alert(serviceFailedEventArgs.error.errorMsg);
    }

    //移除专题图图层
    function removeTheme() {
        if (map.layers.length > 1) {
            map.removeLayer(themeLayer, true);
        }
    }
</script>
</head>
<body onload="init()">
<div id="toolbar">
<input type="button" class="btn" value="创建专题图" onclick="addThemeGraph()" />
<input type="button" class="btn" value="移除专题图" onclick="removeTheme()" />
</div>
<div id="map"></div>
</body>
</html>

在图层管理器上,可以看到专题图的图层能够加载出来,但是没有对应的柱状图,这是什么原因?求赐教

2 个回答

1. 检查数据源名是否叫 "China400.1"

2. 检查数据及其他参数

3. 访问 http://localhost:8090/iserver/services/map---0--China400/rest/maps/HBMap@China400/tempLayersSet 查看生成的临时图层。
1,780EXP 2017年05月17日

我查看了这个临时图层,但是不清楚什么情况算是正确的,您帮忙看一下,是这种的吗?

map = new SuperMap.Map("map", { controls: [
                      new SuperMap.Control.ScaleLine(),
                      new SuperMap.Control.PanZoomBar(),
                      new SuperMap.Control.LayerSwitcher(),
                      new SuperMap.Control.Navigation({
                          dragPanOptions: {
                              enableKinetic: true
                          }
                      }),
                      ],
                      allOverylays:true
        });

或者把
map.allOverlays = true;
写到第一次添加图层之前。

注意看LayerSwitcher里的图层是底图还是叠加层,区别就是底图是单选(圆形选择框),叠加层是多选(方形选择框)

这是我在iserver中的临时图层,临时图层里就没有内容,请问问题可能出现在哪里

抱歉,略忙
那么就只能怀疑是数据和参数对不上的问题了,在iDesktop里打开工作空间或数据源看下
China400.1数据源下County_R_1数据集的坐标系和地图是否一致、有没有FLOWER_1995等字段,字段类型是否为数值型,比如 int、float、double。
建议先在iDesktop里按照上述js代码填的参数创建一个统计专题图,看下是否正常。
你有引用柱状图的js么   Bar.js?
8EXP 2017年12月20日
...