It seems chart.js pie chart needs numbers larger than 1 or 2 to complete a full pie. When I have small values passed it only renders a small sliver of the pie chart, instead of a full pie. (albeit, the chart is still accurate in its own right).
Is there a fix to this? Have I missed the boat on something?
My use is to display the number of tasks each user has in a project. Sometimes that number is very small - ie. 1. When larger numbers are passed it works perfectly.
Any insight is greatly appreciated. Note: $row[0] is an integer (in this
case it may be small numbers. ie: 1)
$cnt=0;
while ($row = mysql_fetch_array($res))
{
$pieData[] = array('value' => $row[0],
'color' => $piesectioncolor[$cnt],
'highlight' => '#aaaaaa',
'label' => ucfirst($row[2])." . ucfirst($row[3]));
$cnt++;
}
<script>
var pieData = <? echo json_encode($pieData); ?>;
var ctx = document.getElementById("chart-area").getContext("2d");
window.myPie = new Chart(ctx).Pie(pieData);
Related
I am trying to set an option for a specific graph in the decimal form. I went through many questions, but I can't seem to figure out why it isn't working for me.
var temp_chart_options = {
title: 'Temperature',
hAxis: {title: 'Date', titleTextStyle: {color: '#262626'}, format:'decimal' },
vAxis: {minValue: 0, format: 'decimal'},
keepInBounds: true,
};
temp_chart.draw(temp_data, temp_chart_options);
I tried doing format: 'decimal', or format: { pattern: 'decimal' } and even did temp_chart.draw(data, google.charts.Line.convertOptions(temp_chart_options)); and even looked at these questions:
google chart vertical axis and tooltip value formatting
Google Chart Vertical Axis and Tooltip Value Formatting
How to format numbers in Google API Linechart?
But none of them seem to work :(
EDIT
Does anyone know how to change the format of the hover?
The format parameter on your vertical axis needs to specify a proper format pattern. For example, vaxis: {format:'0.00'} will give you a number with two decimal places after it.
Note that Google's documentation is very incomplete about this. They give an example using the presets, and an example of using separators (e.g. '#,###'), but there is no example showing decimal places, nor is there any complete documentation on number format specifiers that I could find. Perhaps it is documented elsewhere, but the page I linked to above ought to at least provide a link to it if so. It does not. I discovered the 0.00 format by experimentation.
As an addition to the accepted answer, I needed to do a currency in GBP with 1000's separators and 2 decimal places.
The given Google 'currency' was unsuitable as it renders the currency symbol in your local currency.
I came up with this:
format: '£#,###.##'
Which could theoretically be used with any currency symbol.
This was the result:
I am trying to display labels on top of bars using chart.js. My Y.-Axis has custom labels, like: scaleLabel : "<%= value + '$' %>"
So, my bar chart y.axis would be something like 1000$, 2000$ etc..
When I display lables on top of each bar, the values are displayed as 1000, 2000 etc..
Is there a way to display custom y-axis label on top of each bar?
I am looking something like, instead of 5000, how can i display "5000$" on top of each bar?
If you have a single dataset set the tooltipTemplate in the options.
If you have several datasets set the multiTooltipTemplate in the options.
var options = {
scaleLabel : "<%= value + '$' %>",
// String - Template string for single tooltips
tooltipTemplate: "<%if (label){%><%=label %>: <%}%><%= value + '$' %>",
// String - Template string for multiple tooltips
multiTooltipTemplate: "<%= value + '$' %>",
};
See an example here.
And the documentation here.
I have a combo chart where I display a candle stick chart. I have defined series option as:
[{type: "candlesticks", targetAxisIndex:1}]
It works perfectly. Now, when a user clicks a button I want to display the same data in a line chart, instead of candlesticks. I want that the line is going through exit points of candles. What I am doing right now is that I change my series to:
[{type: "line", lineWidth:0, targetAxisIndex:1}, {type: "line", lineWidth:0, targetAxisIndex:1}, {type: "line", color:"blue", lineWidth:1, targetAxisIndex:1}, {type: "line", lineWidth:0, targetAxisIndex:1}]
I.e. I change the chart to 4 line charts with 3 of them having line with width equal to zero. It works well, however I feel it is not a good solution, because the library is probably recalculating and rendering all 4 lines. Is there a better solution to ignore a data serie from a combo chart?
I'm trying to use the Neo4j 2.1.5 regex matching in Cypher and running into problems.
I need to implement a full text search on specific fields that a user has access to. The access requirement is key and is what prevents me from just dumping everything into a Lucene instance and querying that way. The access system is dynamic and so I need to query for the set of nodes that a particular user has access to and then within those nodes perform the search. I would really like to match the set of nodes against a Lucene query, but I can't figure out how to do that so I'm just using basic regex matching for now. My problem is that Neo4j doesn't always return the expected results.
For example, I have about 200 nodes with one of them being the following:
( i:node {name: "Linear Glass Mosaic Tiles", description: "Introducing our new Rip Curl linear glass mosaic tiles. This Caribbean color combination of greens and blues brings a warm inviting feeling to a kitchen backsplash or bathroom. The colors work very well with white cabinetry or larger tiles. We also carry this product in a small subway mosaic to give you some options! SOLD OUT: Back in stock end of August. Call us to pre-order and save 10%!"})
This query produces one result:
MATCH (p)-->(:group)-->(i:node)
WHERE (i.name =~ "(?i).*mosaic.*")
RETURN i
> Returned 1 row in 569 ms
But this query produces zero results even though the description property matches the expression:
MATCH (p)-->(:group)-->(i:node)
WHERE (i.description=~ "(?i).*mosaic.*")
RETURN i
> Returned 0 rows in 601 ms
And this query also produces zero results even though it includes the name property which returned results previously:
MATCH (p)-->(:group)-->(i:node)
WITH i, (p.name + i.name + COALESCE(i.description, "")) AS searchText
WHERE (searchText =~ "(?i).*mosaic.*")
RETURN i
> Returned 0 rows in 487 ms
MATCH (p)-->(:group)-->(i:node)
WITH i, (p.name + i.name + COALESCE(i.description, "")) AS searchText
RETURN searchText
>
...
SotoLinear Glass Mosaic Tiles Introducing our new Rip Curl linear glass mosaic tiles. This Caribbean color combination of greens and blues brings a warm inviting feeling to a kitchen backsplash or bathroom. The colors work very well with white cabinetry or larger tiles. We also carry this product in a small subway mosaic to give you some options! SOLD OUT: Back in stock end of August. Call us to pre-order and save 10%!
...
Even more odd, if I search for a different term, it returns all of the expected results without a problem.
MATCH (p)-->(:group)-->(i:node)
WITH i, (p.name + i.name + COALESCE(i.description, "")) AS searchText
WHERE (searchText =~ "(?i).*plumbing.*")
RETURN i
> Returned 8 rows in 522 ms
I then tried to cache the search text on the nodes and I added an index to see if that would change anything, but it still didn't produce any results.
CREATE INDEX ON :node(searchText)
MATCH (p)-->(:group)-->(i:node)
WHERE (i.searchText =~ "(?i).*mosaic.*")
RETURN i
> Returned 0 rows in 3182 ms
I then tried to simplify the data to reproduce the problem, but in this simple case it works as expected:
MERGE (i:node {name: "Linear Glass Mosaic Tiles", description: "Introducing our new Rip Curl linear glass mosaic tiles. This Caribbean color combination of greens and blues brings a warm inviting feeling to a kitchen backsplash or bathroom. The colors work very well with white cabinetry or larger tiles. We also carry this product in a small subway mosaic to give you some options! SOLD OUT: Back in stock end of August. Call us to pre-order and save 10%!"})
WITH i, (
i.name + " " + COALESCE(i.description, "")
) AS searchText
WHERE searchText =~ "(?i).*mosaic.*"
RETURN i
> Returned 1 rows in 630 ms
I tried using the CYPHER 2.1.EXPERIMENTAL tag as well but that didn't change any of the results. Am I making incorrect assumptions on how the regex support works? Is there something else I should try or some other way to debug the problem?
Additional information
Here is a sample call that I make to the Cypher Transactional Rest API when creating my nodes. This is the actual plain text that is sent (other than some formatting for easier reading) when adding nodes to the database. Any string encoding is just standard URL encoding that is performed by Go when creating a new HTTP request.
{"statements":[
{
"parameters":
{
"p01":"lsF30nP7TsyFh",
"p02":
{
"description":"Introducing our new Rip Curl linear glass mosaic tiles. This Caribbean color combination of greens and blues brings a warm inviting feeling to a kitchen backsplash or bathroom. The colors work very well with white cabinetry or larger tiles. We also carry this product in a small subway mosaic to give you some options! SOLD OUT: Back in stock end of August. Call us to pre-order and save 10%!",
"id":"lsF3BxzFdn0kj",
"name":"Linear Glass Mosaic Tiles",
"object":"material"
}
},
"resultDataContents":["row"],
"statement":
"MATCH (p:project { id: { p01 } })
WITH p
CREATE UNIQUE (p)-[:MATERIAL]->(:materials:group {name: \"Materials\"})-[:MATERIAL]->(m:material { p02 })"
}
]}
If it is an encoding issue, why does a search on name work, description not work, and name + description not work? Is there any way to examine the database to see if/how the data was encoded. When I perform searches, the text returned appears correct.
just a few notes:
probably replace create unique with merge (which works a bit differently)
for your fulltext search I would go with the lucene legacy index for performance, if your group restriction is not limiting enough to keep the response below a few ms
I just tried your exact json statement, and it works perfectly.
inserted with
curl -H accept:application/json -H content-type:application/json -d #insert.json \
-XPOST http://localhost:7474/db/data/transaction/commit
json:
{"statements":[
{
"parameters":
{
"p01":"lsF30nP7TsyFh",
"p02":
{
"description":"Introducing our new Rip Curl linear glass mosaic tiles. This Caribbean color combination of greens and blues brings a warm inviting feeling to a kitchen backsplash or bathroom. The colors work very well with white cabinetry or larger tiles. We also carry this product in a small subway mosaic to give you some options! SOLD OUT: Back in stock end of August. Call us to pre-order and save 10%!",
"id":"lsF3BxzFdn0kj",
"name":"Linear Glass Mosaic Tiles",
"object":"material"
}
},
"resultDataContents":["row"],
"statement":
"MERGE (p:project { id: { p01 } })
WITH p
CREATE UNIQUE (p)-[:MATERIAL]->(:materials:group {name: \"Materials\"})-[:MATERIAL]->(m:material { p02 }) RETURN m"
}
]}
queried:
MATCH (p)-->(:group)-->(i:material)
WHERE (i.description=~ "(?i).*mosaic.*")
RETURN i
returns:
name: Linear Glass Mosaic Tiles
id: lsF3BxzFdn0kj
description: Introducing our new Rip Curl linear glass mosaic tiles. This Caribbean color combination of greens and blues brings a warm inviting feeling to a kitchen backsplash or bathroom. The colors work very well with white cabinetry or larger tiles. We also carry this product in a small subway mosaic to give you some options! SOLD OUT: Back in stock end of August. Call us to pre-order and save 10%!
object: material
What you can try to check your data is to look at the json or csv dumps that the browser offers (little download icons on the result and table-result)
Or you use neo4j-shell with my shell-import-tools to actually output csv or graphml and check those files.
Or use a bit of java (or groovy) code to check your data.
There is also the consistency-checker that comes with the neo4j-enterprise download. Here is a blog post on how to run it.
java -cp 'lib/*:system/lib/*' org.neo4j.consistency.ConsistencyCheckTool /tmp/foo
I added a groovy test script here: https://gist.github.com/jexp/5a183c3501869ee63d30
One more idea: regexp flags
Sometimes there is a multiline thing going on, there are two more flags:
multiline (?m) which also matches across multiple lines and
dotall (?s) which allows the dot also to match special chars like newlines
So could you try (?ism).*mosaic.*
The tooltips can be set to display percentages using the following code:
var formatter = new google.visualization.NumberFormat({
fractionDigits: 2,
suffix: '%'
});
formatter.format(data, 1); // Apply formatter to first column.
Is there a way for NumberFormat to multiply each element by 100? Otherwise the tooltip appears as .50%.
I am using vAxis.format = "format:'#%' " which does multiply by 100. So .5 is displayed as 50% on the vertical axis.
According to the documentation(icu-project.org/apiref), this can be overwritten by enclosing the % in single quotes, but this did not work.
The net result is that the tooltips do not match the axis. What is the best way to do this?
I got this working by specifying a formatter exactly as you do:
var chartData = google.visualization.arrayToDataTable(tableData);
var formatter = new google.visualization.NumberFormat({
fractionDigits: 2,
suffix: '%'
});
formatter.format(chartData, 1);
The 1 in the last call means the second column, in which I have float values.
Then I specify a format for the axis in the chart options, escaping the percentage sign as pointed out by documentation and others here:
var chartOptions = {
vAxis: { format: '#\'%\'' }
};
I then draw the chart:
var chart = new google.visualization.ColumnChart(document.getElementById('chart'));
chart.draw(chartData, chartOptions);
This renders a left side axis with values like 10%, 20% and so on. And the tooltips looks like the default one but with a percentage like 10.10%, 20.20% and so on.
If you want two fraction digits in the left side axis as well, use this as format in the chart options instead:
vAxis: { format: '#.00\'%\'' }
var formatter = new google.visualization.NumberFormat({
pattern: '#%',
fractionDigits: 2
});
Thanks to http://groups.google.com/group/google-visualization-api/
You must surround the percent (%) symbol itself in single quotes.
The line I used to do this looks like this: options['vAxis'] = {'format': "#,###'%'"};
Combining this with your formatter above, you can make the vertical axis have a percent symbol and also make the tooltip include it too.
Ok... So this is a little late. I admit I didn't need this seven years ago. Nevertheless, this worked for me.
var rows = data.getNumberOfRows();
for (var i = 0; i < rows; i++) {
data.setFormattedValue(i, 4, (data.getFormattedValue(i, 4)*100).toFixed(1) + "%"); //LY
data.setFormattedValue(i, 3, (data.getFormattedValue(i, 3)*100).toFixed(1) + "%"); //TY
}
In my case, I am using four columns, two of which are assigned to the right axis with percentages. I wanted those columns' tooltips to reflect the proper percentage rather than the decimal representation.
Here is a link to the Google docs:
https://developers.google.com/chart/interactive/docs/reference#DataTable_setFormattedValue
I hope this helps some random stranger looking for it. ;)