var dataModel = new ht.DataModel();
var graphView = new ht.graph.GraphView(dataModel);

// 禁止平移
graphView.setPannable(false);
// 将其重载为空函数，禁止滚动
graphView.handleScroll = function() {};
// 禁用touch上双指操作缩放
graphView.handlePinch = function() {};
// 禁止拓扑上框选操作
graphView.setRectSelectable(false);
// 通过过滤器设置禁止拖动
graphView.setMovableFunc(function(data) { return false; });
// 后将组件加入到指定的 DOM 元素底下，不指定则加入到 document.body 下
graphView.addToDOM();
window.addEventListener('resize', function(e) { graphView.fitContent(); }, false);

var json = ht.Default.parse(text);
dataModel.deserialize(json);

var flag = true;
setInterval(function () {
　　changeAlarmColor(dataModel, 'Alarm1', flag);
　　changeAlarmColor(dataModel, 'Alarm2', flag);
　　changeAlarmColor(dataModel, 'Alarm3', flag);
　　changeAlarmColor(dataModel, 'Alarm4', flag);
　　flag = !flag;
}, 2000);

function changeAlarmColor(dataModel, tag, flag) {
    var tag = dataModel.getDataByTag(tag);
        if(flag) {
            tag.a('backgroundColor', 'rgb(138,40,18)');
            tag.a('progressiveColor', 'rgb(232,97,56)');
        } else {
            tag.a('backgroundColor', 'rgb(34,168,38)');
            tag.a('progressiveColor', 'rgb(82,222,133)');
        }
}

setInterval(function () {
　　changePumpState(dataModel, 'pump1');
　　changePumpState(dataModel, 'pump2');
　　changePumpState(dataModel, 'pump3');
}, 2500);

function changePumpState(dataModel, tag) {
　　var tag = dataModel.getDataByTag(tag);
　　var num = Math.floor(Math.random() * 3 + 1);
　　tag.a('status', num);
}

function changePumpState(dataModel, tag) {
　　var tag = dataModel.getDataByTag(tag);
　　var changeArr = [
　　　　{
　　　　　　instruction: 'Stopped',
　　　　　　instructionColor: 'rgb(234,0,0)',
　　　　　　backgroundColor: 'rgb(138,40,18)',
　　　　　　progressiveColor: 'rgb(232,97,56)',
　　　　　　status: 'FAULT'
　　　　},
　　　　{
　　　　　　instruction: 'Need to Run',
　　　　　　instructionColor: 'rgb(221,181,0)',
　　　　　　backgroundColor: 'rgb(29,143,32)',
　　　　　　progressiveColor: 'rgb(82,222,133)',
　　　　　　status: 'NO FAULT'
　　　　},
　　　　{
　　　　　　instruction: 'Running',
　　　　　　instructionColor: 'rgb(92,137,34)',
　　　　　　backgroundColor: 'rgb(29,143,32)',
　　　　　　progressiveColor: 'rgb(82,222,133)',
　　　　　　status: 'NO FAULT'
　　　　}
　　];
　　i = Math.floor(Math.random() * (changeArr.length - 1 + 1));
　　tag.a('instruction', changeArr[i].instruction);
　　tag.a('instructionColor', changeArr[i].instructionColor);
　　tag.a('backgroundColor', changeArr[i].backgroundColor);
　　tag.a('progressiveColor', changeArr[i].progressiveColor);
　　tag.a('status', changeArr[i].status);
}

setInterval(function () {
　　var tag = dataModel.getDataByTag('tank');
　　var num = Math.random() * 1;
　　ht.Default.startAnim({
　　　　duration: 500,
　　　　action: function(v, t){
　　　　　　tag.a('progress', num * v);
　　　　}
　　});
}, 3000);

<script>
　　htconfig = {
　　　　Color: {
　　　　　　label: '#000',
　　　　　　labelSelect: '#FFF'
　　　　},
　　　　Default: {
　　　　　　toolTipDelay: 100,
　　　　　　toolTipContinual: true
　　　　},
　　　　Style: {
　　　　　　'select.color': '#E74C3C',
　　　　　　'select.width': 0// 去掉默认选中样式（绿框）
　　　　}
　　};
</script>
<script src="ht.js"></script>