File "chart-product-level-api.html"

Full Path: /home/analogde/www/php/integrations/django/samples/fusioncharts/templates/chart-product-level-api.html
File size: 3.68 KB
MIME-type: text/html
Charset: utf-8

 
Open Edit   Advanced Editor   Back 
<!DOCTYPE html>
<html>
<head>
    <title>FC-python wrapper</title>
    <style>
        .button {
            display:inline-block;
            margin:5px;
            padding: 4px 12px;
            margin-bottom: 0;
            font-size: 14px;
            line-height: 20px;
            color: #333;
            text-align: center;
            text-shadow: 0 1px 1px rgba(255,255,255,0.75);
            vertical-align: middle;
            cursor: pointer;
            background-color: #f5f5f5;
            background-image: -moz-linear-gradient(top,#fff,#e6e6e6);
            background-image: -webkit-gradient(linear,0 0,0 100%,from(#fff),to(#e6e6e6));
            background-image: -webkit-linear-gradient(top,#fff,#e6e6e6);
            background-image: -o-linear-gradient(top,#fff,#e6e6e6);
            background-image: linear-gradient(to bottom,#fff,#e6e6e6);
            background-repeat: repeat-x;
            border: 1px solid #ccc;
            border-color: #e6e6e6 #e6e6e6 #bfbfbf;
            border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
            border-bottom-color: #b3b3b3;
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff',endColorstr='#ffe6e6e6',GradientType=0);
            filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
            -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
            -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
        }
    </style>
        
<!-- If you are using downloaded FusionCharts libraries, uncomment the below code   -->
<!--

	{% load static %} 
   	<script type="text/javascript" src="{% static "fusioncharts/fusioncharts.js" %}"></script>
   	<script type="text/javascript" src="{% static "fusioncharts/themes/fusioncharts.theme.fusion.js" %}"></script>
	
-->

   <script type="text/javascript" src="//cdn.fusioncharts.com/fusioncharts/latest/fusioncharts.js"></script>
   <script type="text/javascript" src="//cdn.fusioncharts.com/fusioncharts/latest/themes/fusioncharts.theme.fusion.js"></script>
    <script>
        changeCaption = function(){
          FusionCharts("ex1").setChartAttribute('caption', 'Test Caption');
        }
        changeXAxisName = function(e){
          FusionCharts("ex1").setChartAttribute('xAxisName', 'Test X-Axis');
        }
        changeYAxisName = function(e){
          FusionCharts("ex1").setChartAttribute('yAxisName', 'Test Y-Axis');
        }
        reset = function(e){
          FusionCharts("ex1").setChartAttribute('caption', 'Countries With Most Oil Reserves [2017-18]');
          FusionCharts("ex1").setChartAttribute('xAxisName', 'Country');
          FusionCharts("ex1").setChartAttribute('yAxisName', 'Reserves (MMbbl)');
        }
    </script>
</head>
<body style="font-family:'Helvetica Neue', Arial; font-size: 16px;">
	<h3>{{ chartTitle|safe }}</h3>
	<div align="center"  id="chart-1">{{ output|safe }}</div>
	<br/>
	<div>
            <p align="center" id ="message"></p>
        </div>

        <div id="controllers" align="center" style="font-family:'Helvetica Neue', Arial; font-size: 14px;">
                <input type="button" class="button" onClick="changeCaption()" value='Change Caption: Test Caption'/>
                <input type="button" class="button" onClick="changeXAxisName()" value='Change X-Axis Name: Test X-Axis'/>
                <input type="button" class="button" onClick="changeYAxisName()" value='Change Y-Axis Name: Test Y-Axis'/>
                <input type="button" class="button" onClick="reset()" value='Reset'/>
        </div> 


	<br/>
	<a href="/">Back</a>
</body>
</html>