Highcharts - модуль экспорта - PullRequest
       23

Highcharts - модуль экспорта

12 голосов
/ 24 августа 2011

Я использую старшие диаграммы для генерации графических данных, извлеченных из базы данных.

У меня проблемы с использованием модуля экспорта. Я включил экспортирующую собственность:

exporting{
  enabled:true
}

но кнопки не появляются ...

Я также связал файл exporting.js с файлом ... кнопки не появляются ..

Кто-нибудь еще имел эту проблему?

EDIT:

Вот код:

$.ajax({
               type:"POST",
               url: "retrievechartdata.php",
           data: {questionId:qId, questionIdTwo:qIdTwo, title:title, titleTwo:titleTwo, from:from, to:to},
               dataType: "json",
               success: function(data) {
         //$("#response").html("<div class='successMessage'>"+ data.valuesTwo +"</div>");   
                   var maxY = parseInt(data.max) + 1;          
                   var minY = parseInt(data.min);          

           if(minY > 0){
             minY = 0;
           }else{
             minY -= 1;
           }

           var cdata = new Array();  
           cdata= data.values.split(',');  
           for(var i=0;i<cdata.length;i++)  
           {  
             cdata[i]= parseInt(cdata[i]);  
           } 
           var leg = false;
           var title = data.questionTitle;
           if(data.valuesTwo != "FALSE"){
             leg = true;
             title += " & "+data.questionTitleTwo; 
             var cdataTwo = new Array();  
             cdataTwo = data.valuesTwo.split(',');  
             for(var i=0;i<cdataTwo.length;i++)  
               {  
             cdataTwo[i]= parseInt(cdataTwo[i]);  
               } 
           }
              chart = new Highcharts.Chart({
      chart: {
         renderTo: 'container',
         zoomType: 'x',
         spacingRight: 20
      },
      credits: {
        enabled: false
      },
       title: {
         text: title
      },
       subtitle: {
         text: document.ontouchstart === undefined ?
            'Click and drag in the plot area to zoom in' :
            'Drag your finger over the plot to zoom in'
      },
      xAxis: {
         type: 'datetime',
         maxZoom: 14 * 24 * 3600000, // fourteen days
         lineWidth: 1,
         lineColor: '#999999',
         title: {
            text: 'Date' 
         }
      },
      yAxis: {
         title: {
            text: data.questionTitle
         },
     labels: {
        y: 2
     },
     lineWidth: 1,
         lineColor: '#999999',
         gridLineWidth: 1,
     gridLineColor: '#eaeaea',
     min: minY,
     max: maxY, 
         startOnTick: false,
         showFirstLabel: false
      },
      tooltip: {
         shared: true               
      },
      legend: {
         enabled: leg
      },
      plotOptions: {
         area: {
            Color: {
               linearGradient: [0, 0, 0, 600],
               stops: [
                  [0, 'rgb(69, 114, 167)'],
                  [1, 'rgba(2,0,0,0)']
               ]
            },
            lineWidth: 1,           
            marker: {
               enabled: false,
               states: {
                  hover: {
                     enabled: true,
                     radius: 5
                  }
               }
            },
            shadow: false,
            states: {
               hover: {
                  lineWidth: 1                  
               }
            }
         }
      },

      series: [{
         type: 'spline',
         name: data.questionTitle,
         pointInterval: 24 * 3600 * 1000,
     pointStart: Date.UTC(data.year, data.month, data.day),
     data: cdata,
     lineColor:  '#f6a828',
     color: '#418ed6'
      },
      {
         type: 'spline',
         name: data.questionTitleTwo,
         pointInterval: 24 * 3600 * 1000,
     pointStart: Date.UTC(data.year, data.month, data.day),
     data: cdataTwo,
     lineColor:  '#808080',
     color: '#ff0000'
      }],
      exporting: {
        enabled: true
      }
   })

Ответы [ 2 ]

15 голосов
/ 24 августа 2011

Какую версию Highcharts вы используете?Какая версия jQuery?

В настоящее время это v2.1.6, я рекомендую вам использовать последнюю версию, потому что они постоянно исправляют ошибки, добавляют новые функции и т. Д.

До v2.0 тамподдержка экспорта не поддерживается

Единственное, что вам нужно сделать, чтобы заставить работать модуль экспорта, это:

1- Первое: Добавить скрипт jsпосле скрипта highcharts, например:

    ...
    <script type="text/javascript" src="../js/highcharts.js"></script>
    <!-- 1b) Optional: the exporting module -->
    <script type="text/javascript" src="../js/modules/exporting.js"></script>
    ...

Модуль экспорта включен по умолчанию, поэтому вам не нужно размещать код, который вы разместили, поэтому вы можете удалить его:

exporting{
  enabled:true
}

2- Второе: Обязательно правильно опубликуйте файл exporting-server/index.php.

Вот что читается в официальной документации об установке модуля экспорта:

  1. Модуль экспорта

Начиная с версии 2.0 для Highcharts доступен модуль экспорта, который позволяет пользователям загружать изображения или PDF-файлы ваших диаграмм.Этот модуль состоит из дополнительного файла JavaScript, exporting.js и модуля веб-службы или сервера, написанного на PHP.Highslide Software предлагает бесплатный экспортный веб-сервис.Если вы включите модуль экспорта в свои диаграммы, в правом верхнем углу появятся две кнопки.Одна кнопка печатает график, что делается только на стороне клиента.Другая кнопка обрабатывает экспорт.По умолчанию SVG-представление диаграммы отправляется POST в http://export.highcharts.com,, где она преобразуется с помощью конвертера Apache Batik в PDF, PNG или JPEG.

См. Навигационные и экспортные справочные элементы дляполная документация для доступных вариантов.Также см. «Методы и свойства» в справочнике для членов, выпущенных для экспорта.

Здесь вы можете увидеть параметры конфигурации модуля экспорта: http://www.highcharts.com/ref/#exporting

Надеюсь, это поможет вам.

0 голосов
/ 10 сентября 2014

Убедитесь, что тег сценария имеет

type = "text / javascript"

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...