摘要：在定義時的方法中的第三個參數，實際上是文件中元素的內部呈現。但是除了元素的各種屬性意外，還有幾個特殊的屬性和方法在定義時，其中一個接口中的第一個參數，是內部訪問的直接媒介接口對象。數組中的元素也是繼承與，并且額外提供了和屬性。

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上問題