showi

<p>This plugin collect data attached to post/article via <strong>custom field</strong> and make<br />
chart of it.<br />
This plugin use <strong>Chart.js</strong> for chart drawing <a href="http://www.chartjs.org/" rel="nofollow ugc">ChartJs</a></p>
<p>Data are collected by looking for specific <em>custom field</em> attached to your<br />
post/page. You can change aggregation method, intervall…</p>
<p>See <a href="https://wordpress.org/plugins/wp-custom-field-chart/other_notes/" rel="ugc">usage</a></p>
<h3>Usage</h3>
<p>Edit your post/page in text mode and put some Javascript and a WordPress tag</p>
<h4>Minimum</h4>
<pre><code><script>
var mydata = { datasets: [{}]};
</script>
[custom_field_chart fields="humidity" js_data="mydata"]
</code></pre>
<p>For each field you need to put empty {} into datasets.</p>
<p>For two fields:</p>
<pre><code><script>
var mydata = {datasets: [{},{}]}
</script>
[custom_field_chart fields="humidity,temperature" js_data="mydata"]
</code></pre>
<p>But it’s pretty useless to put more than one field without different colors 🙂</p>
<h4>More</h4>
<pre><code><script>
var mydata = {
    datasets: [
        {
            label: "Humidity",
            fillColor: "rgba(255,73,0,1)",
            strokeColor: "rgba(255,73,0,1)",
            pointColor: "rgba(255,73,0,1)",
            pointStrokeColor: "#fff",
            pointHighlightFill: "#fff",
            pointHighlightStroke: "rgba(220,220,220,1)",
        },
        {
            label: "Temperature",
            fillColor: "rgba(255,73,0,1)",
            strokeColor: "rgba(255,73,0,1)",
            pointColor: "rgba(255,73,0,1)",
            pointStrokeColor: "#fff",
            pointHighlightFill: "#fff",
            pointHighlightStroke: "rgba(220,220,220,1)",
        },
    ]
};

var myopts = {
    pointDotRadius: 1,
    bezierCurveTension: 0.2,
    barStrokeWidth : 2,
    barValueSpacing : 2,
    barDatasetSpacing : 0,
};

// Optional...
jQuery(window).load(function() {
    Chart.defaults.global.responsive = true;
    Chart.defaults.global.animationEasing = "easeOutBounce";
    Chart.defaults.global.onAnimationComplete = function(){
        alert('Hello');
    }
});
// End optional
</script>

[custom_field_chart width="1000" height="300"
  kind="line" method="track" interval="day" interval_count="31" 
  fields="humidity,temperature" js_data="mydata" js_options="myopts"]
</code></pre>
<h4>Notes</h4>
<ol>
<li>js_data and js_options must reflect name given to your javascript variable.</li>
<li>Look at http://chartjs.org/ for documentation</li>
<li>You don’t need to supply labels and data (like in chartjs.org example) 🙂</li>
</ol>
<h3>Tag attributes</h3>
<p>= Required =<br />
1. <em>fields</em>: Custom field separate by comma<br />
1. <em>js_data</em>: Name of javascript variable holding chart datasets</p>
<h4>Optional</h4>
<ol>
<li><em>width</em>: Chart width (default: 400)</li>
<li><em>height</em>: Chart Height (default: 200)</li>
<li><em>method</em>: Aggregate method track, delta or cumulative (defaul: track)</li>
<li><em>interval</em>: year, month, day (default: day)</li>
<li><em>interval_count</em>: How many year, mont or day (default: 31)</li>
<li><em>js_options</em>: Name of javascript variable holding chart options</li>
<li><em>kind</em>: Chart type line or bar (default: line)</li>
<li><em>to_date</em>: Current date by default, post date if ‘post’ specified else value supplied </li>
<li><em>dump</em>: Dumping attributes for debug (default: False)</li>
<li><em>round</em>: Rounding data with specified precision</li>
</ol>
<h3>Note</h3>
<p>Beta software… Interface may change.</p>


Wp Custom Field Chart

Make chart from custom field attached to your post/page using Chart.js javascript library.

Tran Ngoc Tuan Anh

Meta Box

barcavn2

<p><a href="https://metabox.io/plugins/mb-rest-api/" rel="nofollow ugc"><strong>MB Rest API</strong></a> is an extension for <a href="https://metabox.io" rel="nofollow ugc">Meta Box</a> which helps you to get and update custom fields’ values (meta value) from posts, pages, custom post types, terms via the WordPress REST API.</p>
<blockquote>
<p><strong>Meta Box Lite</strong><br />
  We recommend using <a href="https://metabox.io/lite/" rel="nofollow ugc">Meta Box Lite</a>, a feature-rich free UI version of Meta Box that provides UI and all free features for managing custom fields and dynamic content on WordPress, including post types, taxonomies, custom fields, and relationships.</p>
</blockquote>
<h3>Plugin Links</h3>
<ul>
<li><a href="https://metabox.io/plugins/mb-rest-api/" rel="nofollow ugc">Project Page</a></li>
<li><a href="https://docs.metabox.io/extensions/mb-rest-api/" rel="nofollow ugc">Documentation</a></li>
<li><a href="https://github.com/rilwis/mb-rest-api/" rel="nofollow ugc">Github Repo</a></li>
</ul>
<p>See more <a href="https://metabox.io/plugins/" rel="nofollow ugc">Meta Box plugins</a>.</p>
<h3>You might also like</h3>
<p>If you like this plugin, you might also like our other WordPress products:</p>
<ul>
<li><a href="https://wpslimseo.com" rel="nofollow ugc">Slim SEO</a> – A fast, lightweight and full-featured SEO plugin for WordPress with minimal configuration.</li>
<li><a href="https://wpfalcon.pro" rel="nofollow ugc">Falcon</a> – A lightweight companion for making WordPress faster, cleaner, and more secure.</li>
<li><a href="https://gretathemes.com" rel="nofollow ugc">GretaThemes</a> – Free and premium WordPress themes that clean, simple and just work.</li>
<li><a href="https://wpautolistings.com" rel="nofollow ugc">Auto Listings</a> – A car sale and dealership plugin for WordPress.</li>
</ul>


MB Rest API

Get and update Meta Box custom fields to the WordPress REST API responses.

Wp Custom Field Chart vs MB Rest API