krpano各种Objects

摘要：在定义时的方法中的第三个参数，实际上是文件中元素的内部呈现。但是除了元素的各种属性意外，还有几个特殊的属性和方法在定义时，其中一个接口中的第一个参数，是内部访问的直接媒介接口对象。数组中的元素也是继承与，并且额外提供了和属性。

krpano中有好多object，krpano Plugin Interface, krpano Plugin Object, krpano Base Object, krpano Interface Object, krpano Javascript Interface... 真心觉得官方文档的组织形式太晦涩了，所以这里整理下

定义krpano plugin的时候需要遵循的接口。
http://krpano.com/docu/plugininterface

定义krpano插件的时候，基本上就是定义一个叫krpanoplugin的function，这个function会在krpano加载插件的时候调用到。

krpanoplugin的方法里，有几个特殊的地方：

this指向当前的plugin对象

需要按照krpano Plugin Interface，在this下定义并实现几个方法。registerplugin, unloadplugin必选；onresize可选

registerplugin当krpano要去加载该插件的时候被调用，调用时会传三个参数：依次是krpano Interface Object, plugin path, krpano Plugin Object

例如：

/*
    krpano HTML5 Javascript Plugin Example
*/

function krpanoplugin () {
    var local = this;   // save the "this" pointer from the current plugin object
    var krpano = null;  // the krpano and plugin interface objects
    var plugin = null;

    var xml_value = 100.0;   // the value for a custom xml attribute

    // registerplugin - startup point for the plugin (required)
    // - krpanointerface = krpano interface object
    // - pluginpath = the fully qualified plugin name (e.g. "plugin[name]")
    // - pluginobject = the xml plugin object itself
    local.registerplugin = function (krpanointerface, pluginpath, pluginobject) {
        // get the krpano interface and the plugin object
        krpano = krpanointerface;
        plugin = pluginobject;

        // first - say hello
        krpano.trace(1, "hello from plugin[" + plugin.name + "]");

        // add plugin attributes
        plugin.registerattribute("mode", "normal");
        plugin.registerattribute("value", xml_value, value_setter, value_getter);

        // add plugin action (the attribute needs to be lowercase!)
        plugin.dosomething = action_dosomething;

        // optionally - add some graphical content:

        // register the size of the content
        plugin.registercontentsize(200,200);

        // use 100% width/height for automatic scaling with the plugin size
        var text = document.createElement("div");
        text.style.cssText = "width:100%;height:100%;"+
            "display:flex;color:white;background:rgba(10,50,100,0.5);"+
            "align-items:center;justify-content:center;text-align:center;";
        text.innerHTML = "HTML5
TEST PLUGIN
click me";

        // the plugin "sprite" variable is the internal html element of the plugin
        plugin.sprite.appendChild(text);
    }

    // unloadplugin - exit point for the plugin (optionally)
    // - will be called from krpano when the plugin will be removed
    // - everything that was added by the plugin should be removed here
    local.unloadplugin = function() {
        plugin = null;
        krpano = null;
    }

    // onresize (optionally)
    // - width,height = the new size for the plugin
    // - when not defined then only the krpano plugin html element will be sized
    local.onresize = function(width,height) {
        // not used in this example
        // the plugin content will resize automatically because
        // of the width=100%, height=100% CSS style
        return false;
    }

    function value_setter(newvalue) {
        if (newvalue != xml_value) {
            krpano.trace(1, ""value" will be changed from " + xml_value + " to " + newvalue);
            xml_value = newvalue;
        }
    }

    function value_getter () {
        return xml_value;
    }

    function action_dosomething () {
        // trace the given action arguments
        krpano.trace(1, "dosomething() was called with " + arguments.length + " arguments:");
        for (var i=0; i < arguments.length; i++)
            krpano.trace(1, "arguments[" + i + "]=" + arguments[i]);

        // trace some infos
        krpano.trace(1, "mode=" + plugin.mode);
        krpano.trace(1, "lookat=" + krpano.view.hlookat + " / " + krpano.view.vlookat);

        // call krpano actions
        plugin.accuracy = 1;    // disable grid fitting for smoother size changes
        krpano.call("tween(width|height, 500|100)", plugin);
        krpano.call("lookto(0,0,150); wait(1.0); lookto(90,0,90);");
        krpano.call("tween(width|height, 200|200)", plugin);
    }
}

在定义krpano plugin时，其中一个接口registerplugin中的第三个参数，指代plugin对象本身。
http://krpano.com/docu/plugininterface/#plugininterface

在plugin定义时的registerplugin方法中的第三个参数krpano plugin object，实际上是xml文件中元素的内部呈现。但是除了元素的各种属性意外，plugin object还有几个特殊的属性和方法：

sprite

HTML5 - The HTML

1. set(variable, value)
2. get(variable)
3. call(actioncode, callerobject*)
4. trace(code, message)
5. parsepath(path)
6. loadFile(file, donecallback, errorcallback*)
7. loadImage(fiel, donecallback, errorcallback*)
8. screentosphere(x, y)
9. spheretoscreen(v, h)

1. registerattribute(attributename, defaultvalue, setter*, getter*)
2. removeattribute(attributename)
3. getattributes()
4. createobject(objectname)
5. removeobject(objectname)
6. createarray(arrayname)
7. removearray(arrayname)

var kr = document.getElementById("krSWFObject");
var hotspots = kr.get("hotspot");           // hotspots就是krpano array
var aHotspot = hotspot["spot1"];            // aHotspot就是krpano array item

1. count
2. createItem(name or index)
3. getItem(name or index)
4. renameItem(oldname:String, newname:String)
5. removeItem(name or index) / removearrayitem(name or index)
6. getArray()

1. name
2. count 

1. set(variable, value)
2. get(variable)
3. call(action)
4. spheretoscreen(h, v)
5. screentosphere(x, y)

ygjack: 可以看到这个接口是krpano Interface Object提供接口的子集

var kr = document.getElementById("krpanoSWFObject"); // "krpanoSWFObject"是默认id

• 上一篇：获取元素css值
• 下一篇：JAVA与JS在MD5上问题