[pmwiki-users] Prevent the "html" elements of returned values from pagelist

[Petko Yotov]

On 17/11/2019 07:02, Christopher Cox wrote:
> My solution.  I created a page specific php file
> (Test.UsersByDepartment.php) and inside it I put:
> 
> <?php
> global $BlockMarkups;
> $BlockMarkups['p'] = array('','','',0);

Didn't this mess your other page content, and the sidebar/header/footer?

> 
> This got rid of the extraneous <p> around the (:pagelist wrap=none....

There is wrap=inline.

> This is so I can use a pagelist to produce graphing data.  See:
> https://endlessnow.com/wiki2/Test/UsersByDepartment

This is not a reply to your question, but another solution to your 
problem.

In a case of a JavaScript-generated chart, I would let the pagelist 
output an HTML table, then I would parse the data from the table with 
JavaScript to feed it to the Chart API.

(There is another benefit, people with disabled JavaScript or with 3rd 
party blocking would still see the table with the numbers.)

In the wiki, generated by a pagelist, something like:

   >>id=chart_div height=500px<<
   >><<
   || border=1 class="simpletable sortable pie-chart"
   ||! Caption of the table !||
   ||! Department ||! Users ||

These above are the headers and the caption, could be in a (:template 
first:) section.

Then the data, output by (:template each:) or in your case (:template 
last {=$:department}:)

   ||Sales || 184||
   ||IT    || 116||
   ||HR    ||  21||


Then in JavaScript:

   // your lines
   google.charts.load('current', {'packages':['corechart']});
   google.charts.setOnLoadCallback(drawChart);

   function drawChart() {
     // get the data table
     var pietable = document.querySelector("table.pie-chart");

     // earlier
     var options = {
       'animation':{
         'duration': 1000,
         'easing': 'out',
         'startup': true,
       }
     };

     // set the chart title from the table caption (if exists)
     var caption = pietable.querySelector('caption');
     if(caption) options.title = caption.textContent;

     var rows = pietable.querySelectorAll('tr');
     var depts_users = [ ];

     // get the names and numbers from the table
     // start from 1 not 0 to skip the headers
     for(var r=1; r<rows.length; r++) {
       var cells = rows[r].querySelectorAll('td,th');
       depts_users.push([ cells[0].textContent, 
parseInt(cells[1].textContent) ]);
     }

     // your lines
     var data = new google.visualization.DataTable();
     data.addColumn('string', 'A');
     data.addColumn('number', 'B');

     // this, instead of the raw pagelist
     data.addRows(depts_users);

     // your lines
     var chart = new 
google.visualization.PieChart(document.getElementById('chart_div'));
     chart.draw(data, options);

     // optionally: hide the table (I wouldn't)
     // pietable.style.display = 'none';
   }

Petko


P.S. As I don't have your (:snhtmlend:) markup, here is how I loaded the 
scripts. In local/Main.PieChart.php:

   <?php
   $HTMLHeaderFmt['pie-chart'] = '
     <script type="text/javascript" 
src="https://www.gstatic.com/charts/loader.js"></script>
     <script type="text/javascript" 
src="$PubDirUrl/pie-chart.js"></script>
   ';

With the pie-chart.js file containing the above code, placed in pub/.


> On 11/16/19 10:11 PM, Christopher Cox wrote:
>> That didn't format well.  I figured out some thing I had wrong.  Added 
>> wrap=none to get id of the div.  Found my extraneous newliune in my 
>> pagelist.  What I'm trying to do is embed the output of the pagelist 
>> in the middle of raw html on a page to draw a chart.  But now I'm down 
>> to:
>> 
>> <p>['', 43],
>> ['Sales', 174],
>> ['Development', 46],
>> ['IT', 116],
>> ['Customer Support', 145],
>> ['HR', 21],
>> ['Product Management', 28],
>> ['Finance', 35],
>> </p>
>> 
>> I just need to somehow get rid of the paragraph around it all.
>> 
>> 
>> On 11/16/19 9:54 PM, Christopher Cox wrote:
>>> Is there any way to just have the values and not the html from a 
>>> pagelist (as in what gets returned in the page source)?
>>> 
>>> <div class='fpltemplate'><pclass='vspace'>['Sales', 174], </p> 
>>> <pclass='vspace'>['Development', 46], </p> <pclass='vspace'>['IT', 
>>> 116], </p> <pclass='vspace'>['Customer Support', 145], </p> 
>>> <pclass='vspace'>['HR', 21], </p> <pclass='vspace'>['Product 
>>> Management', 28], </p> <pclass='vspace'>['Finance', 35], </p> </div> 
>>> Instead, I'd like just: ['Development', 46], ['IT', 116], etc...
>>> 
>>