1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Time Plot BBCode 1.0

Create a tiime plot to show daily statistics

  1. simunaqv
    [​IMG]

    Hello,
    I wanted to find a way to share the forum statistics on the public forum. I decided to create a time plot bbcode for this purpose. Since xenForo already includes the jquery's Flot plugin for plotting admin side statistics, I decided to make use of this plugin and I have created an add-on that makes it possible to show plots of time series data using a plot bbcode. I am sharing this add-on here. Some of you might find it useful

    Installation:
    Upload the contents of the upload folder to the root of you forum and then import the add-on's xml file.

    Use:
    You will need to do some manual work in order to use this bbcode. Following are the steps:
    1. View the source of the page that is displaying the forum statistics.
    2. Copy the part that contains the data to be displayed.
    3. Edit the copied text and apply the plot bbcode.

    Example:
    Following data was copied from the page source

    Code:
    {
            //    yaxis: 1,
                label: "Posts",
                data: [[1321920000000,311],[1322006400000,481],[1322092800000,487],[1322179200000,0],[1322265600000,751],[1322352000000,548],[1322438400000,521],[1322524800000,385],[1322611200000,602],[1322697600000,651],[1322784000000,712],[1322870400000,859],[1322956800000,534],[1323043200000,863],[1323129600000,956],[1323216000000,1170],[1323302400000,830],[1323388800000,744],[1323475200000,571],[1323561600000,740],[1323648000000,714],[1323734400000,749],[1323820800000,737],[1323907200000,566],[1323993600000,508],[1324080000000,494],[1324166400000,754]]
            },
     
            {
            //    yaxis: 2,
                label: "Post Likes",
                data: [[1321920000000,298],[1322006400000,322],[1322092800000,386],[1322179200000,0],[1322265600000,707],[1322352000000,447],[1322438400000,494],[1322524800000,333],[1322611200000,606],[1322697600000,734],[1322784000000,713],[1322870400000,787],[1322956800000,449],[1323043200000,909],[1323129600000,1025],[1323216000000,1285],[1323302400000,917],[1323388800000,870],[1323475200000,660],[1323561600000,954],[1323648000000,935],[1323734400000,903],[1323820800000,877],[1323907200000,772],[1323993600000,620],[1324080000000,700],[1324166400000,735]]
            }
    After preparation and use of the plot bbcode it looks like the following. It produces the plot as shown in the figure above.

    Code:
    [plot]
     
    label: "Posts"| data: [[1321920000000,311],[1322006400000,481],[1322092800000,487],[1322179200000,0],[1322265600000,751],[1322352000000,548],[1322438400000,521],[1322524800000,385],[1322611200000,602],[1322697600000,651],[1322784000000,712],[1322870400000,859],[1322956800000,534],[1323043200000,863],[1323129600000,956],[1323216000000,1170],[1323302400000,830],[1323388800000,744],[1323475200000,571],[1323561600000,740],[1323648000000,714],[1323734400000,749],[1323820800000,737],[1323907200000,566],[1323993600000,508],[1324080000000,494],[1324166400000,754]]
     
    label: "Post Likes"| data: [[1321920000000,298],[1322006400000,322],[1322092800000,386],[1322179200000,0],[1322265600000,707],[1322352000000,447],[1322438400000,494],[1322524800000,333],[1322611200000,606],[1322697600000,734],[1322784000000,713],[1322870400000,787],[1322956800000,449],[1323043200000,909],[1323129600000,1025],[1323216000000,1285],[1323302400000,917],[1323388800000,870],[1323475200000,660],[1323561600000,954],[1323648000000,935],[1323734400000,903],[1323820800000,877],[1323907200000,772],[1323993600000,620],[1324080000000,700],[1324166400000,735]]
     
    [/plot]
    lazy llama likes this.